ci: handle first performance-gated main promotion

HACS will install from the named asset instead of the auto zipball, so
GitHub's public download counter becomes a per-version install metric.
The workflow also has a manual dispatch to backfill an existing release.

.gitattributes

@@ -0,0 +1,14 @@
+* text=auto eol=lf
+
+*.png binary
+*.jpg binary
+*.jpeg binary
+*.gif binary
+*.webp binary
+*.ico binary
+*.pdf binary
+*.mp4 binary
+*.webm binary
+*.zip binary
+*.woff binary
+*.woff2 binary

.github/workflows/announce.yml

@@ -0,0 +1,42 @@
+name: Announce release
+# Telegram notifications for t.me/ha_houseplan (owner request, 2026-08-07).
+# Fires on every published release, prereleases included: the workflow file
+# lives at the TAGGED commit, so it works for beta tags cut from dev as soon
+# as this file is on dev, and for stable tags once it reaches main.
+# workflow_dispatch exists purely as a connectivity test button.
+on:
+  release:
+    types: [published]
+  workflow_dispatch: {}
+permissions: {}
+jobs:
+  telegram:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Send to Telegram
+        env:
+          TOKEN: ${{ secrets.TELEGRAM_BOT_TOKEN }}
+          CHAT: ${{ secrets.TELEGRAM_CHAT_ID }}
+          TAG: ${{ github.event.release.tag_name }}
+          NAME: ${{ github.event.release.name }}
+          URL: ${{ github.event.release.html_url }}
+          PRE: ${{ github.event.release.prerelease }}
+          # The body goes through env, never through shell interpolation —
+          # release notes are arbitrary text.
+          BODY: ${{ github.event.release.body }}
+          EVENT: ${{ github.event_name }}
+        run: |
+          set -euo pipefail
+          if [ "$EVENT" = "workflow_dispatch" ]; then
+            TEXT="✅ Тест: оповещения о релизах houseplan-card подключены."
+          else
+            KIND=$([ "$PRE" = "true" ] && echo "🧪 Пре-релиз" || echo "🏠 Релиз")
+            SUMMARY=$(printf '%s' "$BODY" | head -c 2500)
+            TEXT=$(printf '%s houseplan-card %s — %s\n\n%s\n\n%s' \
+              "$KIND" "$TAG" "$NAME" "$SUMMARY" "$URL")
+          fi
+          curl -sS --fail-with-body -X POST \
+            "https://api.telegram.org/bot$TOKEN/sendMessage" \
+            --data-urlencode "chat_id=$CHAT" \
+            --data-urlencode "text=$TEXT" \
+            -d disable_web_page_preview=true

.github/workflows/release-zip.yml

@@ -0,0 +1,40 @@
+name: Attach HACS zip to release
+# hacs.json declares zip_release + filename=houseplan.zip, so every release
+# (prereleases included) must carry the asset — HACS installs from it and
+# GitHub's public download counter becomes a free per-version install metric
+# (owner request, 2026-08-08). Like announce.yml, the workflow file lives at
+# the TAGGED commit: betas cut from dev pick it up as soon as this file is on
+# dev, stable tags once it reaches main.
+# workflow_dispatch lets us attach the zip to an EXISTING release (needed
+# once for the latest stable after the hacs.json change reaches main).
+on:
+  release:
+    types: [published]
+  workflow_dispatch:
+    inputs:
+      tag:
+        description: "Existing release tag to attach the zip to"
+        required: true
+permissions:
+  contents: write
+jobs:
+  zip:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Resolve tag
+        id: tag
+        env:
+          EVENT_TAG: ${{ github.event.release.tag_name }}
+          INPUT_TAG: ${{ github.event.inputs.tag }}
+        run: echo "tag=${EVENT_TAG:-$INPUT_TAG}" >> "$GITHUB_OUTPUT"
+      - uses: actions/checkout@v4
+        with:
+          ref: ${{ steps.tag.outputs.tag }}
+      - name: Build houseplan.zip (contents of custom_components/houseplan at zip root)
+        run: cd custom_components/houseplan && zip -qr ../../houseplan.zip .
+      - name: Sanity check
+        run: unzip -l houseplan.zip | grep -q "manifest.json"
+      - name: Upload asset
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: gh release upload "${{ steps.tag.outputs.tag }}" houseplan.zip --clobber --repo "$GITHUB_REPOSITORY"

.github/workflows/release.yml

@@ -4,11 +4,43 @@ on:
     types: [published]
 permissions:
   contents: write
+  actions: read
 jobs:
-  build:
+  # AUD-159B7-02: publishing a GitHub Release used to BE the gate — this
+  # workflow only built and uploaded, so an asset shipped while both Validate
+  # runs for the very same commit were red. The asset now waits for a green
+  # Validate of the EXACT commit the tag points at, and is withheld otherwise.
+  #
+  # Needs a push with a token that has the `workflow` scope (the ordinary
+  # Personal Access Token used for `git push` refuses workflow file updates).
+  gate:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
+        with:
+          ref: ${{ github.event.release.tag_name }}
+          fetch-depth: 0
+      - uses: actions/setup-node@v4
+        with: { node-version: 22 }
+      - name: Require a green Validate for this exact commit
+        env:
+          GH_TOKEN: ${{ github.token }}
+          REPO: ${{ github.repository }}
+          TAG: ${{ github.event.release.tag_name }}
+        run: |
+          set -euo pipefail
+          # HEAD is the peeled commit even when TAG is annotated. Do not trust
+          # target_commitish (it may be a branch name) or an event-context SHA.
+          SHA=$(git rev-parse HEAD)
+          echo "release tag: $TAG; exact commit: $SHA"
+          node scripts/release-gate.mjs "$SHA"
+  build:
+    needs: gate
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          ref: ${{ github.event.release.tag_name }}
       - uses: actions/setup-node@v4
         with: { node-version: 22 }
       - run: npm ci && npm run build
@@ -17,3 +49,29 @@ jobs:
         uses: softprops/action-gh-release@v2
         with:
           files: dist/houseplan-card.js
+  hacs-discovery:
+    # HACS 2.0.x takes the first prerelease in GitHub's response instead of
+    # sorting SemVer. A valid asset can therefore be invisible to beta users
+    # (beta.10 appeared after beta.9). Keep the release asset, but
+    # make that distribution failure impossible to miss in the release run.
+    if: ${{ github.event.release.prerelease }}
+    needs: build
+    runs-on: ubuntu-latest
+    steps:
+      - name: Verify the published tag is the prerelease HACS will discover
+        uses: actions/github-script@v7
+        with:
+          script: |
+            const releases = await github.paginate(github.rest.repos.listReleases, {
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              per_page: 100,
+            });
+            const first = releases.find((r) => r.prerelease && !r.draft);
+            const expected = context.payload.release.tag_name;
+            if (first?.tag_name !== expected) {
+              core.setFailed(
+                `HACS prerelease discovery is stale: GitHub returns ${first?.tag_name ?? 'none'} before ${expected}. ` +
+                `Use an rc/new version line or correct the release ordering before announcing the update.`,
+              );
+            }

.github/workflows/validate.yml

@@ -1,6 +1,10 @@
 name: Validate
 on:
   push:
+    # The branch commit is the release-gate authority. An annotated tag points
+    # to the same SHA and must not duplicate every expensive browser/perf job.
+    branches:
+      - '**'
   pull_request:
   schedule:
     - cron: "0 4 * * 1"
@@ -32,8 +36,10 @@ jobs:
         run: npm test
       - name: Build
         run: npm run build
-      - name: Card bundle in sync with integration
-        run: cmp dist/houseplan-card.js custom_components/houseplan/frontend/houseplan-card.js
+      - name: Card bundle snapshots in sync
+        run: |
+          cmp dist/houseplan-card.js custom_components/houseplan/frontend/houseplan-card.js
+          cmp dist/houseplan-card.js demo/srv/assets/houseplan-card.js
   smoke:
     # audit T2: the end-to-end layer used to run only when a human remembered.
     # Gated on `frontend` so a typecheck failure does not burn browser minutes.
@@ -47,8 +53,8 @@ jobs:
       - name: Install Chromium for Playwright
         run: npx playwright install --with-deps chromium
       - name: Build a FRESH bundle for the smokes
-        # the committed demo/srv/assets copy is a snapshot; testing it would
-        # report green about code that no longer exists (audit T2)
+        # Never depend on a previous job's artefact; build the exact source
+        # under test again before the browser suite.
         run: npm run build && cp dist/houseplan-card.js demo/srv/assets/houseplan-card.js
       - name: Smoke suite
         run: |
@@ -72,10 +78,123 @@ jobs:
           name: smoke-logs
           path: /tmp/smoke-logs
 
+  golden:
+    # Separate deterministic pixel layer. Before the first reviewed baseline
+    # set it captures candidates; once baselines exist the same job becomes a
+    # blocking comparison and uploads actual/diff/report on failure.
+    needs: frontend
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with: { node-version: 22 }
+      - run: npm ci
+      - name: Install pinned Chromium
+        run: npx playwright install --with-deps chromium
+      - name: Build the exact source under review
+        run: npm run build && cp dist/houseplan-card.js demo/srv/assets/houseplan-card.js
+      - name: Capture or verify golden matrix
+        id: golden
+        run: |
+          if find demo/golden/baselines -maxdepth 1 -name '*.png' -print -quit | grep -q .; then
+            echo "has_baselines=true" >> "$GITHUB_OUTPUT"
+            npm run golden:verify
+          else
+            echo "has_baselines=false" >> "$GITHUB_OUTPUT"
+            npm run golden:capture
+          fi
+      - name: Upload golden candidates/diffs
+        if: failure() || steps.golden.outputs.has_baselines == 'false'
+        uses: actions/upload-artifact@v4
+        with:
+          name: golden-images
+          path: artifacts/golden
+
+  performance:
+    # Candidate and base SHA run sequentially on the same hosted runner with
+    # one Playwright/Chromium installation. This avoids turning a developer
+    # laptop or cross-runner variance into a timing budget.
+    needs: frontend
+    runs-on: ubuntu-latest
+    steps:
+      - name: Check out candidate
+        uses: actions/checkout@v4
+        with:
+          path: candidate
+          fetch-depth: 2
+      - name: Resolve comparison SHA
+        id: base
+        working-directory: candidate
+        env:
+          EVENT_NAME: ${{ github.event_name }}
+          PR_BASE_SHA: ${{ github.event.pull_request.base.sha }}
+          PUSH_BEFORE_SHA: ${{ github.event.before }}
+        run: |
+          if [ "$EVENT_NAME" = "pull_request" ] && [ -n "$PR_BASE_SHA" ]; then
+            sha="$PR_BASE_SHA"
+          elif [ "$EVENT_NAME" = "push" ] && [ -n "$PUSH_BEFORE_SHA" ] && ! printf '%s' "$PUSH_BEFORE_SHA" | grep -Eq '^0+$'; then
+            sha="$PUSH_BEFORE_SHA"
+          else
+            sha="$(git rev-parse HEAD^)"
+          fi
+          # The first main promotion after HP-PERF-01 can legitimately point
+          # at an older stable commit which predates the benchmark's embedded
+          # bundle fingerprint. Comparing against that legacy tree would fail
+          # the freshness guard before any measurements are taken. Fall back
+          # to the candidate's direct parent, which is the last dev revision
+          # included in the promotion and already has the current harness.
+          git fetch --no-tags --depth=1 origin "$sha"
+          if ! git cat-file -e "${sha}:demo/bundle-freshness.mjs" 2>/dev/null; then
+            echo "comparison $sha predates HP-PERF-01; using HEAD^" >&2
+            sha="$(git rev-parse HEAD^)"
+          fi
+          echo "sha=$sha" >> "$GITHUB_OUTPUT"
+      - name: Check out base SHA
+        uses: actions/checkout@v4
+        with:
+          ref: ${{ steps.base.outputs.sha }}
+          path: baseline
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 22
+          cache: npm
+          cache-dependency-path: |
+            candidate/package-lock.json
+            baseline/package-lock.json
+      - name: Install candidate and baseline dependencies
+        run: npm ci --prefix candidate && npm ci --prefix baseline
+      - name: Install pinned Chromium
+        working-directory: candidate
+        run: npx playwright install --with-deps chromium
+      - name: Build both exact source trees
+        run: |
+          npm --prefix candidate run build
+          cp candidate/dist/houseplan-card.js candidate/demo/srv/assets/houseplan-card.js
+          npm --prefix baseline run build
+          cp baseline/dist/houseplan-card.js baseline/demo/srv/assets/houseplan-card.js
+      - name: Capture base and candidate profiles
+        working-directory: candidate
+        run: |
+          npm run benchmark:large-house -- --target-root=../baseline --samples=7 --warmups=1 --output=../artifacts/performance/baseline.json
+          npm run benchmark:large-house -- --target-root=. --samples=7 --warmups=1 --output=../artifacts/performance/candidate.json
+      - name: Enforce performance budgets
+        working-directory: candidate
+        run: npm run benchmark:compare -- --baseline=../artifacts/performance/baseline.json --candidate=../artifacts/performance/candidate.json --output=../artifacts/performance/comparison.json
+      - name: Upload performance reports
+        if: always()
+        uses: actions/upload-artifact@v4
+        with:
+          name: large-house-performance
+          path: artifacts/performance
+
   backend:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
+      # Browser fixtures are generated by their real ESM factories and then
+      # validated through the Python CONFIG_SCHEMA/LAYOUT_SCHEMA in the same test.
+      - uses: actions/setup-node@v4
+        with: { node-version: 22 }
       - uses: actions/setup-python@v5
         with: { python-version: "3.13" }
       - run: pip install pytest voluptuous pytest-homeassistant-custom-component home-assistant-frontend

.gitignore

@@ -5,3 +5,4 @@ test-build/
 __pycache__/
 .pytest_cache/
 .venv-backend/
+artifacts/

AGENTS.md

@@ -8,12 +8,48 @@ House Plan is one HACS package with two parts plus a demo harness:
 
 Standard commands live in `package.json` scripts, `CONTRIBUTING.md`, and `docs/DEVELOPMENT.md`. Read `docs/ARCHITECTURE.md` and `docs/STATUS.md` before non-trivial changes.
 
+## Canonical backlog
+
+GitHub is the only active backlog for House Plan:
+
+- [GitHub Issues](https://github.com/Matysh/houseplan-card/issues) are the
+  canonical task records: problem, scope, acceptance criteria and discussion.
+- [GitHub Projects (v2)](https://github.com/users/Matysh/projects/1) is
+  the canonical prioritization and workflow-status view. Every open in-scope
+  issue must be present there.
+
+Before starting planned work, find or create its issue and keep its description,
+labels and Project status current as decisions and implementation state change.
+Close an issue only after the result is verified. Specs, audits and ADRs may
+remain under `docs/`, but must link to their issue and must not become a parallel
+task list. When repository documentation disagrees with Issues or Project v2,
+the GitHub backlog wins.
+
 ## Cursor Cloud specific instructions
 
 The startup update script already runs `npm ci`, provisions a Python 3.13 backend venv at `.venv-backend`, and installs Playwright Chromium. You do not need to reinstall dependencies.
 
-- **Frontend** (from repo root): `npm run typecheck`, `npm test` (node:test, ~270 tests), `npm run build`. After building, keep the integration copy in sync — `cp dist/houseplan-card.js custom_components/houseplan/frontend/`. CI enforces `cmp dist/houseplan-card.js custom_components/houseplan/frontend/houseplan-card.js` byte-for-byte.
-- **Backend HA-harness tests need Python 3.13, not the system 3.12.** Run them with the venv: `.venv-backend/bin/python -m pytest tests_backend/ -q` (126 tests). Running `python3 -m pytest tests_backend` on the system 3.12 silently **skips** the `test_ha_*.py` harness tests (`conftest.py` ignores them when `homeassistant` is not importable) and runs only the ~83 pure tests.
-- **Running the app / smoke suite**: build a fresh bundle and copy it into the demo assets first — `npm run build && cp dist/houseplan-card.js demo/srv/assets/houseplan-card.js` — then run `node demo/smoke_*.mjs`. The committed `demo/srv/assets/houseplan-card.js` is a stale snapshot; testing it reports green about code that no longer exists. No real Home Assistant server is required: `demo/srv/demo.html` stubs `hass`, registries and `callService`.
+- **Frontend** (from repo root): `npm run typecheck`, `npm test` (node:test, 424 tests at v1.60.0), `npm run build`. After building, keep both committed snapshots in sync — `cp dist/houseplan-card.js custom_components/houseplan/frontend/` and `cp dist/houseplan-card.js demo/srv/assets/`. CI enforces both comparisons byte-for-byte.
+- **Backend HA-harness tests need Python 3.13, not the system 3.12.** Run them with the venv: `.venv-backend/bin/python -m pytest tests_backend/ -q` (150 tests at v1.60.0: 100 pure + 50 HA harness). Running `python3 -m pytest tests_backend` without Home Assistant silently **skips** the `test_ha_*.py` harness tests (`conftest.py` ignores them when `homeassistant` is not importable) and runs only the pure set.
+- **Running the app / smoke suite**: build a fresh bundle and copy it into the demo assets first — `npm run build && cp dist/houseplan-card.js demo/srv/assets/houseplan-card.js` — then run `node demo/smoke_*.mjs`. The committed demo snapshot must remain byte-identical to `dist` (CI checks it); rebuilding first also guarantees the browser suite tests the current source in an uncommitted worktree. No real Home Assistant server is required: `demo/srv/demo.html` stubs `hass`, registries and `callService`.
+- **Golden images**: `npm run golden:capture` and `npm run golden:verify` refuse a stale demo bundle. Build and copy the current bundle first, then review `artifacts/golden/actual/` and `diff/`. Update baselines only with `npm run golden:accept -- --reviewed`, using the complete Linux CI artifact; never accept a partial scenario or images merely to make CI green. See `demo/golden/README.md`.
+- **Freshness contract**: the embedded fingerprint covers `src/` plus Rollup, TypeScript and package-lock build inputs. Benchmark and golden tooling must call `assertFreshDemoBundle` before recording any result; a missing or mismatched fingerprint is a hard failure, not a warning.
 - **Demo harness render quirk**: the fake `hass` in `demo.html` is set once, so opening the page directly in a browser renders the floor plan but **device icons only appear after a re-render** (an F5 refresh, or nudging `card.hass = {...card.hass}`). The smoke launcher `demo/serve.mjs` already does this nudge; a plain browser session does not. This is a harness limitation, not a card bug.
 - **Known environment-sensitive smoke**: `demo/smoke_opening_measure.mjs` fails two sub-checks (`place_dialog_x_magnetised`, `place_committed_x_center`) under the pinned Chromium — a `1e-6`-tolerance magnet-snap on the opening-*placement* path. It reproduces against the pristine committed bundle, so treat it as pre-existing/pixel-precision, not a regression you introduced.
+- **Owner's local Windows checkout is invisible here.** Path
+  `C:\Users\Sergey\Downloads\dev\houseplan-dev` (workflow notes + often
+  unpushed edits) is **not mounted** into managed Cloud Agent VMs. Do not
+  expect to `ls` or diff that folder. To bring local work into the cloud
+  agent: push a branch to GitHub and say its name, or run a **local** Cursor
+  Agent / My Machines worker inside that checkout. Day-to-day source of truth
+  for cloud sessions remains **`origin/dev`** (minors) and **`origin/main`**
+  (releases) — see `docs/STATUS.md`.
+
+## Promotion rule
+
+Every new feature or material behaviour change must be published as a beta/RC
+before it can enter a stable release, even when its local audit is clean. The
+stable release commit is promotion-only: version fields, generated bundle
+snapshots and changelog/release metadata. Do not add feature source code in
+that commit. An explicit owner-requested emergency hotfix is the only exception
+and must be called out in the release handoff.

CONTRIBUTING.md

@@ -16,6 +16,16 @@ writing code? The **[Telegram chat @ha_houseplan](https://t.me/ha_houseplan)**
 is the quickest route to the author and other users. Bugs and concrete feature
 requests still belong in [issues](https://github.com/Matysh/houseplan-card/issues).
 
+## Backlog and work status
+
+[GitHub Issues](https://github.com/Matysh/houseplan-card/issues) and the linked
+[GitHub Project v2](https://github.com/users/Matysh/projects/1) are the
+only active project backlog. Issues own scope and acceptance criteria; Project
+v2 owns prioritization and workflow status. Before starting planned work, link
+it to an existing issue or create one, add it to the Project, and keep both
+surfaces current until the verified result is closed. Design specs and ADRs may
+support an issue, but they do not replace it or maintain a separate checklist.
+
 ## Five-minute setup
 
 ```bash

README.md

@@ -15,6 +15,11 @@ room, Zigbee signal maps, glowing light pools and a fullscreen kiosk mode for wa
 tablets. No YAML, no Inkscape, no external editors — the whole floorplan lives
 right on your Lovelace dashboard.
 
+> **Use a desktop computer to edit plans.** View and kiosk are fully supported
+> on phones and tablets. The editors are designed primarily for a desktop
+> browser with a mouse and keyboard; individual editing operations on touch
+> devices may be awkward, limited, or unavailable.
+
 ![Interactive Home Assistant floor plan: live rooms, devices, lights and climate on a real floorplan card](docs/images/demo.gif)
 
 > ### 🚀 Try it live — no install needed
@@ -84,16 +89,27 @@ The integration consists of two parts that are installed together:
 
 ## How it differs from alternatives
 
-A house plan in Home Assistant is usually built with `picture-elements`, `ha-floorplan` and similar solutions. There you have to write YAML by hand, calculate the coordinates of every icon, and edit the config again after every change. House Plan works differently:
+A house plan in Home Assistant is usually built with `picture-elements`,
+`ha-floorplan`, or newer GUI cards that draw walls and furniture in the
+dashboard. Those either lock you into YAML/SVG, or store the plan in the
+Lovelace card config. House Plan is a **shared live map** backed by a Home
+Assistant integration:
 
-| | House Plan | Typical solutions (picture-elements / ha-floorplan) |
-|---|---|---|
-| **Setup** | Entirely through the UI, with the mouse | Manual YAML and code editing |
-| **Adding devices** | Automatic, by room | You type in every entity by hand |
-| **Icon coordinates** | Drag with the mouse | You count pixels and write them into the config |
-| **Room markup** | Built-in outline editor | You draw in an external SVG editor |
-| **Storage** | On the HA server (shared by all devices) | In the dashboard YAML |
-| **Zoom** | Smooth zoom, everything stays crisp (vector) | Usually a fixed image |
+| | House Plan | picture-elements / ha-floorplan | GUI draw cards (e.g. easy-floorplan) |
+|---|---|---|---|
+| **Setup** | Entirely through the UI, with the mouse | Manual YAML / Inkscape SVG | In-card drawing of walls & furniture |
+| **Adding devices** | Automatic, by HA **area** | You type every entity by hand | Place entities by hand on the drawing |
+| **Icon coordinates** | Drag with the mouse | Count pixels into YAML | Drag on the canvas |
+| **Room markup** | Built-in outline editor bound to areas | External SVG editor | Draw walls yourself (furniture CAD) |
+| **Storage** | On the HA server (`.storage`, shared, multi-client) | In the dashboard YAML | In the card / dashboard YAML |
+| **Overlays** | Glow, climate, LQI, sun, vacuums, kiosk | Whatever you script in SVG/CSS | Varies by card |
+| **Zoom** | Smooth vector zoom | Usually a fixed image | SVG / virtual canvas |
+
+**One sentence:** House Plan is the shared, area-aware live map of your home —
+not a general-purpose CAD package. Its Background editor covers practical
+decor, labels and furniture; if you need unrestricted architectural drafting,
+a draw-centric tool may fit better. With a plan and HA areas, House Plan keeps
+every tablet on the same live layout.
 
 Key advantages in short:
 
@@ -102,11 +118,17 @@ Key advantages in short:
 - **Manual additions of your own.** Any device, group or even a "virtual" point can be placed on the plan manually, with a name, icon, model, link and an attached PDF manual.
 - **Live states.** Temperature, Zigbee signal strength, on/off, open/closed — everything updates in real time.
   Icon colors follow one principle — **yellow means the device is doing its main job right now**:
-  a light is shining, a socket is powering, a fan is spinning, media is playing, a vacuum is
-  cleaning, a radiator valve is actually heating (not merely enabled). Orange = open / unlocked.
+  a light is shining, a socket is powering, a fan is spinning, a vacuum is
+  cleaning, a radiator valve is actually heating (not merely enabled). For climate integrations,
+  a reported work action is authoritative; when an integration exposes only its enabled HVAC mode,
+  that mode is the best available fallback. Orange = open / unlocked.
   A pulsing red ring = an emergency (leak, smoke, gas). An RGB bulb's colour lives in its glow
   spot (glow fill), where the spot itself is the on/off indicator and the badge stays standard.
   A translucent icon = unavailable. Dark = idle.
+- **A coherent visual Background editor.** Draw lines/shapes, place labels and
+  furniture, edit physical styles and transform every object with the same
+  selection model. The plan image has its own move/resize/rotate tool, numeric
+  properties and shared Undo/Redo.
 - **Crisp zoom.** Zooming in does not "blur" the picture: the plan, labels and icons remain vector-sharp at any scale.
 
 ---
@@ -188,7 +210,7 @@ for each floor (names prefilled, a plan image is asked for one by one; any floor
 
 ![Empty plan — prompt to add a space](docs/images/02-onboarding-empty.png)
 
-In the dialog, set a **name** (for example, "1st floor") and pick the background: **upload** a floor-plan image (SVG, PNG, JPG, WebP), **choose one already uploaded** to the server earlier, or select **"no background, I'll draw the rooms"** for a hand-drawn space. The canvas is infinite; an image keeps its own proportions and can be moved and resized at any time in the Background editor.
+In the dialog, set a **name** (for example, "1st floor") and pick the background: **upload** a floor-plan image (SVG, PNG, JPG, WebP), **choose one already uploaded** to the server earlier, or select **"no background, I'll draw the rooms"** for a hand-drawn space. The canvas is infinite; an image keeps its own proportions by default and can be moved, resized or rotated at any time in the Background editor.
 
 ![Space creation dialog](docs/images/03-space-dialog.png)
 
@@ -212,15 +234,17 @@ Rooms may not overlap: a click strictly inside an existing room, or an outline t
 - **Split** — click a room, then two points on its walls; the chord cuts it in two. The bigger part stays the room it was (name, area, devices); the smaller one asks for a new name and area.
 
 
-### Doors, windows and locks
+### Doors, windows, gates and locks
 
-In markup mode the **"Opening"** tool places doors and windows: click next to a wall and the
+In markup mode the **"Opening"** tool places doors, windows and gates: click next to a wall and the
 opening snaps onto it. Pick the type, the **length in real centimetres** (defaults: door 90 cm,
-window 120 cm), an open/close sensor and — for doors — a **lock entity**.
+window 120 cm, gate 300 cm), an open/close sensor and — for doors and gates — a **lock entity**.
 
 With a sensor bound, the plan comes alive: the door leaf swings on its hinge and the swing arc
 draws itself in as the real door opens; a window opens its two casements. While open, the moving
-parts take an accent colour. A door with a lock shows a padlock badge next to it — green when
+parts take an accent colour. A gate keeps a 3–4 m opening compact on the plan: two half-width
+leaves open only 10° outwards, without a full-width swing arc, while contact, lock and light
+passage work exactly like a door. A door or gate with a lock shows a padlock badge next to it — green when
 locked, orange when unlocked. For safety the lock can **not** be toggled from the plan; a click
 on the opening shows a status card with both states instead.
 
@@ -231,7 +255,7 @@ walls** (it slides around corners too), and a **double click opens its propertie
 
 As soon as you save a room bound to an area, **the devices of that area are automatically laid out inside the outline**. These are the same devices shown on the **Settings → Devices → (filtered by the room)** page — only the meaningful ones, without service records, bridges and duplicates.
 
-By default only meaningful devices make it onto the plan: non-physical ones (service records, bridges, scenes, individual lamps folded into a light group) arrive with the **"Hide device from plan"** checkbox already ticked. The checkbox is yours from then on — every device dialog has it, virtual devices included. To see and un-hide them, open the device editor and press **"Show hidden"**: hidden devices appear as translucent blue ghosts, a click opens the dialog. Hidden devices still count toward the room's Zigbee signal, but cast no light.
+By default only meaningful devices make it onto the plan: non-physical ones (service records, bridges, scenes, individual lamps folded into a light group) arrive with the **"Hide device from plan"** checkbox already ticked. The checkbox is yours from then on — every device dialog has it, virtual devices included. To see and un-hide them, open the device editor and press **"Hidden and disabled"**: user-hidden devices appear as translucent blue ghosts, a click opens the dialog. Hidden devices still count toward the room's Zigbee signal, but cast no light. A device disabled in Home Assistant appears there as a labelled grey service ghost and is excluded from all plan data/actions until it is enabled in HA again.
 
 From here on you can just use the plan: clicking an icon opens the device card with the model, link and a button to jump into Home Assistant.
 
@@ -280,6 +304,10 @@ turned the way it is mounted.
 
 ![Adding a device manually](docs/images/07-marker-dialog.png)
 
+### Styling the plan with card-mod (advanced, unsupported)
+
+The card ships finished and has no CSS field of its own — but if you already run [card-mod](https://github.com/thomasloven/lovelace-card-mod), every object on the plan now carries a stable hook you can aim at: `data-hp="device"` (plus `data-entity`, `data-area`), `data-hp="room"`, `data-hp="opening"`, `data-hp="decor"`, `data-hp="room-label"`, `data-hp="space-tab"`. We promise not to rename them; we do not ship card-mod, do not support it, and are not responsible for what your CSS does to the card. The full table, the examples and the limits are in **[docs/STYLING-HOOKS.md](docs/STYLING-HOOKS.md)**.
+
 ---
 
 ## Uninstalling
@@ -313,7 +341,7 @@ Services → House Plan**.
 
 **Do I need to write anything in YAML?** No. The only line is adding the card to the dashboard; everything else is done with the mouse.
 
-**My devices did not appear on the plan.** A device appears only if its Home Assistant area is bound to a drawn room. Check that the device has a room assigned (Settings → Devices) and that the room is outlined and bound to that area. If the device exists but is hidden (the "Hide device from plan" checkbox — set automatically for bridges, scenes and other non-physical records) — open the device editor, press **"Show hidden"** and untick the box in its dialog.
+**My devices did not appear on the plan.** A device appears only if its Home Assistant area is bound to a drawn room. Check that the device has a room assigned (Settings → Devices) and that the room is outlined and bound to that area. Open the device editor and press **"Hidden and disabled"**: a blue ghost is user-hidden and can be shown; a grey disabled ghost must first be enabled in Home Assistant.
 
 **Can I hide an unwanted device or rename it?** Yes — click the device on the plan and press "Edit" in its card: there you can change the name, icon, model or hide the icon.
 

README.ru.md

@@ -6,6 +6,8 @@
 [![Live demo](https://img.shields.io/badge/демо-попробовать-00c853?logo=homeassistant&logoColor=white)](https://demo.houseplan.tech)
 [![Telegram chat](https://img.shields.io/badge/Telegram-чат-2CA5E0?logo=telegram&logoColor=white)](https://t.me/ha_houseplan)
 
+📘 **[Полное руководство пользователя](docs/USER-GUIDE.ru.md)** · 🗂 **[Беклог проекта](https://github.com/users/Matysh/projects/1)**
+
 **Превратите Home Assistant в живую интерактивную карту дома.** Загрузите или
 нарисуйте план этажа, обведите комнаты мышкой — и умные устройства появятся на
 своих местах: живые состояния, свет по клику, температура и влажность по
@@ -13,6 +15,11 @@
 киоск-режим для настенного планшета. Без YAML, без Inkscape и внешних
 редакторов — весь план настраивается прямо на дашборде.
 
+> **Редактировать планы рекомендуется на компьютере.** Режим просмотра и
+> киоск полноценно поддерживаются на телефонах и планшетах. Редакторы рассчитаны
+> прежде всего на desktop с мышью и клавиатурой: на touch-устройстве отдельные
+> операции могут быть менее удобны, работать ограниченно или отсутствовать.
+
 ![Интерактивный план дома для Home Assistant: комнаты, устройства, свет и климат на реальном поэтажном плане](docs/images/demo.gif)
 
 > ### 🚀 Попробовать вживую — без установки
@@ -29,7 +36,7 @@
   нельзя выйти: рисуйте и ставьте устройства где угодно, тащите план на
   любом зуме, отдаляйтесь, чтобы увидеть всё, и одной кнопкой вписывайте
   план обратно в экран.
-- 🖱 **Редакторы прямо в карточке** — комнаты, двери и окна, комнаты-острова,
+- 🖱 **Редакторы прямо в карточке** — комнаты, двери, окна и ворота, комнаты-острова,
   виртуальные стены и декор-слой рисуются кликами; размеры комнат меняются
   перетаскиванием стен с живыми длинами и площадями; помощник выравнивания и
   линейка в реальных метрах.
@@ -81,16 +88,26 @@ House Plan показывает ваш умный дом так, как он в
 
 ## Чем отличается от аналогов
 
-Обычно план дома в Home Assistant делают через `picture-elements`, `ha-floorplan` и подобные решения. Там приходится вручную писать YAML, вычислять координаты каждой иконки и заново править конфиг при каждом изменении. House Plan устроен иначе:
+Обычно план дома в Home Assistant делают через `picture-elements`, `ha-floorplan`
+или новые GUI-карточки, где стены и мебель рисуют прямо на дашборде. Там либо
+YAML/SVG, либо конфиг живёт в YAML карточки. House Plan — это **общий живой
+план** на серверной интеграции Home Assistant:
 
-| | House Plan | Обычные решения (picture-elements / ha-floorplan) |
-|---|---|---|
-| **Настройка** | Полностью через интерфейс, мышкой | Ручной YAML и правка кода |
-| **Добавление устройств** | Автоматически по комнатам | Каждую сущность вписываете руками |
-| **Координаты иконок** | Перетаскиваете мышью | Считаете пиксели и пишете в конфиг |
-| **Разметка комнат** | Встроенный редактор контуров | Рисуете в стороннем редакторе SVG |
-| **Хранение** | На сервере HA (общее для всех устройств) | В YAML дашборда |
-| **Масштаб** | Плавный зум, всё остаётся чётким (вектор) | Обычно фиксированная картинка |
+| | House Plan | picture-elements / ha-floorplan | GUI-рисовалки (напр. easy-floorplan) |
+|---|---|---|---|
+| **Настройка** | Полностью через интерфейс, мышкой | Ручной YAML / Inkscape SVG | Рисование стен и мебели в карточке |
+| **Добавление устройств** | Автоматически по **зоне** HA | Каждую сущность вписываете руками | Ставите сущности руками на чертёж |
+| **Координаты иконок** | Перетаскиваете мышью | Считаете пиксели в YAML | Drag на холсте |
+| **Разметка комнат** | Встроенный редактор контуров, привязка к зонам | Сторонний SVG-редактор | Сами рисуете стены (мебельный CAD) |
+| **Хранение** | На сервере HA (`.storage`, общее, multi-client) | В YAML дашборда | В карточке / YAML дашборда |
+| **Оверлеи** | Glow, климат, LQI, солнце, пылесосы, киоск | Что пропишете в SVG/CSS | Зависит от карточки |
+| **Масштаб** | Плавный векторный зум | Обычно фиксированная картинка | SVG / виртуальный холст |
+
+**Одной фразой:** House Plan — это общая, area-aware живая карта дома, а не
+универсальная CAD-система. Редактор подложки покрывает практический декор,
+надписи и мебель; для свободного архитектурного черчения лучше отдельный
+draw-инструмент. При наличии плана и зон HA House Plan держит один живой layout
+на всех планшетах.
 
 Ключевые преимущества коротко:
 
@@ -99,12 +116,14 @@ House Plan показывает ваш умный дом так, как он в
 - **Ручное добавление своих.** Любое устройство, группу или даже «виртуальную» точку можно поставить на план вручную, задать имя, иконку, модель, ссылку и приложить PDF-инструкцию.
 - **Живые состояния.** Температура, уровень сигнала Zigbee, вкл/выкл, открыто/закрыто — всё обновляется в реальном времени.
   Цвета значков подчиняются одному принципу — **жёлтый значит «устройство прямо сейчас выполняет свою основную работу»**:
-  лампа светит, розетка подаёт, вентилятор крутится, медиа играет, пылесос убирает, термоголовка
-  реально греет (а не просто включена). Оранжевый = открыто / не заперто. Пульсирующее красное
+  лампа светит, розетка подаёт, вентилятор крутится, пылесос убирает, термоголовка
+  реально греет (а не просто включена). Для climate-сущностей переданное действие приоритетно;
+  если интеграция сообщает только включённый HVAC-режим, он служит лучшим доступным приближением.
+  Оранжевый = открыто / не заперто. Пульсирующее красное
   кольцо = авария (протечка, дым, газ). Цвет RGB-лампы живёт в её пятне света (режим glow),
   где само пятно — индикатор включения, а подложка значка остаётся стандартной.
   Полупрозрачный значок = недоступно. Тёмный = покой.
-- **Подложку можно двигать и масштабировать.** Картинка плана не прибита к холсту: в редакторе подложки её тянут за тело и за угол, а плашка показывает реальный размер в метрах — чертёж и фотография плана наконец совмещаются.
+- **Единый визуальный редактор подложки.** Линии, фигуры, надписи и мебель используют общее выделение, физические стили и Undo/Redo. Картинка плана не прибита к холсту: отдельный инструмент двигает, масштабирует и поворачивает её, а числовой диалог задаёт точный размер и угол.
 - **Чёткий зум.** Приближение не «мылит» картинку: план, подписи и иконки остаются векторно-чёткими на любом масштабе.
 
 ---
@@ -188,7 +207,7 @@ title: План дома
 
 ![Пустой план — предложение добавить пространство](docs/images/02-onboarding-empty.png)
 
-В диалоге задайте **название** (например, «1 этаж») и выберите подложку: **загрузите** картинку плана (SVG, PNG, JPG, WebP), **возьмите уже загруженную** на сервер ранее или отметьте **«без подложки, нарисую комнаты сам»**. Холст бесконечный; картинка сохраняет свои пропорции, а подвинуть и отмасштабировать её можно в любой момент в редакторе подложки.
+В диалоге задайте **название** (например, «1 этаж») и выберите подложку: **загрузите** картинку плана (SVG, PNG, JPG, WebP), **возьмите уже загруженную** на сервер ранее или отметьте **«без подложки, нарисую комнаты сам»**. Холст бесконечный; картинка по умолчанию сохраняет пропорции, а подвинуть, изменить размер или повернуть её можно в любой момент в редакторе подложки.
 
 ![Диалог создания пространства](docs/images/03-space-dialog.png)
 
@@ -212,15 +231,15 @@ title: План дома
 - **Разделить** — кликните комнату, затем две точки на её стенах; хорда разрежет её надвое. Бо́льшая часть остаётся прежней комнатой (имя, зона, устройства), меньшая просит новое имя и зону.
 
 
-### Двери, окна и замки
+### Двери, окна, ворота и замки
 
-В режиме разметки инструмент **«Проём»** ставит двери и окна: кликните рядом со стеной — проём
+В режиме разметки инструмент **«Проём»** ставит двери, окна и ворота: кликните рядом со стеной — проём
 примагнитится к ней. Выберите тип, **длину в реальных сантиметрах** (по умолчанию дверь 90 см,
-окно 120 см), датчик открытия и — для двери — **замок**.
+окно 120 см, ворота 300 см), датчик открытия и — для двери или ворот — **замок**.
 
 С привязанным датчиком план оживает: створка двери поворачивается на петле, и дуга распахивания
 дорисовывается по мере открытия настоящей двери; окно раскрывает две створки. Пока открыто,
-подвижные части подсвечены акцентным цветом. У двери с замком рядом отображается замочек —
+подвижные части подсвечены акцентным цветом. Ворота не занимают полплана даже при ширине 3–4 м: две половинные створки показаны открытыми наружу всего на 10°, без большой дуги. Датчик, замок и пропуск света работают как у двери. У двери или ворот с замком рядом отображается замочек —
 зелёный, когда заперто, оранжевый, когда нет. Ради безопасности замок с плана **нельзя**
 переключить — клик по проёму показывает карточку с обоими статусами.
 
@@ -231,7 +250,7 @@ title: План дома
 
 Как только вы сохранили комнату с привязкой к зоне, **устройства этой зоны автоматически расставляются внутри контура**. Берутся те же устройства, что показаны на странице **Настройки → Устройства → (фильтр по нужной комнате)** — только осмысленные, без служебных записей, мостов и дубликатов.
 
-По умолчанию на план попадают только осмысленные устройства: нефизические (служебные записи, мосты, сцены, лампы, свёрнутые в световую группу) приходят с уже установленной галкой **«Скрыть устройство с плана»**. Дальше галка принадлежит вам — она есть в диалоге каждого устройства, включая виртуальные. Чтобы увидеть и вернуть скрытые, откройте редактор устройств и нажмите **«Показать скрытые»**: скрытые отобразятся полупрозрачными синими призраками, клик открывает диалог. Скрытые устройства учитываются в Zigbee-сигнале комнаты, но света не дают.
+По умолчанию на план попадают только осмысленные устройства: нефизические (служебные записи, мосты, сцены, лампы, свёрнутые в световую группу) могут быть скрыты автоматически. Управление находится в левом нижнем углу диалога устройства: **«Скрыть»** убирает маркер после сохранения, а у уже скрытого маркера там же появляется **«Показать»**. Чтобы найти их, откройте редактор устройств и нажмите **«Скрытые и деактивированные»**: пользовательски скрытые устройства отображаются синими призраками. Деактивированное в HA устройство показывается серым служебным призраком и полностью исключается из данных и действий плана до повторной активации.
 
 Дальше можно просто пользоваться планом: клик по иконке открывает карточку устройства с моделью, ссылкой и кнопкой перехода в Home Assistant.
 
@@ -282,6 +301,10 @@ title: План дома
 
 ![Добавление устройства вручную](docs/images/07-marker-dialog.png)
 
+### Свои стили через card-mod (для продвинутых, без поддержки)
+
+Карточка приезжает готовой, и поля для CSS у неё нет — но если у вас уже стоит [card-mod](https://github.com/thomasloven/lovelace-card-mod), у каждого объекта плана теперь есть стабильный «крючок», за который можно зацепиться: `data-hp="device"` (плюс `data-entity`, `data-area`), `data-hp="room"`, `data-hp="opening"`, `data-hp="decor"`, `data-hp="room-label"`, `data-hp="space-tab"`. Мы обещаем их не переименовывать; сам card-mod мы не поставляем, не поддерживаем и за то, что ваш CSS сделает с карточкой, не отвечаем. Полная таблица, примеры и ограничения — в **[docs/STYLING-HOOKS.md](docs/STYLING-HOOKS.md)**.
+
 ---
 
 ## Удаление
@@ -314,7 +337,7 @@ title: План дома
 
 **Нужно ли что-то писать в YAML?** Нет. Единственная строчка — это добавление карточки на дашборд; всё остальное делается мышкой.
 
-**Мои устройства не появились на плане.** Устройство появляется, только если его зона в Home Assistant привязана к нарисованной комнате. Проверьте, что у устройства задана комната (Настройки → Устройства), а комната обведена и привязана к этой зоне. Если устройство есть, но скрыто (галка «Скрыть устройство с плана» — для мостов, сцен и прочих нефизических записей она ставится автоматически) — откройте редактор устройств, нажмите **«Показать скрытые»** и снимите галку в его диалоге.
+**Мои устройства не появились на плане.** Устройство появляется, только если его зона в Home Assistant привязана к нарисованной комнате. Проверьте, что у устройства задана комната (Настройки → Устройства), а комната обведена и привязана к этой зоне. Откройте **«Скрытые и деактивированные»**: синий призрак можно показать в его диалоге, серый сначала нужно активировать в Home Assistant.
 
 **Можно ли скрыть лишнее устройство или переименовать его?** Да — кликните по устройству на плане и в его карточке нажмите «Редактировать»: там можно сменить имя, иконку, модель или скрыть значок.
 

custom_components/houseplan/__init__.py

@@ -126,6 +126,10 @@ async def async_setup_entry(hass: HomeAssistant, entry: HouseplanConfigEntry) ->
         cfg = stored.get("config")
         lay_stored = await data.store.async_load() or {}
         layout = lay_stored.get("layout") or {}
+        lay_meta = {
+            k: v for k, v in lay_stored.items()
+            if k not in ("layout", "rev", "geom_pending")
+        }
         pending = {
             str(k): v for k, v in (lay_stored.get("geom_pending") or {}).items()
         }
@@ -134,14 +138,14 @@ async def async_setup_entry(hass: HomeAssistant, entry: HouseplanConfigEntry) ->
             lay_rev = int(lay_stored.get("rev", 0))
             if merged != pending:  # 1. the durable intent, before anything moves
                 await data.store.async_save(
-                    {"layout": layout, "rev": lay_rev, "geom_pending": merged}
+                    {**lay_meta, "layout": layout, "rev": lay_rev, "geom_pending": merged}
                 )
             rev = int(stored.get("rev", 0))
             if cfg and migrate_config(cfg):  # 2. the config half
                 rev += 1
                 await data.config_store.async_save({"config": cfg, "rev": rev})
             migrate_layout(layout, merged)  # 3. the layout half + intent cleared
-            await data.store.async_save({"layout": layout, "rev": lay_rev + 1})
+            await data.store.async_save({**lay_meta, "layout": layout, "rev": lay_rev + 1})
             _LOGGER.info(
                 "House Plan: migrated %s space(s) to the square canvas", len(merged)
             )
@@ -149,6 +153,45 @@ async def async_setup_entry(hass: HomeAssistant, entry: HouseplanConfigEntry) ->
             # event must never see one migrated half and one old one
             hass.bus.async_fire("houseplan_config_updated", {"rev": rev})
 
+    # Finish an explicit whole-plan optimization/undo interrupted between the
+    # config and layout store writes. The target was persisted before either
+    # visible half changed, so setup can always converge on the requested pair.
+    optimize_revs: tuple[int, int] | None = None
+    async with data.write_lock:
+        stored = await data.config_store.async_load() or {}
+        lay_stored = await data.store.async_load() or {}
+        pending = lay_stored.get("optimize_pending")
+        if isinstance(pending, dict) and isinstance(pending.get("config"), dict) \
+                and isinstance(pending.get("layout"), dict):
+            target_config = pending["config"]
+            target_layout = pending["layout"]
+            config_rev = int(stored.get("rev", 0))
+            layout_rev = int(lay_stored.get("rev", 0))
+            if stored.get("config") != target_config:
+                config_rev += 1
+                await data.config_store.async_save({
+                    "config": target_config,
+                    "rev": config_rev,
+                })
+            if lay_stored.get("layout", {}) != target_layout:
+                layout_rev += 1
+            layout_meta = {
+                k: v for k, v in lay_stored.items()
+                if k not in ("layout", "rev", "optimize_pending", "optimize_backup")
+            }
+            if not pending.get("clear_backup") and "optimize_backup" in lay_stored:
+                layout_meta["optimize_backup"] = lay_stored["optimize_backup"]
+            await data.store.async_save({
+                **layout_meta,
+                "layout": target_layout,
+                "rev": layout_rev,
+            })
+            optimize_revs = (config_rev, layout_rev)
+            _LOGGER.warning("House Plan: completed an interrupted plan optimization")
+    if optimize_revs is not None:
+        hass.bus.async_fire("houseplan_config_updated", {"rev": optimize_revs[0]})
+        hass.bus.async_fire("houseplan_layout_updated", {"rev": optimize_revs[1]})
+
     await async_check_plan_files(hass, entry)
 
     # Scheduled collection of everything nobody ended up referencing.

custom_components/houseplan/auth.py

@@ -24,5 +24,8 @@ def may_write(hass: HomeAssistant, user) -> bool:
     entry = get_entry(hass)
     if entry is None:
         return is_admin
-    admin_only = bool(entry.options.get(CONF_ADMIN_ONLY, False))
+    # Default TRUE when the key is absent (audit P0-4, 2026-08-05): the card
+    # UI has always been admin-gated, and an unset option must not open every
+    # write WS/HTTP path to every authenticated household user.
+    admin_only = bool(entry.options.get(CONF_ADMIN_ONLY, True))
     return is_admin if admin_only else True

custom_components/houseplan/config_flow.py

@@ -18,7 +18,7 @@ class HouseplanConfigFlow(config_entries.ConfigFlow, domain=DOMAIN):
             return self.async_create_entry(title="House Plan", data={}, options=user_input)
         return self.async_show_form(
             step_id="user",
-            data_schema=vol.Schema({vol.Optional(CONF_ADMIN_ONLY, default=False): bool}),
+            data_schema=vol.Schema({vol.Optional(CONF_ADMIN_ONLY, default=True): bool}),
         )
 
     @staticmethod
@@ -32,7 +32,8 @@ class HouseplanOptionsFlow(config_entries.OptionsFlow):
     async def async_step_init(self, user_input=None):
         if user_input is not None:
             return self.async_create_entry(title="", data=user_input)
-        current = self.config_entry.options.get(CONF_ADMIN_ONLY, False)
+        # Match auth.may_write: missing key ⇒ admin-only (audit P0-4).
+        current = self.config_entry.options.get(CONF_ADMIN_ONLY, True)
         return self.async_show_form(
             step_id="init",
             data_schema=vol.Schema({vol.Optional(CONF_ADMIN_ONLY, default=current): bool}),

custom_components/houseplan/const.py

@@ -45,7 +45,7 @@ PLAN_ORPHAN_TTL_S = 3600
 SCHEDULED_GRACE_S = 30 * 24 * 3600
 FILES_DIR = "houseplan/files"
 CONF_ADMIN_ONLY = "admin_only"
-VERSION = "1.58.0"
+VERSION = "1.60.3"
 
 DEFAULT_CONFIG: dict = {
     "spaces": [],

custom_components/houseplan/diagnostics.py

@@ -31,6 +31,9 @@ async def async_get_config_entry_diagnostics(
                 "has_plan": bool(s.get("plan_url")),
                 "rooms": len(s.get("rooms", [])),
                 "rooms_with_area": sum(1 for r in s.get("rooms", []) if r.get("area")),
+                "room_drafts": len(s.get("room_drafts", [])),
+                "partitions": len(s.get("partitions", [])),
+                "wall_columns": len(s.get("wall_columns", [])),
             }
             for s in config.get("spaces", [])
         ],

custom_components/houseplan/geometry_migration.py

@@ -64,6 +64,16 @@ def migrate_space(space: dict[str, Any]) -> bool:
         if room.get("poly"):
             room["poly"] = [_pt(p, dx, dy, kx, ky) for p in room["poly"]]
 
+    for draft in space.get("room_drafts") or []:
+        draft["points"] = [_pt(p, dx, dy, kx, ky) for p in draft.get("points") or []]
+
+    for part in space.get("partitions") or []:
+        part["a"] = _pt(part.get("a"), dx, dy, kx, ky)
+        part["b"] = _pt(part.get("b"), dx, dy, kx, ky)
+
+    for column in space.get("wall_columns") or []:
+        column["center"] = _pt(column.get("center"), dx, dy, kx, ky)
+
     for op in space.get("openings") or []:
         op["x"] = dx + float(op.get("x", 0)) * kx
         op["y"] = dy + float(op.get("y", 0)) * ky

custom_components/houseplan/manifest.json

@@ -16,5 +16,5 @@
   "issue_tracker": "https://github.com/Matysh/houseplan-card/issues",
   "requirements": [],
   "single_config_entry": true,
-  "version": "1.58.0"
+  "version": "1.60.3"
 }

custom_components/houseplan/quality_scale.yaml

@@ -20,7 +20,7 @@ rules:
     status: done
   config-flow-test-coverage:
     status: done
-    comment: tests_backend/test_config_flow.py (runs in CI on Python 3.13).
+    comment: tests_backend/test_ha_config_flow.py (runs in CI on Python 3.13).
   dependency-transparency:
     status: done
     comment: No external requirements.

custom_components/houseplan/system_health.py

@@ -27,6 +27,9 @@ async def system_health_info(hass: HomeAssistant) -> dict[str, Any]:
         "config_rev": cfg_raw.get("rev", 0),
         "spaces": len(config.get("spaces", [])),
         "rooms": sum(len(s.get("rooms", [])) for s in config.get("spaces", [])),
+        "room_drafts": sum(len(s.get("room_drafts", [])) for s in config.get("spaces", [])),
+        "partitions": sum(len(s.get("partitions", [])) for s in config.get("spaces", [])),
+        "wall_columns": sum(len(s.get("wall_columns", [])) for s in config.get("spaces", [])),
         "markers": len(config.get("markers", [])),
         "layout_entries": len(layout_raw.get("layout", {})),
     }

custom_components/houseplan/trails.py

@@ -90,6 +90,10 @@ class TrailBook:
             return True
         return False
 
+    def delete(self, marker: str) -> bool:
+        """Forget every stored run of one plan marker."""
+        return self.data.pop(marker, None) is not None
+
 
 class TrailRecorder:
     """HA wiring: watch the tracked entities, feed the book, persist, notify."""
@@ -131,6 +135,8 @@ class TrailRecorder:
             cfg = stored.get("config") or {}
             pairs: dict[str, list[tuple[str, str]]] = {}
             for m in cfg.get("markers") or []:
+                if m.get("removed") is True:
+                    continue
                 v = m.get("vacuum") or {}
                 src = v.get("source")
                 if not src or v.get("live") is False:
@@ -141,16 +147,7 @@ class TrailRecorder:
                     # marker records its own copy of the run
                     pairs.setdefault(src, []).append((str(m.get("id")), vac))
             self.pairs = pairs
-            if self._unsub_track:
-                self._unsub_track()
-                self._unsub_track = None
-            # deduplicated: two markers of one robot share source AND vacuum
-            ents = set(self.pairs) | {vac for ps in self.pairs.values() for _, vac in ps}
-            _LOGGER.info("Trail recorder: tracking %s", sorted(ents))
-            if ents:
-                self._unsub_track = async_track_state_change_event(
-                    self.hass, sorted(ents), self._on_state
-                )
+            self._resubscribe()
             # A run already in progress (HA restarted mid-cleanup, or the user
             # just finished calibrating) must start recording NOW, not at the
             # next state change — otherwise the first seconds of the path are
@@ -158,6 +155,41 @@ class TrailRecorder:
             for src in self.pairs:
                 self._sample(src, time.time())
 
+    async def async_delete(self, marker: str) -> bool:
+        """Stop and erase one marker without racing subscription refresh/save."""
+        async with self._refresh_lock:
+            # The trail book owns deletion. When it has no such marker, this
+            # is a no-op and must not silently damage the live tracking graph.
+            removed = self.book.delete(marker)
+            if not removed:
+                return False
+            for src in list(self.pairs):
+                kept = [pair for pair in self.pairs[src] if pair[0] != marker]
+                if kept:
+                    self.pairs[src] = kept
+                else:
+                    del self.pairs[src]
+            self._resubscribe()
+            if self._unsub_save:
+                self._unsub_save()
+                self._unsub_save = None
+            await self.store.async_save(self.book.data)
+        self.hass.bus.async_fire("houseplan_trail_updated", {})
+        return True
+
+    def _resubscribe(self) -> None:
+        """Replace the state subscription for the current pair graph."""
+        if self._unsub_track:
+            self._unsub_track()
+            self._unsub_track = None
+        # deduplicated: two markers of one robot share source AND vacuum
+        ents = set(self.pairs) | {vac for ps in self.pairs.values() for _, vac in ps}
+        _LOGGER.info("Trail recorder: tracking %s", sorted(ents))
+        if ents and not self._closed:
+            self._unsub_track = async_track_state_change_event(
+                self.hass, sorted(ents), self._on_state
+            )
+
     def teardown(self) -> None:
         # HP-1540-05: flag FIRST — a refresh parked on its awaited load must
         # not re-subscribe after this cleanup has already run

custom_components/houseplan/validation.py

@@ -68,6 +68,15 @@ MAX_ROOMS = 400
 MAX_MARKERS = 2000
 MAX_OPENINGS = 500
 MAX_DECOR = 1000
+MAX_WALLS = 500
+MAX_ROOM_DRAFTS = 200
+MAX_DRAFT_SEGMENTS = 2000
+MAX_PARTITIONS = 2000
+MAX_WALL_COLUMNS = 500
+# Open (virtual) wall stretches, docs/superpowers/specs/2026-08-05-open-spans-delete-design.md.
+# Every span is a piece of a shared boundary, so there can never be more of
+# them than there are wall segments — the cap is the walls' one (AUD-159B6-03).
+MAX_OPEN_SPANS = 500
 MAX_LAYOUT = 5000
 # Inner limits (HP-1454-05). The outer collections were capped, the collections
 # INSIDE them were not: a 150 000-point polygon or a 100 000-entry known_devices
@@ -90,6 +99,8 @@ MAX_URL = 2000
 # they can act on. For scale, a real three-floor home with ~200 devices stores
 # about 70 KB, so this is ~30x headroom.
 MAX_CONFIG_BYTES = 2 * 1024 * 1024
+CELL_CM_MIN = 0.1
+CELL_CM_MAX = 1000.0
 
 _TEXT = vol.All(str, vol.Length(max=MAX_TEXT))
 _TEXT_OR_NONE = vol.Any(None, _TEXT)
@@ -142,6 +153,45 @@ def _view_box(value):
 
 POINT = vol.All([_GEOM], vol.Length(min=2, max=2))
 
+# A virtual stretch shorter than this is a click, not a span. Mirrors
+# OPEN_SPAN_MIN_UNITS in src/open-spans.ts (normalised units).
+OPEN_SPAN_MIN_LEN = 1e-3
+
+
+def _open_span(value):
+    """One virtual stretch: exactly two distinct finite points a/b.
+
+    AUD-159B6-03: the field used to ride on `extra=ALLOW_EXTRA` — any shape
+    passed the backend and the card crashed reading `e.a[0]` on render, for
+    every reader of that space. A degenerate span (a == b) is not a stretch
+    either: it can never be hit, closed or drawn, so it is corruption, not data.
+    """
+    if not isinstance(value, dict):
+        raise vol.Invalid("open_span must be an object with a/b points")
+    a = POINT(value.get("a"))
+    b = POINT(value.get("b"))
+    if abs(a[0] - b[0]) < OPEN_SPAN_MIN_LEN and abs(a[1] - b[1]) < OPEN_SPAN_MIN_LEN:
+        raise vol.Invalid("open_span: a and b must differ")
+    out = {k: v for k, v in value.items() if k not in ("a", "b")}
+    out["a"] = a
+    out["b"] = b
+    return out
+
+
+def _dedupe_open_spans(value):
+    """Drop repeats of the same stretch (either direction) — one wall, one span."""
+    seen = set()
+    out = []
+    for span in value:
+        a, b = span["a"], span["b"]
+        fwd = (round(a[0], 6), round(a[1], 6), round(b[0], 6), round(b[1], 6))
+        key = min(fwd, (fwd[2], fwd[3], fwd[0], fwd[1]))
+        if key in seen:
+            continue
+        seen.add(key)
+        out.append(span)
+    return out
+
 
 def _require_geometry(room: dict) -> dict:
     if "poly" in room or all(k in room for k in ("x", "y", "w", "h")):
@@ -207,6 +257,9 @@ SPACE_DISPLAY_SCHEMA = vol.Schema(
         vol.Optional("temp_min"): vol.Coerce(float),
         vol.Optional("temp_max"): vol.Coerce(float),
         vol.Optional("show_lqi"): bool,
+        # "draw less" switches; absent = False = everything is drawn as before
+        vol.Optional("hide_decor"): bool,
+        vol.Optional("hide_openings"): bool,
         vol.Optional("label_temp"): bool,
         vol.Optional("label_hum"): bool,
         vol.Optional("label_lqi"): bool,
@@ -220,9 +273,43 @@ SPACE_DISPLAY_SCHEMA = vol.Schema(
     extra=vol.ALLOW_EXTRA,
 )
 
+# Live text on a decor label (docs/LIVE-TEXT.md). An entity id is
+# `<domain>.<object_id>`; HA itself allows only lowercase letters, digits and
+# underscores in both halves. The bound is a sanity limit, not a policy.
+MAX_ENTITY_ID = 255
+_ENTITY_ID = vol.All(str, vol.Length(min=3, max=MAX_ENTITY_ID),
+                     vol.Match(r"^[a-z0-9_]+\.[a-z0-9_]+$"))
+# A caption is a caption: the inline-reference template is bounded. Attribute
+# and unit bounds below apply only to legacy beta.9 link fields, which remain
+# accepted so an older saved plan can reach the frontend and migrate on edit.
+MAX_DECOR_TEXT = 200
+MAX_DECOR_ATTR = 64
+MAX_DECOR_UNIT = 16
+# The text block is scaled by dragging its corners; the range is what a human
+# could mean on a 1000-unit canvas, the rest is garbage insurance.
+DECOR_TEXT_SCALE_MIN = 0.15
+DECOR_TEXT_SCALE_MAX = 20.0
+DECOR_TEXT_CM_MAX = 2000.0
+# A furniture symbol id (docs/FURNITURE.md). Deliberately NOT the card's list:
+# the backend must accept a plan written by a NEWER card, and a card that has
+# learnt a new symbol must not have to wait for the integration to be updated
+# before the user can save. What is enforced is the shape of the id — a flat
+# lowercase name — and its length; an id this backend has never heard of simply
+# renders as nothing in an older card.
+MAX_FURN_SYMBOL = 32
+_FURN_SYMBOL = vol.All(str, vol.Length(min=1, max=MAX_FURN_SYMBOL),
+                       vol.Match(r"^[a-z0-9_]+$"))
+# …and its size: strictly positive, capped by the same canvas insurance limit
+# an opening's length is. A piece of furniture is a SIZE, not a coordinate.
+_FURN_SIZE = vol.All(_finite, vol.Range(min=0.0000001, max=CANVAS_LIMIT))
+
 _DECOR_COMMON = {
     vol.Required("id"): str,
     vol.Optional("color"): vol.Match(r"^#[0-9a-fA-F]{6}$"),
+    vol.Optional("opacity"): vol.All(_finite, vol.Range(min=0.0, max=1.0)),
+    # Physical centimetres are canonical. `width` remains accepted so plans
+    # written by older cards keep their exact appearance until edited.
+    vol.Optional("width_cm"): vol.All(_finite, vol.Range(min=0.1, max=100)),
     vol.Optional("width"): vol.All(vol.Coerce(float), vol.Range(min=0.1, max=30)),
 }
 # Decor lives on the same unbounded canvas as everything else (docs/CANVAS.md):
@@ -231,24 +318,181 @@ _NORM = vol.All(_finite, vol.Range(min=-CANVAS_LIMIT, max=CANVAS_LIMIT))
 DECOR_SCHEMA = vol.Any(
     vol.Schema({**_DECOR_COMMON, vol.Required("kind"): "line",
                 vol.Required("x1"): _NORM, vol.Required("y1"): _NORM,
-                vol.Required("x2"): _NORM, vol.Required("y2"): _NORM},
+                vol.Required("x2"): _NORM, vol.Required("y2"): _NORM,
+                vol.Optional("line_style"): vol.In(["solid", "dashed"])},
                extra=vol.ALLOW_EXTRA),
     vol.Schema({**_DECOR_COMMON, vol.Required("kind"): vol.In(["rect", "ellipse"]),
                 vol.Required("x"): _NORM, vol.Required("y"): _NORM,
-                vol.Required("w"): _NORM, vol.Required("h"): _NORM,
-                vol.Optional("fill"): bool},
+                # sizes are extents — negative/zero is garbage, not "canvas slack"
+                vol.Required("w"): vol.All(_finite, vol.Range(min=0.001, max=CANVAS_LIMIT)),
+                vol.Required("h"): vol.All(_finite, vol.Range(min=0.001, max=CANVAS_LIMIT)),
+                vol.Optional("angle"): vol.All(_finite, vol.Range(min=-360.0, max=360.0)),
+                vol.Optional("fill"): bool,
+                vol.Optional("fill_color"): vol.Match(r"^#[0-9a-fA-F]{6}$"),
+                vol.Optional("fill_opacity"): vol.All(_finite, vol.Range(min=0.0, max=1.0))},
                extra=vol.ALLOW_EXTRA),
     vol.Schema({**_DECOR_COMMON, vol.Required("kind"): "text",
                 vol.Required("x"): _NORM, vol.Required("y"): _NORM,
-                vol.Required("text"): vol.All(str, vol.Length(min=1, max=200)),
-                vol.Optional("size"): vol.In(["s", "m", "l"])},
+                # the template: newlines are the user's own line breaks and are
+                # kept verbatim (docs/LIVE-TEXT.md); the label never wraps itself
+                vol.Required("text"): vol.All(str, vol.Length(min=1, max=MAX_DECOR_TEXT)),
+                # legacy font size ('s'|'m'|'l'). The dialog no longer offers it
+                # — the block is scaled by its corner handles — but a plan
+                # written before that keeps it, and it is read as the scale it
+                # used to render at. Kept in the schema so it stays BOUNDED.
+                vol.Optional("size"): vol.In(["s", "m", "l"]),
+                # Canonical physical font size plus the legacy scale. Both are
+                # accepted so older plans remain pixel-identical until edited
+                # or explicitly optimized.
+                vol.Optional("size_cm"): vol.All(
+                    _finite, vol.Range(min=0.1, max=DECOR_TEXT_CM_MAX)),
+                vol.Optional("scale"): vol.All(
+                    _finite, vol.Range(min=DECOR_TEXT_SCALE_MIN, max=DECOR_TEXT_SCALE_MAX)),
+                vol.Optional("angle"): vol.All(_finite, vol.Range(min=-360.0, max=360.0)),
+                # Legacy one-value link (beta.9 and earlier). New labels store
+                # every `{entity[:attribute]}` reference directly in `text`;
+                # these stay accepted solely for backward compatibility.
+                vol.Optional("entity"): vol.Any(None, _ENTITY_ID),
+                vol.Optional("attr"): vol.Any(None, vol.All(str, vol.Length(max=MAX_DECOR_ATTR))),
+                vol.Optional("unit"): vol.Any(None, vol.All(str, vol.Length(max=MAX_DECOR_UNIT)))},
+               extra=vol.ALLOW_EXTRA),
+    # A piece of furniture (docs/FURNITURE.md): a symbol id, a normalised box
+    # and an optional rotation. It is a NEW kind, so no existing plan carries
+    # it, nothing is migrated, and an integration that has this branch reads
+    # every older config byte-for-byte as before.
+    vol.Schema({**_DECOR_COMMON, vol.Required("kind"): "furniture",
+                vol.Required("symbol"): _FURN_SYMBOL,
+                vol.Required("x"): _NORM, vol.Required("y"): _NORM,
+                vol.Required("w"): _FURN_SIZE, vol.Required("h"): _FURN_SIZE,
+                vol.Optional("angle"): vol.All(_finite, vol.Range(min=-360.0, max=360.0))},
                extra=vol.ALLOW_EXTRA),
 )
 
-SPACE_SCHEMA = vol.Schema(
+
+def _wall_endpoints_pair(entry: dict) -> dict:
+    """Exact wall endpoints are useful only as a complete a/b pair."""
+    if ("a" in entry) != ("b" in entry):
+        raise vol.Invalid("wall exact endpoints require both a and b")
+    return entry
+
+
+WALL_SCHEMA = vol.All(
+    vol.Schema(
+        {
+            vol.Required("key"): vol.All(str, vol.Length(min=1, max=64)),
+            vol.Required("cm"): vol.All(_finite, vol.Range(min=1, max=100)),
+            # New writes retain exact normalized interval endpoints. The old
+            # key remains the compatibility lookup; endpoints preserve a
+            # differing-thickness breakpoint after a virtual span is closed.
+            vol.Optional("a"): vol.All([_NORM], vol.Length(min=2, max=2)),
+            vol.Optional("b"): vol.All([_NORM], vol.Length(min=2, max=2)),
+        },
+        extra=vol.ALLOW_EXTRA,
+    ),
+    _wall_endpoints_pair,
+)
+
+
+def _room_draft_segments(value: dict) -> dict:
+    """An open draft has exactly one thickness per consecutive edge."""
+    if len(value.get("segments", [])) != max(0, len(value.get("points", [])) - 1):
+        raise vol.Invalid("room draft segments must match consecutive point pairs")
+    if any(a == b for a, b in zip(value.get("points", []), value.get("points", [])[1:])):
+        raise vol.Invalid("room draft consecutive points must differ")
+    return value
+
+
+ROOM_DRAFT_SCHEMA = vol.All(
+    vol.Schema(
+        {
+            vol.Required("id"): vol.All(str, vol.Length(min=1, max=64)),
+            vol.Required("points"): vol.All([POINT], vol.Length(min=2, max=500)),
+            vol.Required("segments"): vol.All(
+                [vol.Schema({vol.Required("cm"): vol.All(_finite, vol.Range(min=1, max=100))},
+                            extra=vol.ALLOW_EXTRA)],
+                vol.Length(min=1, max=499),
+            ),
+        },
+        extra=vol.ALLOW_EXTRA,
+    ),
+    _room_draft_segments,
+)
+
+def _partition_nonzero(value: dict) -> dict:
+    if value["a"] == value["b"]:
+        raise vol.Invalid("partition endpoints must differ")
+    return value
+
+
+PARTITION_SCHEMA = vol.All(
+    vol.Schema(
+        {
+            vol.Required("id"): vol.All(str, vol.Length(min=1, max=64)),
+            vol.Required("a"): POINT,
+            vol.Required("b"): POINT,
+            vol.Required("cm"): vol.All(_finite, vol.Range(min=1, max=100)),
+        },
+        extra=vol.ALLOW_EXTRA,
+    ),
+    _partition_nonzero,
+)
+
+def _strict_wall_column(value: dict) -> dict:
+    """Reject shape-inapplicable or non-canonical column fields."""
+    if value["shape"] == "circle" and "angle" in value:
+        raise vol.Invalid("angle is allowed only for square wall columns")
+    if value["shape"] == "square" and value.get("angle", 0) >= 90:
+        raise vol.Invalid("square wall column angle must be in [0, 90)")
+    return value
+
+
+WALL_COLUMN_SCHEMA = vol.All(
+    vol.Schema(
+        {
+            vol.Required("id"): vol.All(str, vol.Length(min=1, max=64)),
+            vol.Required("shape"): vol.In(["square", "circle"]),
+            vol.Required("center"): POINT,
+            # Outer side for a square, outer diameter for a circle.
+            vol.Required("cm"): vol.All(_finite, vol.Range(min=1, max=150)),
+            vol.Optional("angle"): vol.All(
+                _finite, vol.Range(min=0, max=90)
+            ),
+        },
+        extra=vol.ALLOW_EXTRA,
+    ),
+    _strict_wall_column,
+)
+
+
+def _space_geometry_invariants(value: dict) -> dict:
+    """All stored geometry shares ids; draft segments also have a space cap."""
+    seen: set[str] = set()
+    for key in ("rooms", "openings", "decor", "room_drafts", "partitions", "wall_columns"):
+        for item in value.get(key, []):
+            item_id = item.get("id")
+            if not item_id:
+                continue
+            if item_id in seen:
+                raise vol.Invalid("geometry object ids must be unique within a space")
+            seen.add(item_id)
+    draft_segments = sum(
+        len(item.get("segments", [])) for item in value.get("room_drafts", [])
+    )
+    if draft_segments > MAX_DRAFT_SEGMENTS:
+        raise vol.Invalid("too many saved room-draft segments")
+    return value
+
+
+SPACE_SCHEMA = vol.All(vol.Schema(
     {
-        vol.Required("id"): str,
+        vol.Required("id"): vol.All(str, vol.Match(SPACE_ID_RE.pattern)),
         vol.Required("title"): str,
+        # Physical grid scale. It feeds every px/cell -> centimetres migration,
+        # so NaN/Infinity or an absurd value must not be allowed to manufacture
+        # invalid decor sizes later.
+        vol.Optional("cell_cm"): vol.All(
+            _finite, vol.Range(min=CELL_CM_MIN, max=CELL_CM_MAX)
+        ),
         vol.Optional("settings"): SPACE_DISPLAY_SCHEMA,
         vol.Optional("plan_url"): vol.Any(str, None),
         # The canvas is square since v1.48.0. What used to be the space's own
@@ -260,10 +504,10 @@ SPACE_SCHEMA = vol.Schema(
         vol.Optional("plan_aspect"): vol.Any(
             None, vol.All(vol.Coerce(float), vol.Range(min=0.05, max=20))
         ),
-        # Backdrop placement (docs/BACKDROP.md): the picture may be moved and
-        # scaled UNIFORMLY on the canvas. All three are optional and their
-        # absence is the pre-v1.58.0 behaviour exactly — there is no migration,
-        # and an old config validates unchanged. The offset is a normalised
+        # Backdrop placement (docs/BACKDROP.md): the picture may be moved,
+        # resized per axis and rotated. Every transform field is optional; its
+        # complete absence is the pre-v1.58.0 behaviour exactly, and an old
+        # config validates unchanged. The offset is a normalised
         # coordinate like every other one (the ±CANVAS_LIMIT garbage guard);
         # the scale is a positive multiplier in a range a human could mean.
         vol.Optional("plan_x"): vol.Any(None, _COORD),
@@ -271,6 +515,17 @@ SPACE_SCHEMA = vol.Schema(
         vol.Optional("plan_scale"): vol.Any(
             None, vol.All(_finite, vol.Range(min=PLAN_SCALE_MIN, max=PLAN_SCALE_MAX))
         ),
+        # New writes may stretch each axis independently and rotate. The old
+        # uniform field remains a read-compatible fallback for both axes.
+        vol.Optional("plan_scale_x"): vol.Any(
+            None, vol.All(_finite, vol.Range(min=PLAN_SCALE_MIN, max=PLAN_SCALE_MAX))
+        ),
+        vol.Optional("plan_scale_y"): vol.Any(
+            None, vol.All(_finite, vol.Range(min=PLAN_SCALE_MIN, max=PLAN_SCALE_MAX))
+        ),
+        vol.Optional("plan_angle"): vol.Any(
+            None, vol.All(_finite, vol.Range(min=-360.0, max=360.0))
+        ),
         vol.Required("view_box"): _view_box,
         vol.Required("rooms"): vol.All([ROOM_SCHEMA], vol.Length(max=MAX_ROOMS)),
         vol.Optional("decor"): vol.All([DECOR_SCHEMA], vol.Length(max=MAX_DECOR)),
@@ -278,7 +533,7 @@ SPACE_SCHEMA = vol.Schema(
             vol.Schema(
                 {
                     vol.Required("id"): str,
-                    vol.Required("type"): vol.Any("door", "window"),
+                    vol.Required("type"): vol.Any("door", "window", "gate"),
                     vol.Required("x"): _GEOM,
                     vol.Required("y"): _GEOM,
                     vol.Required("angle"): vol.All(_finite, vol.Range(min=-360.0, max=360.0)),
@@ -294,6 +549,26 @@ SPACE_SCHEMA = vol.Schema(
                 extra=vol.ALLOW_EXTRA,
             )
         ], vol.Length(max=MAX_OPENINGS)),
+        # Wall thickness (docs/WALL-THICKNESS.md): keyed by a segment identity
+        # (midpoint + direction), thickness always in centimetres. Optional —
+        # a space without `walls` validates and renders exactly as before.
+        vol.Optional("walls"): vol.All([WALL_SCHEMA], vol.Length(max=MAX_WALLS)),
+        vol.Optional("room_drafts"): vol.All(
+            [ROOM_DRAFT_SCHEMA], vol.Length(max=MAX_ROOM_DRAFTS)
+        ),
+        vol.Optional("partitions"): vol.All(
+            [PARTITION_SCHEMA], vol.Length(max=MAX_PARTITIONS)
+        ),
+        vol.Optional("wall_columns"): vol.All(
+            [WALL_COLUMN_SCHEMA], vol.Length(max=MAX_WALL_COLUMNS)
+        ),
+        # Open (virtual) wall stretches: a piece of a shared boundary that the
+        # user opened. Optional and bounded — a space without `open_spans`
+        # validates exactly as before, and the legacy `rooms[].open_to` index
+        # keeps working on its own (AUD-159B6-03).
+        vol.Optional("open_spans"): vol.All(
+            vol.Length(max=MAX_OPEN_SPANS), [_open_span], _dedupe_open_spans,
+        ),
         # Legacy: walls are derived from room outlines since v1.19.0 — a line has no
         # independent existence. Still accepted so a stale browser tab cannot fail a save;
         # the card strips the field on every write.
@@ -303,15 +578,22 @@ SPACE_SCHEMA = vol.Schema(
         vol.Remove("segments"): object,
     },
     extra=vol.ALLOW_EXTRA,
-)
+), _space_geometry_invariants)
 MARKER_SCHEMA = vol.Schema(
     {
         vol.Required("id"): str,
         # 'device:<device_id>' | 'entity:<entity_id>' | 'virtual'
-        vol.Required("binding"): str,
+        vol.Required("binding"): vol.All(
+            str,
+            vol.Length(min=1, max=MAX_TEXT),
+            vol.Match(r"^(device:.+|entity:.+|virtual)$"),
+        ),
         vol.Optional("space"): vol.Any(str, None),
         vol.Optional("area"): vol.Any(str, None),
         vol.Optional("hidden"): bool,
+        # A binding-level tombstone: not rendered or aggregated, but retained
+        # so automatic discovery does not put a deleted device straight back.
+        vol.Optional("removed"): bool,
         vol.Optional("name"): _TEXT_OR_NONE,
         vol.Optional("icon"): _TEXT_OR_NONE,
         vol.Optional("model"): _TEXT_OR_NONE,
@@ -348,10 +630,12 @@ MARKER_SCHEMA = vol.Schema(
         # climate current_temperature: badge + room-average vote (off unless True)
         vol.Optional("use_climate_temp"): vol.Any(bool, None),
         vol.Optional("room_id"): vol.Any(str, None),
-        # keep in sync with DISPLAY_MODES in src/logic.ts — a cross-language test
-        # asserts every option the editor offers is accepted here (issue #3)
-        vol.Optional("display"): vol.Any("badge", "ripple", "icon_ripple", "value", None),
-        vol.Optional("ripple_color"): vol.Any(str, None),
+        # Keep in sync with DISPLAY_MODES in src/logic.ts. `ripple` is no longer
+        # offered, but remains accepted while old stores migrate to icon_ripple.
+        vol.Optional("display"): vol.Any("badge", "ripple", "icon_ripple", "value", "static_icon", None),
+        vol.Optional("ripple_color"): vol.Any(
+            None, vol.Match(r"^#[0-9a-fA-F]{6}$")
+        ),
         vol.Optional("ripple_size"): vol.Any(vol.All(vol.Coerce(float), vol.Range(min=1, max=20)), None),
         vol.Optional("size"): vol.Any(vol.All(vol.Coerce(float), vol.Range(min=0.2, max=6)), None),
         vol.Optional("angle"): vol.Any(vol.All(vol.Coerce(float), vol.Range(min=-360, max=360)), None),
@@ -375,6 +659,9 @@ CONFIG_SCHEMA = vol.Schema(
                 vol.Optional("north_deg"): _north_deg,
                 vol.Optional("bg_mode"): _BG_MODE,
                 vol.Optional("sun_rays"): bool,
+                # Removed from the UI/runtime in 2026-08-08. Keep accepting the
+                # legacy field so an existing stored config can still load; the
+                # frontend ignores it and removes it on the next settings save.
                 vol.Optional("weather_entity"): vol.Any(None, _TEXT),
                 vol.Optional("known_devices"): vol.All([_TEXT], vol.Length(max=MAX_KNOWN_DEVICES)),
                 vol.Optional("new_device_ids"): vol.All([_TEXT], vol.Length(max=MAX_KNOWN_DEVICES)),

custom_components/houseplan/websocket_api.py

@@ -7,6 +7,7 @@ import base64
 import binascii
 import json
 import secrets
+import time
 from pathlib import Path
 from typing import Any
 
@@ -36,18 +37,51 @@ from .validation import (
 
 _LOGGER = logging.getLogger(__name__)
 
+_OPTIMIZE_BACKUP = "optimize_backup"
+_OPTIMIZE_PENDING = "optimize_pending"
+
+
+def _optimizer_backup_is_current(config_data: dict[str, Any], layout_data: dict[str, Any]) -> bool:
+    """An optimization can be undone only before any later plan edit."""
+    backup = layout_data.get(_OPTIMIZE_BACKUP)
+    if not isinstance(backup, dict):
+        return False
+    try:
+        return (
+            int(backup.get("after_config_rev", -1)) == int(config_data.get("rev", 0))
+            and int(backup.get("after_layout_rev", -1)) == int(layout_data.get("rev", 0))
+        )
+    except (TypeError, ValueError):
+        return False
+
+
+async def _discard_optimizer_snapshot(rt: HouseplanData) -> None:
+    """Free a snapshot made stale by a later ordinary config edit."""
+    data = await rt.store.async_load() or {}
+    if _OPTIMIZE_BACKUP not in data and _OPTIMIZE_PENDING not in data:
+        return
+    await rt.store.async_save({
+        **{
+            k: v for k, v in data.items()
+            if k not in (_OPTIMIZE_BACKUP, _OPTIMIZE_PENDING)
+        }
+    })
+
 
 @callback
 def async_register(hass: HomeAssistant) -> None:
     """Register the WS commands."""
     websocket_api.async_register_command(hass, ws_layout_get)
     websocket_api.async_register_command(hass, ws_trail_get)
+    websocket_api.async_register_command(hass, ws_trail_delete)
     websocket_api.async_register_command(hass, ws_layout_set)
     websocket_api.async_register_command(hass, ws_geometry_repair)
     websocket_api.async_register_command(hass, ws_layout_update)
     websocket_api.async_register_command(hass, ws_layout_delete)
     websocket_api.async_register_command(hass, ws_config_get)
     websocket_api.async_register_command(hass, ws_config_set)
+    websocket_api.async_register_command(hass, ws_plan_optimize)
+    websocket_api.async_register_command(hass, ws_plan_optimize_undo)
     websocket_api.async_register_command(hass, ws_plan_set)
     websocket_api.async_register_command(hass, ws_plans_list)
     websocket_api.async_register_command(hass, ws_plans_delete)
@@ -77,6 +111,36 @@ def _check_write(hass: HomeAssistant, connection) -> bool:
 # ---------------- layout ----------------
 
 
+def _live_layout(config: dict[str, Any], layout: dict[str, Any]) -> dict[str, Any]:
+    """Drop positions which a deleted marker can no longer own.
+
+    HA device ids may be layout-only because auto-discovered devices need no
+    marker entry. Virtual ids are different: every live virtual marker is
+    explicit, so a missing `v_*` owner is stale data. The prefix itself is
+    only a legacy naming convention, however; an explicit real marker remains
+    authoritative even when its id happens to begin with `v_`.
+    """
+    markers = config.get("markers") or []
+    removed_ids = {
+        str(m.get("id")) for m in markers if m.get("removed") is True
+    }
+    virtual_ids = {
+        str(m.get("id")) for m in markers
+        if m.get("removed") is not True and m.get("binding") == "virtual"
+    }
+    explicit_live_ids = {
+        str(m.get("id")) for m in markers
+        if m.get("removed") is not True and m.get("binding") != "virtual"
+    }
+    return {
+        marker_id: pos for marker_id, pos in layout.items()
+        if marker_id not in removed_ids
+        and (not marker_id.startswith("v_")
+             or marker_id in virtual_ids
+             or marker_id in explicit_live_ids)
+    }
+
+
 @websocket_api.websocket_command({vol.Required("type"): "houseplan/layout/get"})
 @websocket_api.async_response
 async def ws_layout_get(hass: HomeAssistant, connection, msg: dict[str, Any]) -> None:
@@ -85,8 +149,13 @@ async def ws_layout_get(hass: HomeAssistant, connection, msg: dict[str, Any]) ->
     if rt is None:
         return
     data = await rt.store.async_load() or {}
+    config_data = await rt.config_store.async_load() or {}
     connection.send_result(
-        msg["id"], {"layout": data.get("layout", {}), "rev": int(data.get("rev", 0))}
+        msg["id"], {
+            "layout": data.get("layout", {}),
+            "rev": int(data.get("rev", 0)),
+            "can_optimize_undo": _optimizer_backup_is_current(config_data, data),
+        }
     )
 
 
@@ -113,6 +182,7 @@ async def ws_layout_set(hass: HomeAssistant, connection, msg: dict[str, Any]) ->
     if rt is None:
         return
     async with rt.write_lock:
+        config_data = await rt.config_store.async_load() or {}
         data = await rt.store.async_load() or {}
         current_rev = int(data.get("rev", 0))
         if "expected_rev" in msg and msg["expected_rev"] != current_rev:
@@ -120,9 +190,11 @@ async def ws_layout_set(hass: HomeAssistant, connection, msg: dict[str, Any]) ->
                 msg["id"], "conflict", f"Layout changed elsewhere (rev {current_rev})"
             )
             return
+        layout = _live_layout(config_data.get("config") or {}, msg["layout"])
         new_rev = current_rev + 1
-        await rt.store.async_save({**{k: v for k, v in data.items() if k not in ("layout", "rev")},
-                                   "layout": msg["layout"], "rev": new_rev})
+        await rt.store.async_save({**{k: v for k, v in data.items() if k not in (
+                                       "layout", "rev", _OPTIMIZE_BACKUP, _OPTIMIZE_PENDING)},
+                                   "layout": layout, "rev": new_rev})
     hass.bus.async_fire("houseplan_layout_updated", {"rev": new_rev})
     connection.send_result(msg["id"], {"ok": True, "rev": new_rev})
 
@@ -144,6 +216,39 @@ async def ws_layout_update(hass: HomeAssistant, connection, msg: dict[str, Any])
     if rt is None:
         return
     async with rt.write_lock:
+        # A stale browser may still finish a drag after another client deleted
+        # the marker. Its tombstone is the server-side authority: acknowledge
+        # but ignore the late point so re-adding starts without a zombie
+        # position.
+        config_data = await rt.config_store.async_load() or {}
+        config = config_data.get("config") or {}
+        markers = config.get("markers") or []
+        deleted = any(
+            str(m.get("id")) == msg["device_id"] and m.get("removed") is True
+            for m in markers
+        )
+        live_virtual = any(
+            str(m.get("id")) == msg["device_id"] and m.get("removed") is not True
+            and m.get("binding") == "virtual"
+            for m in markers
+        )
+        live_explicit = any(
+            str(m.get("id")) == msg["device_id"] and m.get("removed") is not True
+            for m in markers
+        )
+        orphan_virtual = (
+            msg["device_id"].startswith("v_")
+            and not live_virtual
+            and not live_explicit
+        )
+        if deleted or orphan_virtual:
+            data = await rt.store.async_load() or {}
+            connection.send_result(msg["id"], {
+                "ok": True,
+                "ignored": "removed" if deleted else "missing_virtual",
+                "rev": int(data.get("rev", 0)),
+            })
+            return
         data = await rt.store.async_load() or {}
         layout = data.get("layout", {})
         layout[msg["device_id"]] = msg["pos"]
@@ -151,7 +256,8 @@ async def ws_layout_update(hass: HomeAssistant, connection, msg: dict[str, Any])
         # optimistic locking on layout/set meaningless — every drag reset the
         # counter to 0 (HP-1454-08)
         new_rev = int(data.get("rev", 0)) + 1
-        await rt.store.async_save({**{k: v for k, v in data.items() if k not in ("layout", "rev")},
+        await rt.store.async_save({**{k: v for k, v in data.items() if k not in (
+                                       "layout", "rev", _OPTIMIZE_BACKUP, _OPTIMIZE_PENDING)},
                                    "layout": layout, "rev": new_rev})
     hass.bus.async_fire("houseplan_layout_updated", {"rev": new_rev})
     connection.send_result(msg["id"], {"ok": True, "rev": new_rev})
@@ -548,7 +654,8 @@ async def ws_layout_delete(hass: HomeAssistant, connection, msg: dict[str, Any])
         if msg["device_id"] in layout:
             del layout[msg["device_id"]]
             new_rev = int(data.get("rev", 0)) + 1
-            await rt.store.async_save({**{k: v for k, v in data.items() if k not in ("layout", "rev")},
+            await rt.store.async_save({**{k: v for k, v in data.items() if k not in (
+                                           "layout", "rev", _OPTIMIZE_BACKUP, _OPTIMIZE_PENDING)},
                                        "layout": layout, "rev": new_rev})
     if new_rev is not None:
         hass.bus.async_fire("houseplan_layout_updated", {"rev": new_rev})
@@ -561,13 +668,27 @@ async def ws_layout_delete(hass: HomeAssistant, connection, msg: dict[str, Any])
 @websocket_api.websocket_command({vol.Required("type"): "houseplan/config/get"})
 @websocket_api.async_response
 async def ws_config_get(hass: HomeAssistant, connection, msg: dict[str, Any]) -> None:
-    """Return the configuration and its revision."""
+    """Return the configuration, its revision, and whether this user may write.
+
+    `can_write` is the single source of truth for the card's editor chrome
+    (audit P0-4): the UI must mirror `may_write`, not a hard-coded is_admin
+    check that drifted from the integration option.
+    """
     rt = _runtime(hass, connection, msg["id"])
     if rt is None:
         return
     data = await rt.config_store.async_load() or {}
+    layout_data = await rt.store.async_load() or {}
     config = {**DEFAULT_CONFIG, **data.get("config", {})}
-    connection.send_result(msg["id"], {"config": config, "rev": data.get("rev", 0)})
+    connection.send_result(
+        msg["id"],
+        {
+            "config": config,
+            "rev": data.get("rev", 0),
+            "can_write": may_write(hass, getattr(connection, "user", None)),
+            "can_optimize_undo": _optimizer_backup_is_current(data, layout_data),
+        },
+    )
 
 
 
@@ -679,6 +800,10 @@ async def ws_config_set(hass: HomeAssistant, connection, msg: dict[str, Any]) ->
             return
         new_rev = current_rev + 1
         await rt.config_store.async_save({"config": msg["config"], "rev": new_rev})
+        try:
+            await _discard_optimizer_snapshot(rt)
+        except Exception:  # noqa: BLE001 — stale backup cleanup is best-effort
+            _LOGGER.exception("House Plan: discarding stale optimization backup failed")
         # Still holding the lock: the file system is not part of the store's
         # transaction, so collection has to be pinned to this commit (R3-1).
         # It is best-effort housekeeping behind an already durable write — a
@@ -704,6 +829,184 @@ async def ws_config_set(hass: HomeAssistant, connection, msg: dict[str, Any]) ->
     connection.send_result(msg["id"], {"ok": True, "rev": new_rev})
 
 
+# ---------------- whole-plan maintenance ----------------
+
+
+@websocket_api.websocket_command(
+    {
+        vol.Required("type"): "houseplan/plan/optimize",
+        vol.Required("config"): CONFIG_SCHEMA,
+        vol.Required("layout"): LAYOUT_SCHEMA,
+        vol.Required("expected_config_rev"): int,
+        vol.Required("expected_layout_rev"): int,
+    }
+)
+@websocket_api.async_response
+async def ws_plan_optimize(hass: HomeAssistant, connection, msg: dict[str, Any]) -> None:
+    """Atomically-intended replacement of config+layout with one-deep undo.
+
+    Home Assistant stores are separate files, so a literal cross-file
+    transaction is impossible. Persisting the target as an intent before
+    either half changes makes a crash resumable during the next setup; the UI
+    only receives success once both halves are durable.
+    """
+    if not _check_write(hass, connection):
+        connection.send_error(msg["id"], "unauthorized", "Only administrators may optimize plans")
+        return
+    rt = _runtime(hass, connection, msg["id"])
+    if rt is None:
+        return
+    size = len(json.dumps(msg["config"], separators=(",", ":")))
+    if size > MAX_CONFIG_BYTES:
+        connection.send_error(
+            msg["id"], "too_large",
+            f"Configuration is {size // 1024} KB, the limit is {MAX_CONFIG_BYTES // 1024} KB",
+        )
+        return
+
+    async with rt.write_lock:
+        config_data = await rt.config_store.async_load() or {}
+        layout_data = await rt.store.async_load() or {}
+        config_rev = int(config_data.get("rev", 0))
+        layout_rev = int(layout_data.get("rev", 0))
+        if msg["expected_config_rev"] != config_rev or msg["expected_layout_rev"] != layout_rev:
+            connection.send_error(
+                msg["id"], "conflict",
+                f"Plan changed elsewhere (config {config_rev}, layout {layout_rev})",
+            )
+            return
+
+        missing = await hass.async_add_executor_job(
+            _missing_internal_plans,
+            Path(hass.config.path(PLANS_DIR)),
+            msg["config"],
+            config_data.get("config"),
+        )
+        if missing:
+            connection.send_error(
+                msg["id"], "missing_plan",
+                "Plan file no longer exists: " + ", ".join(sorted(missing)),
+            )
+            return
+
+        new_config_rev = config_rev + 1
+        new_layout_rev = layout_rev + 1
+        backup = {
+            "config": config_data.get("config") or DEFAULT_CONFIG,
+            "layout": layout_data.get("layout", {}),
+            "created": int(time.time()),
+            "after_config_rev": new_config_rev,
+            "after_layout_rev": new_layout_rev,
+        }
+        pending = {
+            "config": msg["config"],
+            "layout": msg["layout"],
+            "clear_backup": False,
+        }
+        layout_meta = {
+            k: v for k, v in layout_data.items()
+            if k not in ("layout", "rev", _OPTIMIZE_BACKUP, _OPTIMIZE_PENDING)
+        }
+
+        # Intent first. A setup-time finisher completes whichever half a crash
+        # interrupted; until then the visible layout/revision remain unchanged.
+        await rt.store.async_save({
+            **layout_meta,
+            "layout": layout_data.get("layout", {}),
+            "rev": layout_rev,
+            _OPTIMIZE_BACKUP: backup,
+            _OPTIMIZE_PENDING: pending,
+        })
+        await rt.config_store.async_save({"config": msg["config"], "rev": new_config_rev})
+        await rt.store.async_save({
+            **layout_meta,
+            "layout": msg["layout"],
+            "rev": new_layout_rev,
+            _OPTIMIZE_BACKUP: backup,
+        })
+
+    hass.bus.async_fire("houseplan_config_updated", {"rev": new_config_rev})
+    hass.bus.async_fire("houseplan_layout_updated", {"rev": new_layout_rev})
+    _refresh_trail_recorder(hass)
+    connection.send_result(msg["id"], {
+        "ok": True,
+        "config_rev": new_config_rev,
+        "layout_rev": new_layout_rev,
+        "can_undo": True,
+    })
+
+
+@websocket_api.websocket_command(
+    {
+        vol.Required("type"): "houseplan/plan/optimize_undo",
+        vol.Required("expected_config_rev"): int,
+        vol.Required("expected_layout_rev"): int,
+    }
+)
+@websocket_api.async_response
+async def ws_plan_optimize_undo(hass: HomeAssistant, connection, msg: dict[str, Any]) -> None:
+    """Restore the snapshot, but never overwrite edits made after optimization."""
+    if not _check_write(hass, connection):
+        connection.send_error(msg["id"], "unauthorized", "Only administrators may undo optimization")
+        return
+    rt = _runtime(hass, connection, msg["id"])
+    if rt is None:
+        return
+
+    async with rt.write_lock:
+        config_data = await rt.config_store.async_load() or {}
+        layout_data = await rt.store.async_load() or {}
+        config_rev = int(config_data.get("rev", 0))
+        layout_rev = int(layout_data.get("rev", 0))
+        if msg["expected_config_rev"] != config_rev or msg["expected_layout_rev"] != layout_rev:
+            connection.send_error(msg["id"], "conflict", "Plan changed elsewhere")
+            return
+        if not _optimizer_backup_is_current(config_data, layout_data):
+            connection.send_error(
+                msg["id"], "no_backup",
+                "The optimization backup is unavailable or a later edit made it stale",
+            )
+            return
+
+        backup = layout_data[_OPTIMIZE_BACKUP]
+        restored_config = backup.get("config") or DEFAULT_CONFIG
+        restored_layout = backup.get("layout") or {}
+        new_config_rev = config_rev + 1
+        new_layout_rev = layout_rev + 1
+        pending = {
+            "config": restored_config,
+            "layout": restored_layout,
+            "clear_backup": True,
+        }
+        layout_meta = {
+            k: v for k, v in layout_data.items()
+            if k not in ("layout", "rev", _OPTIMIZE_BACKUP, _OPTIMIZE_PENDING)
+        }
+        await rt.store.async_save({
+            **layout_meta,
+            "layout": layout_data.get("layout", {}),
+            "rev": layout_rev,
+            _OPTIMIZE_BACKUP: backup,
+            _OPTIMIZE_PENDING: pending,
+        })
+        await rt.config_store.async_save({"config": restored_config, "rev": new_config_rev})
+        await rt.store.async_save({
+            **layout_meta,
+            "layout": restored_layout,
+            "rev": new_layout_rev,
+        })
+
+    hass.bus.async_fire("houseplan_config_updated", {"rev": new_config_rev})
+    hass.bus.async_fire("houseplan_layout_updated", {"rev": new_layout_rev})
+    _refresh_trail_recorder(hass)
+    connection.send_result(msg["id"], {
+        "ok": True,
+        "config_rev": new_config_rev,
+        "layout_rev": new_layout_rev,
+        "can_undo": False,
+    })
+
+
 # ---------------- plan uploads ----------------
 
 
@@ -785,3 +1088,22 @@ async def ws_trail_get(hass: HomeAssistant, connection: websocket_api.ActiveConn
     """Current + previous cleanup runs per marker, raw robot coordinates."""
     rec = hass.data.get(DOMAIN, {}).get("trail_recorder")
     connection.send_result(msg["id"], {"trails": rec.book.data if rec else {}})
+
+
+@websocket_api.websocket_command(
+    {
+        vol.Required("type"): "houseplan/trail/delete",
+        vol.Required("marker_id"): vol.All(str, vol.Length(min=1, max=256)),
+    }
+)
+@websocket_api.async_response
+async def ws_trail_delete(hass: HomeAssistant, connection: websocket_api.ActiveConnection, msg: dict) -> None:
+    """Permanently forget one deleted marker's current and previous runs."""
+    if not _check_write(hass, connection):
+        connection.send_error(msg["id"], "unauthorized", "Only administrators may delete trails")
+        return
+    if _runtime(hass, connection, msg["id"]) is None:
+        return
+    rec = hass.data.get(DOMAIN, {}).get("trail_recorder")
+    removed = await rec.async_delete(msg["marker_id"]) if rec else False
+    connection.send_result(msg["id"], {"ok": True, "removed": removed})

demo/benchmark_large_house.mjs

@@ -0,0 +1,312 @@
+#!/usr/bin/env node
+/** Reproducible browser benchmark and report producer for HP-PERF-01. */
+import { mkdirSync, writeFileSync } from 'node:fs';
+import { dirname, resolve } from 'node:path';
+import { launch } from './serve.mjs';
+import { LARGE_HOUSE_COUNTS, makeLargeHouseFixture } from './fixtures/large-house.mjs';
+import { assertFreshDemoBundle } from './bundle-freshness.mjs';
+import { summarizeLongTasks, summarizeTimings } from './performance/evaluate.mjs';
+
+const valueArg = (name) => process.argv.find((arg) => arg.startsWith(`--${name}=`))?.slice(name.length + 3);
+const samples = Math.max(1, Math.min(20, Number(valueArg('samples')) || 7));
+const warmups = Math.max(0, Math.min(5, Number(valueArg('warmups')) || 1));
+const output = valueArg('output') ? resolve(valueArg('output')) : null;
+const targetRoot = resolve(valueArg('target-root') ?? '.');
+const fixture = makeLargeHouseFixture();
+const viewport = { width: 1440, height: 1000 };
+
+const { page, browser } = await launch(
+  viewport,
+  1,
+  ['--enable-precise-memory-info', '--js-flags=--expose-gc'],
+  {},
+  resolve(targetRoot, 'demo/srv'),
+);
+await page.emulateMedia({ reducedMotion: 'reduce' });
+await page.addStyleTag({
+  content: '*,*::before,*::after{animation-duration:0s!important;transition-duration:0s!important;caret-color:transparent!important}',
+});
+const chromium = await browser.version();
+let buildFingerprint;
+try {
+  buildFingerprint = await assertFreshDemoBundle(page, targetRoot);
+} catch (error) {
+  await browser.close();
+  throw error;
+}
+
+const rows = [];
+try {
+  for (let iteration = 0; iteration < warmups + samples; iteration++) {
+    const measuredSample = iteration - warmups;
+    const row = await page.evaluate(async ({ fixture, sample }) => {
+      const frame = () => new Promise((done) => requestAnimationFrame(() => requestAnimationFrame(done)));
+      const until = async (predicate, timeout = 10000) => {
+        const started = performance.now();
+        while (!predicate()) {
+          if (performance.now() - started > timeout) throw new Error('large-house benchmark timed out');
+          await new Promise((done) => setTimeout(done, 10));
+        }
+      };
+      const startLongTaskWindow = () => {
+        const entries = [];
+        if (!PerformanceObserver.supportedEntryTypes?.includes('longtask')) {
+          return { stop: async () => ({ supported: false, count: 0, maxMs: 0, totalMs: 0 }) };
+        }
+        const observer = new PerformanceObserver((list) => entries.push(...list.getEntries()));
+        observer.observe({ type: 'longtask', buffered: false });
+        return {
+          stop: async () => {
+            await new Promise((done) => setTimeout(done, 0));
+            entries.push(...observer.takeRecords());
+            observer.disconnect();
+            const durations = entries.map((entry) => entry.duration);
+            return {
+              supported: true,
+              count: durations.length,
+              maxMs: Number((durations.length ? Math.max(...durations) : 0).toFixed(2)),
+              totalMs: Number(durations.reduce((sum, value) => sum + value, 0).toFixed(2)),
+            };
+          },
+        };
+      };
+      const duration = async (action) => {
+        const longTasks = startLongTaskWindow();
+        const started = performance.now();
+        await action();
+        await frame();
+        return {
+          ms: Number((performance.now() - started).toFixed(2)),
+          longTasks: await longTasks.stop(),
+        };
+      };
+      const forceGc = async () => {
+        if (typeof globalThis.gc !== 'function') return false;
+        globalThis.gc();
+        await frame();
+        globalThis.gc();
+        await frame();
+        return true;
+      };
+      const cacheSnapshot = (card) => ({
+        cleanFloor: card._cleanFloorCache?.size ?? 0,
+        glowClip: card._glowClipCache?.size ?? 0,
+        wallUnion: card._wallUnionCache ? 1 : 0,
+        openingTunnel: card._openingTunnelCache ? 1 : 0,
+        openingWallIndex: card._openingWallIndexCache ? 1 : 0,
+      });
+
+      window.__card?.remove?.();
+      localStorage.clear();
+      const host = document.getElementById('host');
+      const card = document.createElement('houseplan-card');
+      card.setConfig({
+        type: 'custom:houseplan-card', title: `Performance baseline ${sample}`, icon_size: 3.4,
+      });
+      const connection = {
+        subscribeEvents: async () => () => undefined,
+        subscribeMessage: async () => () => undefined,
+      };
+      const hassFor = (states) => ({
+        language: 'en', locale: { language: 'en' },
+        user: { id: 'perf', name: 'Performance fixture', is_admin: true },
+        devices: fixture.devices, entities: fixture.entities, areas: fixture.areas, states,
+        floors: {
+          one: { floor_id: 'one', name: 'One', level: 0 },
+          two: { floor_id: 'two', name: 'Two', level: 1 },
+          three: { floor_id: 'three', name: 'Three', level: 2 },
+        },
+        callWS: async (message) => {
+          if (message.type === 'houseplan/config/get')
+            return { config: structuredClone(fixture.config), rev: 1, can_write: true };
+          if (message.type === 'houseplan/layout/get')
+            return { layout: structuredClone(fixture.layout), rev: 1 };
+          if (message.type === 'config/device_registry/list') return Object.values(fixture.devices);
+          if (message.type === 'config/entity_registry/list') return Object.values(fixture.entities);
+          if (message.type === 'config_entries/get')
+            return [{ entry_id: 'perf_entry', domain: 'houseplan_perf', title: 'Synthetic performance fixture' }];
+          if (message.type === 'manifest/list') return [{ domain: 'houseplan_perf', name: 'House Plan Performance' }];
+          return { ok: true };
+        },
+        callService: async () => undefined,
+        connection,
+        localize: () => null,
+        formatEntityState: (state) => state.state,
+        config: { unit_system: { length: 'km' } },
+      });
+
+      const loadLongTasks = startLongTaskWindow();
+      const loadStarted = performance.now();
+      host.replaceChildren(card);
+      card.hass = hassFor(fixture.states);
+      await until(() => card._loadOk && card._model?.length === fixture.counts.floors);
+      await card.updateComplete;
+      await frame();
+      const modelReadyMs = Number((performance.now() - loadStarted).toFixed(2));
+      await until(() => card._booting === false);
+      await frame();
+      const firstStableRenderMs = Number((performance.now() - loadStarted).toFixed(2));
+      const loadLongTaskResult = await loadLongTasks.stop();
+      const spaceSwitch = await duration(async () => {
+        card._pickSpace('perf-floor-2');
+        await card.updateComplete;
+      });
+
+      const firstEntity = Object.keys(fixture.states)[0];
+      const nextStates = {
+        ...fixture.states,
+        [firstEntity]: { ...fixture.states[firstEntity], state: fixture.states[firstEntity].state === 'on' ? 'off' : 'on' },
+      };
+      const stateUpdate = await duration(async () => {
+        card.hass = hassFor(nextStates);
+        await card.updateComplete;
+      });
+
+      const resizePreview = await duration(async () => {
+        card._setMode('plan');
+        card._tool = 'resize';
+        await card.updateComplete;
+        const room = card._rszRooms()[0];
+        const pointerId = 777;
+        const quietEvent = {
+          pointerId,
+          stopPropagation: () => undefined,
+          preventDefault: () => undefined,
+          target: null,
+        };
+        card._rszEdgeDown(quietEvent, room.id, 1);
+        const plan = card._rszDrag?.plan;
+        if (!plan) throw new Error('large-house resize plan was not created');
+        const target = [
+          plan.a[0] + plan.n[0] * card._gridPitch,
+          plan.a[1] + plan.n[1] * card._gridPitch,
+        ];
+        const stage = card.renderRoot.querySelector('.stage');
+        const rect = stage.getBoundingClientRect();
+        const view = card._viewOr(card._baseVb());
+        card._rszMove({
+          ...quietEvent,
+          clientX: rect.left + ((target[0] - view.x) / view.w) * rect.width,
+          clientY: rect.top + ((target[1] - view.y) / view.h) * rect.height,
+        });
+        await card.updateComplete;
+        card._rszCancelDrag();
+        card._setMode('view');
+        await card.updateComplete;
+      });
+
+      const stage = card.renderRoot.querySelector('.stage');
+      const rect = stage.getBoundingClientRect();
+      const panZoom = await duration(async () => {
+        stage.dispatchEvent(new WheelEvent('wheel', {
+          deltaY: -120, clientX: rect.left + rect.width / 2, clientY: rect.top + rect.height / 2,
+          bubbles: true, cancelable: true,
+        }));
+        await card.updateComplete;
+      });
+
+      const settingsDialog = await duration(async () => {
+        card._openSettingsDialog();
+        await card.updateComplete;
+      });
+      card._settingsDialog = null;
+      await card.updateComplete;
+
+      const switchCycle = await duration(async () => {
+        for (let index = 0; index < 12; index++) {
+          card._pickSpace(`perf-floor-${(index % fixture.counts.floors) + 1}`);
+          await card.updateComplete;
+          // A user cannot produce twelve tab clicks in one JavaScript task.
+          // Yield between interactions so Long Task entries describe one
+          // switch, while switchCycleMs still measures the complete cycle.
+          await new Promise((done) => setTimeout(done, 0));
+        }
+      });
+
+      await forceGc();
+      const cacheBefore = cacheSnapshot(card);
+      const heapBefore = performance.memory?.usedJSHeapSize ?? null;
+      for (let round = 0; round < 4; round++) {
+        for (let index = 0; index < 12; index++) {
+          card._pickSpace(`perf-floor-${(index % fixture.counts.floors) + 1}`);
+          await card.updateComplete;
+          await new Promise((done) => setTimeout(done, 0));
+        }
+        await forceGc();
+      }
+      const cacheEntries = cacheSnapshot(card);
+      const heapAfter = performance.memory?.usedJSHeapSize ?? null;
+      const cacheGrowth = Object.fromEntries(
+        Object.keys(cacheEntries).map((key) => [key, cacheEntries[key] - cacheBefore[key]]),
+      );
+
+      const result = {
+        sample,
+        modelReadyMs,
+        firstStableRenderMs,
+        spaceSwitchMs: spaceSwitch.ms,
+        stateUpdateMs: stateUpdate.ms,
+        resizePreviewMs: resizePreview.ms,
+        panZoomMs: panZoom.ms,
+        settingsDialogMs: settingsDialog.ms,
+        switchCycleMs: switchCycle.ms,
+        longTasks: {
+          load: loadLongTaskResult,
+          spaceSwitch: spaceSwitch.longTasks,
+          stateUpdate: stateUpdate.longTasks,
+          resizePreview: resizePreview.longTasks,
+          panZoom: panZoom.longTasks,
+          settingsDialog: settingsDialog.longTasks,
+          switchCycle: switchCycle.longTasks,
+        },
+        cacheEntries,
+        cacheGrowth,
+        heapGrowthBytes: heapBefore == null || heapAfter == null ? null : heapAfter - heapBefore,
+        preciseGc: typeof globalThis.gc === 'function',
+        renderedDevices: card._devices?.length ?? 0,
+      };
+      card.remove();
+      await frame();
+      return result;
+    }, { fixture, sample: measuredSample });
+    if (measuredSample >= 0) rows.push(row);
+  }
+} finally {
+  await browser.close();
+}
+
+const metricNames = [
+  'modelReadyMs', 'firstStableRenderMs', 'spaceSwitchMs', 'stateUpdateMs',
+  'resizePreviewMs', 'panZoomMs', 'settingsDialogMs', 'switchCycleMs',
+];
+const report = {
+  schema: 2,
+  profile: 'large-house-v1',
+  generatedAt: new Date().toISOString(),
+  buildFingerprint,
+  runtime: {
+    node: process.version,
+    chromium,
+    platform: process.platform,
+    arch: process.arch,
+    viewport,
+    deviceScaleFactor: 1,
+    reducedMotion: true,
+  },
+  fixture: LARGE_HOUSE_COUNTS,
+  samples,
+  warmups,
+  summary: summarizeTimings(rows, metricNames),
+  longTasks: summarizeLongTasks(rows),
+  rows,
+  note: 'Compare with a base-SHA report captured by the same runner and evaluate demo/performance/budgets.json.',
+};
+
+const text = `${JSON.stringify(report, null, 2)}\n`;
+if (output) {
+  mkdirSync(dirname(output), { recursive: true });
+  writeFileSync(output, text, 'utf8');
+  console.log(output);
+} else {
+  process.stdout.write(text);
+}

demo/bundle-freshness.mjs

@@ -0,0 +1,15 @@
+import { sourceFingerprint } from '../scripts/source-fingerprint.mjs';
+
+/** Refuse measurements/screenshots made by a committed bundle from old source. */
+export async function assertFreshDemoBundle(page, root = process.cwd()) {
+  const expected = sourceFingerprint(root);
+  const loaded = await page.evaluate(() => globalThis.__HOUSEPLAN_BUILD_FINGERPRINT__ ?? null);
+  if (loaded !== expected) {
+    throw new Error(
+      'demo/srv/assets/houseplan-card.js is stale. Run npm run build and copy '
+      + 'dist/houseplan-card.js to demo/srv/assets/houseplan-card.js first. '
+      + `Expected ${expected}, loaded ${loaded || 'no fingerprint'}.`,
+    );
+  }
+  return expected;
+}

demo/fixtures/large-house.mjs

@@ -0,0 +1,231 @@
+/**
+ * Deterministic, fictional high-load fixture shared by performance and future
+ * visual-regression tooling. Nothing here depends on a real HA installation.
+ */
+
+const FLOOR_COUNT = 3;
+const ROOMS_PER_FLOOR = 20;
+const DEVICE_COUNT = 200;
+const OPENING_COUNT = 100;
+const PARTITION_COUNT = 60;
+const COLUMN_COUNT = 40;
+const DECOR_COUNT = 500;
+
+const round = (value) => Number(value.toFixed(6));
+
+const roomGrid = (floor) => {
+  const rooms = [];
+  const left = 0.04;
+  const top = 0.04;
+  const width = 0.92 / 5;
+  const height = 0.92 / 4;
+  for (let row = 0; row < 4; row++) {
+    for (let column = 0; column < 5; column++) {
+      const index = row * 5 + column;
+      const x1 = round(left + column * width);
+      const y1 = round(top + row * height);
+      const x2 = round(x1 + width);
+      const y2 = round(y1 + height);
+      rooms.push({
+        id: `perf-room-${floor}-${index}`,
+        name: `Room ${floor + 1}.${index + 1}`,
+        area: `perf_area_${floor}_${index}`,
+        poly: [[x1, y1], [x2, y1], [x2, y2], [x1, y2]],
+      });
+    }
+  }
+  return rooms;
+};
+
+const wallSegments = (rooms) => {
+  const unique = new Map();
+  for (const room of rooms) {
+    room.poly.forEach((a, index) => {
+      const b = room.poly[(index + 1) % room.poly.length];
+      const forward = `${a.join(',')}/${b.join(',')}`;
+      const reverse = `${b.join(',')}/${a.join(',')}`;
+      if (!unique.has(reverse)) unique.set(forward, { a, b });
+    });
+  }
+  return [...unique.values()];
+};
+
+const makeOpenings = (floor, walls, count) => walls.slice(0, count).map((wall, index) => {
+  const horizontal = Math.abs(wall.b[0] - wall.a[0]) >= Math.abs(wall.b[1] - wall.a[1]);
+  return {
+    id: `perf-opening-${floor}-${index}`,
+    type: index % 7 === 0 ? 'window' : index % 11 === 0 ? 'gate' : 'door',
+    x: round((wall.a[0] + wall.b[0]) / 2),
+    y: round((wall.a[1] + wall.b[1]) / 2),
+    angle: horizontal ? 0 : 90,
+    length: horizontal ? 0.045 : 0.055,
+  };
+});
+
+const makePartitions = (floor, rooms, count) => Array.from({ length: count }, (_, index) => {
+  const room = rooms[index % rooms.length];
+  const [a, , c] = room.poly;
+  const y = round(a[1] + (c[1] - a[1]) * (0.35 + (index % 3) * 0.12));
+  return {
+    id: `perf-partition-${floor}-${index}`,
+    a: [round(a[0] + 0.035), y],
+    b: [round(c[0] - 0.035), y],
+    cm: 10 + (index % 3) * 5,
+  };
+});
+
+const makeColumns = (floor, rooms, count) => Array.from({ length: count }, (_, index) => {
+  const room = rooms[(index * 3) % rooms.length];
+  const [a, , c] = room.poly;
+  return {
+    id: `perf-column-${floor}-${index}`,
+    shape: index % 3 === 0 ? 'circle' : 'square',
+    center: [
+      round(a[0] + (c[0] - a[0]) * (0.28 + (index % 2) * 0.44)),
+      round(a[1] + (c[1] - a[1]) * (0.28 + ((index >> 1) % 2) * 0.44)),
+    ],
+    cm: 25 + (index % 4) * 5,
+    ...(index % 3 === 0 ? {} : { angle: (index % 6) * 15 }),
+  };
+});
+
+const makeDecor = (floor, count) => Array.from({ length: count }, (_, index) => {
+  const column = index % 25;
+  const row = Math.floor(index / 25);
+  const x = round(0.02 + column * 0.039);
+  const y = round(0.018 + (row % 20) * 0.048);
+  if (index % 10 === 0) {
+    return {
+      id: `perf-decor-${floor}-${index}`,
+      kind: 'text', x, y, text: `F${floor + 1}-${index}`, size_cm: 14,
+      color: '#59636e', opacity: 0.75,
+    };
+  }
+  if (index % 3 === 0) {
+    return {
+      id: `perf-decor-${floor}-${index}`,
+      kind: 'rect', x, y, w: 0.022, h: 0.018, angle: (index % 12) * 5,
+      color: '#687681', opacity: 0.55, width_cm: 1.5,
+      fill: index % 2 === 0, fill_color: '#75838e', fill_opacity: 0.12,
+    };
+  }
+  return {
+    id: `perf-decor-${floor}-${index}`,
+    kind: 'line', x1: x, y1: y, x2: round(x + 0.025), y2: round(y + (index % 2 ? 0.012 : 0)),
+    color: '#687681', opacity: 0.6, width_cm: 1.2,
+    ...(index % 9 === 0 ? { line_style: 'dashed' } : {}),
+  };
+});
+
+const entityKinds = [
+  ['light', 'on'],
+  ['switch', 'off'],
+  ['sensor', '21.5'],
+  ['binary_sensor', 'off'],
+  ['climate', 'heat'],
+  ['media_player', 'playing'],
+  ['cover', 'closed'],
+  ['fan', 'on'],
+  ['lock', 'locked'],
+  ['vacuum', 'docked'],
+];
+
+const makeRuntime = (spaces) => {
+  const devices = {};
+  const entities = {};
+  const states = {};
+  const areas = {};
+  const layout = {};
+  const roomRefs = spaces.flatMap((space) => space.rooms.map((room) => ({ space, room })));
+  for (const { room } of roomRefs) areas[room.area] = { area_id: room.area, name: room.name };
+  for (let index = 0; index < DEVICE_COUNT; index++) {
+    const { space, room } = roomRefs[index % roomRefs.length];
+    const [domain, baseState] = entityKinds[index % entityKinds.length];
+    const deviceId = `perf-device-${index}`;
+    const entityId = `${domain}.perf_${index}`;
+    devices[deviceId] = {
+      id: deviceId,
+      name: `Synthetic ${domain} ${index + 1}`,
+      model: `PERF-${String(index + 1).padStart(3, '0')}`,
+      area_id: room.area,
+      identifiers: [['houseplan_perf', deviceId]],
+      config_entries: ['perf_entry'],
+      entry_type: null,
+      via_device_id: null,
+      disabled_by: null,
+    };
+    entities[entityId] = {
+      entity_id: entityId,
+      device_id: deviceId,
+      platform: 'houseplan_perf',
+      config_entry_id: 'perf_entry',
+      disabled_by: null,
+    };
+    const attributes = { friendly_name: devices[deviceId].name };
+    if (domain === 'sensor') Object.assign(attributes, {
+      device_class: 'temperature', unit_of_measurement: '°C', state_class: 'measurement',
+    });
+    if (domain === 'binary_sensor') attributes.device_class = index % 2 ? 'motion' : 'occupancy';
+    if (domain === 'climate') Object.assign(attributes, { current_temperature: 21.5, temperature: 22 });
+    states[entityId] = { entity_id: entityId, state: index % 4 === 0 && domain === 'light' ? 'off' : baseState, attributes };
+    const [a, , c] = room.poly;
+    layout[deviceId] = {
+      s: space.id,
+      x: round(a[0] + (c[0] - a[0]) * (0.2 + (index % 4) * 0.2)),
+      y: round(a[1] + (c[1] - a[1]) * (0.28 + ((index >> 2) % 3) * 0.22)),
+    };
+  }
+  return { devices, entities, states, areas, layout };
+};
+
+export const LARGE_HOUSE_COUNTS = Object.freeze({
+  floors: FLOOR_COUNT,
+  rooms: FLOOR_COUNT * ROOMS_PER_FLOOR,
+  devices: DEVICE_COUNT,
+  openings: OPENING_COUNT,
+  partitions: PARTITION_COUNT,
+  columns: COLUMN_COUNT,
+  decor: DECOR_COUNT,
+});
+
+export const makeLargeHouseFixture = () => {
+  let openingsLeft = OPENING_COUNT;
+  let partitionsLeft = PARTITION_COUNT;
+  let columnsLeft = COLUMN_COUNT;
+  let decorLeft = DECOR_COUNT;
+  const spaces = Array.from({ length: FLOOR_COUNT }, (_, floor) => {
+    const rooms = roomGrid(floor);
+    const segments = wallSegments(rooms);
+    const floorsRemaining = FLOOR_COUNT - floor;
+    const openingCount = Math.ceil(openingsLeft / floorsRemaining);
+    const partitionCount = Math.ceil(partitionsLeft / floorsRemaining);
+    const columnCount = Math.ceil(columnsLeft / floorsRemaining);
+    const decorCount = Math.ceil(decorLeft / floorsRemaining);
+    openingsLeft -= openingCount;
+    partitionsLeft -= partitionCount;
+    columnsLeft -= columnCount;
+    decorLeft -= decorCount;
+    return {
+      id: `perf-floor-${floor + 1}`,
+      title: `Performance floor ${floor + 1}`,
+      plan_url: null,
+      view_box: [0, 0, 1, 1],
+      cell_cm: 5,
+      settings: { fill_mode: 'glow', show_borders: true, show_names: true },
+      rooms,
+      walls: segments.map((wall, index) => ({
+        key: `perf-wall-${floor}-${index}`, cm: 15, a: wall.a, b: wall.b,
+      })),
+      openings: makeOpenings(floor, segments, openingCount),
+      partitions: makePartitions(floor, rooms, partitionCount),
+      wall_columns: makeColumns(floor, rooms, columnCount),
+      decor: makeDecor(floor, decorCount),
+    };
+  });
+  const runtime = makeRuntime(spaces);
+  return {
+    config: { spaces, markers: [], settings: { glow_radius_cm: 300 } },
+    ...runtime,
+    counts: LARGE_HOUSE_COUNTS,
+  };
+};

demo/fixtures/visual-matrix.mjs

@@ -0,0 +1,181 @@
+/** Deterministic fictional scenes for HP-QA-01 golden-image coverage. */
+
+const round = (value) => Number(value.toFixed(6));
+
+const uniqueEdges = (rooms) => {
+  const edges = new Map();
+  for (const room of rooms) {
+    room.poly.forEach((a, index) => {
+      const b = room.poly[(index + 1) % room.poly.length];
+      const forward = `${a.join(',')}/${b.join(',')}`;
+      const reverse = `${b.join(',')}/${a.join(',')}`;
+      if (!edges.has(reverse) && !edges.has(forward)) edges.set(forward, { a, b });
+    });
+  }
+  return [...edges.values()];
+};
+
+const wallsFor = (prefix, rooms, thickness) => uniqueEdges(rooms).map((edge, index) => ({
+  key: `${prefix}-wall-${index}`,
+  a: edge.a,
+  b: edge.b,
+  cm: typeof thickness === 'function' ? thickness(edge, index) : thickness,
+}));
+
+const geometryRooms = [
+  { id: 'geo-nw', name: 'NW', area: 'golden_geo_nw', poly: [[0.06, 0.08], [0.48, 0.08], [0.48, 0.48], [0.06, 0.48]] },
+  { id: 'geo-ne', name: 'NE', area: 'golden_geo_ne', poly: [[0.48, 0.08], [0.94, 0.08], [0.94, 0.48], [0.48, 0.48]] },
+  { id: 'geo-sw', name: 'SW', area: 'golden_geo_sw', poly: [[0.06, 0.48], [0.48, 0.48], [0.48, 0.92], [0.06, 0.92]] },
+  { id: 'geo-se', name: 'SE', area: 'golden_geo_se', poly: [[0.48, 0.48], [0.94, 0.48], [0.94, 0.92], [0.48, 0.92]] },
+  { id: 'geo-nested', name: 'Nested', area: 'golden_geo_nested',
+    poly: [[0.72, 0.14], [0.84, 0.26], [0.72, 0.38], [0.60, 0.26]] },
+];
+
+const lightingRooms = [
+  { id: 'light-left', name: 'Light source room', area: 'golden_light_left',
+    poly: [[0.07, 0.10], [0.50, 0.10], [0.50, 0.88], [0.07, 0.88]] },
+  { id: 'light-right', name: 'Receiving room', area: 'golden_light_right',
+    poly: [[0.50, 0.10], [0.93, 0.10], [0.93, 0.88], [0.50, 0.88]] },
+];
+
+const geometrySpace = {
+  id: 'golden-geometry',
+  title: 'Geometry matrix',
+  plan_url: null,
+  view_box: [0, 0, 1, 1],
+  cell_cm: 5,
+  settings: {
+    fill_mode: 'none', show_borders: true, show_names: true,
+    room_color: '#2d8fce', room_opacity: 0.16,
+  },
+  rooms: geometryRooms,
+  walls: wallsFor('geo', geometryRooms, (edge, index) => {
+    const vertical = Math.abs(edge.a[0] - edge.b[0]) < 1e-9;
+    if (vertical && Math.abs(edge.a[0] - 0.48) < 1e-9) return 25;
+    return index % 4 === 0 ? 10 : 15;
+  }),
+  open_spans: [{ a: [0.48, 0.15], b: [0.48, 0.27] }],
+  openings: [
+    { id: 'geo-window', type: 'window', x: 0.26, y: 0.08, angle: 0, length: 0.12 },
+    { id: 'geo-door', type: 'door', x: 0.48, y: 0.37, angle: 90, length: 0.12 },
+    { id: 'geo-gate', type: 'gate', x: 0.72, y: 0.92, angle: 0, length: 0.2 },
+    { id: 'geo-diagonal-window', type: 'window', x: 0.78, y: 0.20, angle: 45, length: 0.08 },
+  ],
+  partitions: [
+    { id: 'geo-partition-h', a: [0.14, 0.68], b: [0.40, 0.68], cm: 12 },
+    { id: 'geo-partition-v', a: [0.75, 0.56], b: [0.75, 0.82], cm: 20 },
+  ],
+  wall_columns: [
+    { id: 'geo-column-square', shape: 'square', center: [0.63, 0.67], cm: 35, angle: 30 },
+    { id: 'geo-column-circle', shape: 'circle', center: [0.86, 0.72], cm: 40 },
+  ],
+  decor: [
+    { id: 'geo-axis-h', kind: 'line', x1: 0.04, y1: 0.5, x2: 0.96, y2: 0.5,
+      color: '#5d6a73', opacity: 0.35, width_cm: 0.8, line_style: 'dashed' },
+  ],
+};
+
+const lightingSpace = {
+  id: 'golden-lighting',
+  title: 'Lighting matrix',
+  plan_url: null,
+  view_box: [0, 0, 1, 1],
+  cell_cm: 5,
+  settings: {
+    fill_mode: 'glow', show_borders: true, show_names: true,
+    north_deg: 0, sun_rays: true, bg_mode: 'static',
+  },
+  rooms: lightingRooms,
+  walls: wallsFor('light', lightingRooms, (edge) => (
+    Math.abs(edge.a[0] - 0.5) < 1e-9 && Math.abs(edge.b[0] - 0.5) < 1e-9 ? 25 : 15
+  )),
+  openings: [
+    { id: 'light-window', type: 'window', x: 0.27, y: 0.10, angle: 0, length: 0.14 },
+    { id: 'light-door', type: 'door', x: 0.50, y: 0.54, angle: 90, length: 0.15 },
+    { id: 'light-gate', type: 'gate', x: 0.74, y: 0.88, angle: 0, length: 0.22 },
+  ],
+  partitions: [
+    { id: 'light-partition', a: [0.70, 0.22], b: [0.70, 0.70], cm: 18 },
+  ],
+  wall_columns: [
+    { id: 'light-column', shape: 'circle', center: [0.38, 0.64], cm: 45 },
+  ],
+  decor: [],
+};
+
+const runtime = () => {
+  const devices = {};
+  const entities = {};
+  const states = {
+    'sun.sun': {
+      entity_id: 'sun.sun', state: 'above_horizon',
+      attributes: { azimuth: 180, elevation: 24 },
+    },
+  };
+  const layout = {};
+  const areas = Object.fromEntries(
+    [...geometryRooms, ...lightingRooms].map((room) => [room.area, { area_id: room.area, name: room.name }]),
+  );
+  const add = (id, domain, area, x, y, state, attributes = {}) => {
+    const entityId = `${domain}.${id.replaceAll('-', '_')}`;
+    devices[id] = {
+      id, name: `Golden ${id}`, model: `GOLDEN-${id.toUpperCase()}`, area_id: area,
+      identifiers: [['houseplan_golden', id]], config_entries: ['golden_entry'],
+      entry_type: null, via_device_id: null, disabled_by: null,
+    };
+    entities[entityId] = {
+      entity_id: entityId, device_id: id, platform: 'houseplan_golden',
+      config_entry_id: 'golden_entry', disabled_by: null,
+    };
+    states[entityId] = { entity_id: entityId, state, attributes: { friendly_name: devices[id].name, ...attributes } };
+    layout[id] = { s: 'golden-lighting', x: round(x), y: round(y) };
+  };
+  add('golden-light-one', 'light', 'golden_light_left', 0.20, 0.34, 'on', { rgb_color: [255, 196, 112] });
+  add('golden-light-two', 'light', 'golden_light_left', 0.35, 0.72, 'on', { color_temp_kelvin: 2700 });
+  add('golden-light-three', 'light', 'golden_light_right', 0.82, 0.30, 'off');
+  add('golden-presence', 'binary_sensor', 'golden_light_right', 0.82, 0.62, 'on', { device_class: 'occupancy' });
+  add('golden-climate', 'climate', 'golden_light_right', 0.60, 0.28, 'heat', {
+    current_temperature: 22.4, temperature: 23, hvac_action: 'heating',
+  });
+  add('golden-left-temperature', 'sensor', 'golden_light_left', 0.19, 0.54, '17', {
+    device_class: 'temperature', unit_of_measurement: '°C',
+  });
+  add('golden-right-temperature', 'sensor', 'golden_light_right', 0.81, 0.48, '29', {
+    device_class: 'temperature', unit_of_measurement: '°C',
+  });
+  add('golden-left-linkquality', 'sensor', 'golden_light_left', 0.34, 0.54, '35', {
+    unit_of_measurement: 'lqi',
+  });
+  add('golden-right-linkquality', 'sensor', 'golden_light_right', 0.66, 0.70, '190', {
+    unit_of_measurement: 'lqi',
+  });
+  return { devices, entities, states, layout, areas };
+};
+
+export const VISUAL_MATRIX_COUNTS = Object.freeze({
+  spaces: 2,
+  rooms: geometryRooms.length + lightingRooms.length,
+  openings: geometrySpace.openings.length + lightingSpace.openings.length,
+  partitions: geometrySpace.partitions.length + lightingSpace.partitions.length,
+  columns: geometrySpace.wall_columns.length + lightingSpace.wall_columns.length,
+});
+
+export const makeVisualMatrixFixture = () => ({
+  config: {
+    spaces: [structuredClone(geometrySpace), structuredClone(lightingSpace)],
+    markers: [],
+    settings: {
+      glow_radius_cm: 360,
+      north_deg: 0,
+      sun_rays: true,
+      bg_mode: 'static',
+      fill_colors: {
+        glow_base: { c: '#1b2530', a: 0.78 },
+        glow_light: { c: '#ffd27b', a: 0.70 },
+        wall_fill: { c: '#d7d9dc', a: 1 },
+      },
+    },
+  },
+  ...runtime(),
+  counts: VISUAL_MATRIX_COUNTS,
+});

demo/golden/README.md

@@ -0,0 +1,50 @@
+# HP-QA-01 golden images
+
+This layer catches visual regressions that DOM smokes cannot: wall seams and
+end caps, thick opening tunnels, Glow/sun clipping, hover contours, editor
+chrome, the open contextual tray at wide/medium/narrow widths in English and
+Russian (selection, tool options, group and palette), long dialog
+titles/footers, mobile clipping, themes and zoom/remount.
+
+## Safety contract
+
+- A build fingerprint embedded by Rollup must match `src/`, Rollup/TypeScript
+  configuration and locked package inputs; stale committed
+  demo bundles fail before the first screenshot.
+- Chromium, viewport, locale, timezone, colour profile, font rendering,
+  animations and caret are controlled by the runner.
+- `capture` writes only to ignored `artifacts/golden/`; it never changes a
+  baseline and never claims a missing baseline passed. Any scenario runtime
+  error makes capture fail, including the initial no-baseline CI run.
+- `verify` requires every image plus a matching matrix manifest and fails on
+  missing/different/error scenarios, browser mismatch or a baseline whose hash
+  no longer matches the reviewed manifest.
+- `accept` requires `--reviewed`, a complete candidate report and current
+  source fingerprint. It validates the whole set before copying anything and
+  is the only command allowed to update baselines.
+
+## Workflow
+
+Build and copy the exact current source first:
+
+```bash
+npm run build
+cp dist/houseplan-card.js demo/srv/assets/houseplan-card.js
+npm run golden:capture
+```
+
+Review `artifacts/golden/actual/` and, when existing references are present,
+`artifacts/golden/diff/`. If every image is intentional:
+
+```bash
+npm run golden:accept -- --reviewed
+npm run golden:verify
+```
+
+Never accept images merely to make CI green. A matrix/framing change increments
+`GOLDEN_MATRIX_VERSION`; a normal rendering fix does not. The first canonical
+Linux baseline was reviewed and accepted during the v1.60.3-beta.1 gate.
+Future updates must still use the `golden-images` artifact produced by the Linux
+CI job as the review set: desktop font rasterisation can differ from the CI
+environment even with the same pinned Chromium. Pass its unpacked root via
+`--from=...` when accepting it locally.

demo/golden/accept.mjs

@@ -0,0 +1,57 @@
+#!/usr/bin/env node
+import { createHash } from 'node:crypto';
+import { copyFileSync, existsSync, mkdirSync, readFileSync, writeFileSync } from 'node:fs';
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { sourceFingerprint } from '../../scripts/source-fingerprint.mjs';
+import { GOLDEN_MATRIX_VERSION, GOLDEN_SCENARIOS } from './matrix.mjs';
+import { GOLDEN_BASELINE_MANIFEST } from './policy.mjs';
+
+const ROOT = resolve(dirname(fileURLToPath(import.meta.url)), '../..');
+const reviewed = process.argv.includes('--reviewed');
+const fromArg = process.argv.find((arg) => arg.startsWith('--from='));
+const from = resolve(fromArg ? fromArg.slice('--from='.length) : resolve(ROOT, 'artifacts/golden'));
+if (!reviewed) throw new Error('refusing to replace baselines without explicit --reviewed');
+
+const reportPath = resolve(from, 'golden-report.json');
+if (!existsSync(reportPath)) throw new Error(`candidate report not found: ${reportPath}`);
+const report = JSON.parse(readFileSync(reportPath, 'utf8'));
+if (report.matrixVersion !== GOLDEN_MATRIX_VERSION)
+  throw new Error(`candidate matrix ${report.matrixVersion} != current ${GOLDEN_MATRIX_VERSION}`);
+if (report.buildFingerprint !== sourceFingerprint(ROOT))
+  throw new Error('candidate screenshots were not captured from the current frontend source');
+if (typeof report.chromium !== 'string' || !report.chromium)
+  throw new Error('candidate report does not identify its Chromium build');
+if (!Array.isArray(report.results)) throw new Error('candidate report has no scenario results');
+
+const byId = new Map(report.results.map((result) => [result.id, result]));
+const baselineRoot = resolve(ROOT, 'demo/golden/baselines');
+mkdirSync(baselineRoot, { recursive: true });
+const hashes = {};
+const candidates = [];
+for (const scenario of GOLDEN_SCENARIOS) {
+  const result = byId.get(scenario.id);
+  const candidate = resolve(from, 'actual', `${scenario.id}.png`);
+  if (result?.error || !['missing-baseline', 'passed', 'different'].includes(result?.status))
+    throw new Error(`review candidate has an invalid run status: ${scenario.id} (${result?.status || 'missing'})`);
+  if (!result?.actualSha256 || !existsSync(candidate))
+    throw new Error(`review candidate missing: ${scenario.id}`);
+  const bytes = readFileSync(candidate);
+  const digest = createHash('sha256').update(bytes).digest('hex');
+  if (digest !== result.actualSha256) throw new Error(`candidate changed after capture: ${scenario.id}`);
+  candidates.push({ scenario, candidate });
+  hashes[scenario.id] = digest;
+}
+// Validate the complete set first: a broken report must never leave a half-
+// updated baseline directory behind.
+for (const { scenario, candidate } of candidates)
+  copyFileSync(candidate, resolve(baselineRoot, `${scenario.id}.png`));
+writeFileSync(resolve(baselineRoot, GOLDEN_BASELINE_MANIFEST), `${JSON.stringify({
+  schema: 1,
+  matrixVersion: GOLDEN_MATRIX_VERSION,
+  acceptedAt: new Date().toISOString(),
+  sourceFingerprint: report.buildFingerprint,
+  chromium: report.chromium,
+  scenarios: hashes,
+}, null, 2)}\n`, 'utf8');
+console.log(`Accepted ${GOLDEN_SCENARIOS.length} reviewed golden baselines.`);

demo/golden/baselines/.gitkeep

@@ -0,0 +1 @@
+

demo/golden/baselines/baseline-manifest.json

@@ -0,0 +1,35 @@
+{
+  "schema": 1,
+  "matrixVersion": 3,
+  "acceptedAt": "2026-08-09T12:30:01.505Z",
+  "sourceFingerprint": "f1969cf05ab483dd1bf24d32d967f931f1e3c9ce37cd3f61d4b851f1eae417ee",
+  "chromium": "151.0.7922.34",
+  "scenarios": {
+    "geometry-view-dark-fit": "fbce77f97180cd7d50a997c74d3fa1874ee3be2515a4c09b36dd4e792ebc66df",
+    "geometry-view-light-fit": "a425fa6d77081bb35d2fb81e469962402c6a3c86a8113ff957f28548908d0816",
+    "geometry-plan-editor-dark": "86d64305e4da13436aef14fe96b2c9eb5978d1d32a0bba2318005421a2fda161",
+    "geometry-devices-editor-dark": "93417ab7363ca50e65c9d6f0b876f4d5a6a367a8fabdf42306b244e6511693f1",
+    "geometry-decor-editor-dark": "25d341052e30e7acea13c17897e8bd0f1f08235342b949c02afd3db5b9936c64",
+    "tray-wide-selection-en": "c7350c3661f17f46d22b2c977524fde9fba1ebf9d6e10f021482f0d1caeffa8a",
+    "tray-wide-tool-ru": "5472a302ad7e7b70235089164a5c4558183504519d95280e8ff30883e304cb71",
+    "tray-medium-group-en": "59480e04ff5ea0f2cfb31b88c1c753ce8eeac785596ca21eac48dd99ec5e0eb6",
+    "tray-medium-selection-ru": "805c23560bc340582f9b951e910f39245ab62b6cd980d175c8d9e3b7e1ef1519",
+    "tray-narrow-palette-en": "e8dede0d90ebc32e1e294ba3c39621df918aaf7b3183f71aed9b60014eee51db",
+    "tray-narrow-tool-ru": "8889d58aca90daadf0bedd6a7c08afb2604c086a453f9435f32d29607aa49e42",
+    "geometry-diagonal-45-opening-dark": "fbce77f97180cd7d50a997c74d3fa1874ee3be2515a4c09b36dd4e792ebc66df",
+    "openings-thick-wall-dark": "5d9ac6add9a5709318180f4554ac62c1c7e2862bd016be7901a2bd450e021f0c",
+    "openings-hidden-view-dark": "799e791830ab63a1c445b8c77650a577d8e881daa1ff47d1dcf4e238eb1cff16",
+    "lighting-glow-sun-dark": "638ab9fa6856f91581453c732e4059b2a7af47b20d6a58b45a47497876142ea1",
+    "lighting-fill-light-axis-split-dark": "acdbebe845ede66dbbe9de979aad93ba78dc2779d1ec533b238a9bea0d047d1c",
+    "lighting-fill-temp-axis-split-dark": "2348b7c6a8594468664755e2fea1b49126e604192599be0a3965f24a0c2d2765",
+    "lighting-fill-lqi-axis-split-dark": "584adcfb5541b1dddc814c2674bfce8002566bbb667b10501b7ff49fedef6f9c",
+    "hover-over-glow-dark": "3ca354fa94922a3e38ce15886250ae88630a1e9356e4ac07b74b425f063839d7",
+    "hover-nested-room-dark": "472f630768f60c3168f64744af891323a64cf71f36f943fc5a56b4f0494efa70",
+    "large-house-zoom-040-dark": "69593f75f1965daf0a12777fde923ae25c99b42089a73a04cf523b3ea5ce4f0d",
+    "large-house-zoom-250-dark": "21a1a0408c913f477913ae9c0339417ae7aaad7baad8a890eb558f6e36a5a597",
+    "large-house-warm-remount-dark": "f3eb077934701cf11bc828da6a68b55346d499a68c323988938b88aca5f5d9fe",
+    "device-dialog-desktop-en": "c2e1c2864f13b9e27e0d56e3eb7a7b245feab0d543f5533a7b3c4aa34ab2f3eb",
+    "device-dialog-mobile-ru": "5445eb576636362d402f66aa80c3816e01ca7ee75f4ffc86708ff3a43bbfb4a5",
+    "decor-color-popover-mobile-ru": "eab3c5c76b27050dbdbc1627371a16916ea30473934de48842c6ab94a045f9db"
+  }
+}

demo/golden/harness.mjs

@@ -0,0 +1,257 @@
+import { makeLargeHouseFixture } from '../fixtures/large-house.mjs';
+import { makeVisualMatrixFixture } from '../fixtures/visual-matrix.mjs';
+
+const fixtureFor = (name) => name === 'large' ? makeLargeHouseFixture() : makeVisualMatrixFixture();
+
+const themeVars = {
+  dark: {
+    '--primary-color': '#3ea6ff', '--primary-text-color': '#e6e7eb',
+    '--secondary-text-color': '#9aa4ad', '--card-background-color': '#202126',
+    '--ha-card-background': '#202126', '--divider-color': '#3a3d45',
+  },
+  light: {
+    '--primary-color': '#0b73b8', '--primary-text-color': '#202124',
+    '--secondary-text-color': '#5f6368', '--card-background-color': '#ffffff',
+    '--ha-card-background': '#ffffff', '--divider-color': '#d7d9de',
+  },
+};
+
+async function stableEnvironment(page, scenario) {
+  await page.setViewportSize(scenario.viewport);
+  await page.emulateMedia({ reducedMotion: 'reduce', colorScheme: scenario.theme });
+  await page.evaluate(({ variables, theme }) => {
+    let style = document.getElementById('hp-golden-stability');
+    if (!style) {
+      style = document.createElement('style');
+      style.id = 'hp-golden-stability';
+      style.textContent = `
+        *, *::before, *::after {
+          animation: none !important;
+          transition: none !important;
+          caret-color: transparent !important;
+          scroll-behavior: auto !important;
+        }
+        html, body { width: 100%; min-height: 100%; overflow: hidden; }
+        body { background: var(--hp-golden-page-bg) !important;
+          font-family: Arial, sans-serif !important; }
+        #host { width: min(100%, 1120px) !important; margin: 0 auto !important;
+          padding: 8px !important; box-sizing: border-box !important; }
+      `;
+      document.head.appendChild(style);
+    }
+    for (const [name, value] of Object.entries(variables))
+      document.documentElement.style.setProperty(name, value);
+    document.documentElement.style.setProperty(
+      '--hp-golden-page-bg', theme === 'light' ? '#eef1f4' : '#11151b',
+    );
+    document.documentElement.style.colorScheme = theme;
+  }, { variables: themeVars[scenario.theme] || themeVars.dark, theme: scenario.theme });
+}
+
+export async function prepareGoldenScenario(page, scenario) {
+  await stableEnvironment(page, scenario);
+  const fixture = fixtureFor(scenario.fixture);
+  if (scenario.deviceName && fixture.devices?.[scenario.deviceId])
+    fixture.devices[scenario.deviceId].name = scenario.deviceName;
+  if (scenario.fillMode) {
+    const space = fixture.config.spaces.find((item) => item.id === scenario.space);
+    space.settings = { ...(space.settings || {}), fill_mode: scenario.fillMode };
+  }
+  if (scenario.hideOpenings) {
+    const space = fixture.config.spaces.find((item) => item.id === scenario.space);
+    space.settings = { ...(space.settings || {}), hide_openings: true };
+  }
+
+  return page.evaluate(async ({ fixture, scenario }) => {
+    const wait = (ms) => new Promise((done) => setTimeout(done, ms));
+    const frame = () => new Promise((done) => requestAnimationFrame(() => requestAnimationFrame(done)));
+    const until = async (predicate, timeout = 10000) => {
+      const started = performance.now();
+      while (!predicate()) {
+        if (performance.now() - started > timeout) throw new Error(`golden scenario timed out: ${scenario.id}`);
+        await wait(15);
+      }
+    };
+    window.__goldenCard?.remove?.();
+    window.__card?.remove?.();
+    localStorage.clear();
+    const host = document.getElementById('host');
+    const cardConfig = {
+      type: 'custom:houseplan-card', title: `Golden ${scenario.id}`, icon_size: 3.4,
+      language: scenario.language || 'en',
+    };
+    const hassFor = () => ({
+      language: scenario.language || 'en', locale: { language: scenario.language || 'en' },
+      user: { id: 'golden', name: 'Golden fixture', is_admin: true },
+      devices: fixture.devices || {}, entities: fixture.entities || {},
+      areas: fixture.areas || {}, states: fixture.states || {},
+      floors: {
+        one: { floor_id: 'one', name: 'One', level: 0 },
+        two: { floor_id: 'two', name: 'Two', level: 1 },
+        three: { floor_id: 'three', name: 'Three', level: 2 },
+      },
+      callWS: async (message) => {
+        if (message.type === 'houseplan/config/get')
+          return { config: structuredClone(fixture.config), rev: 1, can_write: true };
+        if (message.type === 'houseplan/layout/get')
+          return { layout: structuredClone(fixture.layout || {}), rev: 1 };
+        if (message.type === 'config/device_registry/list') return Object.values(fixture.devices || {});
+        if (message.type === 'config/entity_registry/list') return Object.values(fixture.entities || {});
+        if (message.type === 'config_entries/get')
+          return [{ entry_id: 'golden_entry', domain: 'houseplan_golden', title: 'Golden fixture' }];
+        if (message.type === 'manifest/list')
+          return [{ domain: 'houseplan_golden', name: 'House Plan Golden' }];
+        return { ok: true };
+      },
+      callService: async () => undefined,
+      connection: { subscribeEvents: async () => () => undefined, subscribeMessage: async () => () => undefined },
+      localize: () => null,
+      formatEntityState: (state) => state.state,
+      config: { unit_system: { length: 'km' } },
+    });
+    const mount = async () => {
+      const card = document.createElement('houseplan-card');
+      card.setConfig(cardConfig);
+      host.replaceChildren(card);
+      card.hass = hassFor();
+      await until(() => card._loadOk && card._model?.length === fixture.config.spaces.length);
+      await card.updateComplete;
+      const expectedDevices = Object.keys(fixture.devices || {}).length;
+      if (expectedDevices) await until(() => card._devices?.length >= expectedDevices);
+      await until(() => card._booting === false);
+      await frame();
+      return card;
+    };
+
+    let card = await mount();
+    if (scenario.warmRemount) {
+      card.remove();
+      await wait(0);
+      card = await mount();
+    }
+    window.__goldenCard = card;
+    if (scenario.space && card._space !== scenario.space) {
+      card._pickSpace(scenario.space);
+      await card.updateComplete;
+    }
+    if (scenario.mode) {
+      card._setMode(scenario.mode);
+      await card.updateComplete;
+    }
+    if (Number.isFinite(scenario.zoom)) {
+      card._applyView(scenario.zoom, 500, 500);
+      card.requestUpdate();
+      await card.updateComplete;
+    }
+    if (scenario.editorTray) {
+      let expectedKind = '';
+      if (scenario.editorTray === 'plan-selection') {
+        card._physicalSel = { kind: 'partition', id: 'geo-partition-h' };
+        expectedKind = 'selection';
+      } else if (scenario.editorTray === 'plan-tool') {
+        card._physicalSel = null;
+        card._tool = 'draw';
+        expectedKind = 'tool';
+      } else if (scenario.editorTray === 'decor-selection') {
+        card._decorTool = 'select';
+        card._decorSel = 'geo-axis-h';
+        expectedKind = 'selection';
+      } else if (scenario.editorTray === 'decor-tool') {
+        card._decorSel = null;
+        card._decorTool = 'line';
+        expectedKind = 'tool';
+      } else if (scenario.editorTray === 'furniture-palette') {
+        card._decorSel = null;
+        card._furnPalette = null;
+        card._editorSecondary.openPalette();
+        card._decorTool = 'furniture';
+        expectedKind = 'palette';
+      } else if (scenario.editorTray === 'group') {
+        const group = {
+          id: 'golden-group', label: 'Arrange', icon: 'mdi:shape-outline', items: [
+            { id: 'align', label: 'Align', icon: 'mdi:format-align-center', role: 'command', invoke: () => undefined },
+            { id: 'distribute', label: 'Distribute', icon: 'mdi:format-horizontal-align-center', role: 'command', invoke: () => undefined },
+          ],
+        };
+        Object.defineProperty(card, '_editorToolbarGroups', {
+          configurable: true,
+          get: () => [group],
+        });
+        card.requestUpdate();
+        await card.updateComplete;
+        card._editorSecondary.toggleGroup(card._editorToolbarGroups, group.id);
+        expectedKind = 'group';
+      } else {
+        throw new Error(`unknown golden editor tray: ${scenario.editorTray}`);
+      }
+      card.requestUpdate();
+      await card.updateComplete;
+      await frame();
+      const tray = card.renderRoot.querySelector(
+        `.editor-secondary-host.open .editor-secondary.kind-${expectedKind}`,
+      );
+      if (!tray) throw new Error(`golden editor tray did not open: ${scenario.editorTray}`);
+    }
+    if (scenario.hoverRoom) {
+      const room = card._spaceModel().rooms.find((item) => item.id === scenario.hoverRoom);
+      if (!room) throw new Error(`golden hover room missing: ${scenario.hoverRoom}`);
+      card._hoverRoom = { space: card._space, room };
+      card.requestUpdate();
+      await card.updateComplete;
+    }
+    if (scenario.dialog === 'device') {
+      card._setMode('devices');
+      await card.updateComplete;
+      const device = card._devices.find((item) => item.id === scenario.deviceId);
+      if (!device) throw new Error(`golden device missing: ${scenario.deviceId}`);
+      card._openMarkerDialog(device);
+      await card.updateComplete;
+      if (scenario.focusDialogClose) {
+        const dialog = card.renderRoot.querySelector('hp-dialog');
+        await dialog?.updateComplete;
+        dialog?.renderRoot?.querySelector('.close')?.focus();
+      }
+    } else if (scenario.dialog === 'decor-color') {
+      card._setMode('decor');
+      card._decorTool = 'select';
+      await card.updateComplete;
+      const shape = card._decorList.find((item) => item.kind === 'line');
+      if (!shape) throw new Error('golden decor line missing');
+      card._decorShapeDbl(new MouseEvent('dblclick'), shape);
+      await card.updateComplete;
+      const dialog = card.renderRoot.querySelector('hp-dialog');
+      const picker = dialog?.querySelector('hp-color-opacity');
+      await picker?.updateComplete;
+      const trigger = picker?.renderRoot?.querySelector('.trigger');
+      if (!trigger) throw new Error('golden decor color trigger missing');
+      trigger.click();
+      await picker.updateComplete;
+    }
+    await document.fonts?.ready;
+    await frame();
+    return {
+      space: card._space,
+      mode: card._mode,
+      devices: card._devices.length,
+      dialog: !!card.renderRoot.querySelector('hp-dialog'),
+      editorTray: card.renderRoot.querySelector('.editor-secondary-host.open .editor-secondary')
+        ?.className || '',
+    };
+  }, { fixture, scenario });
+}
+
+export async function goldenClip(page, capture) {
+  if (capture === 'page') return null;
+  return page.evaluate(() => {
+    const card = window.__goldenCard;
+    const target = card?.renderRoot?.querySelector('.stage');
+    if (!target) throw new Error('golden stage capture target missing');
+    const rect = target.getBoundingClientRect();
+    const pad = 2;
+    const x = Math.max(0, Math.floor(rect.left - pad));
+    const y = Math.max(0, Math.floor(rect.top - pad));
+    const right = Math.min(window.innerWidth, Math.ceil(rect.right + pad));
+    const bottom = Math.min(window.innerHeight, Math.ceil(rect.bottom + pad));
+    return { x, y, width: Math.max(1, right - x), height: Math.max(1, bottom - y) };
+  });
+}

demo/golden/matrix.mjs

@@ -0,0 +1,73 @@
+/** Data-only HP-QA-01 capture matrix. Bump when framing or scenarios change. */
+export const GOLDEN_MATRIX_VERSION = 3;
+
+const stage = { capture: 'stage', threshold: { maxChannelDelta: 10, maxDiffRatio: 0.0005 } };
+const page = { capture: 'page', threshold: { maxChannelDelta: 10, maxDiffRatio: 0.0008 } };
+
+export const GOLDEN_SCENARIOS = Object.freeze([
+  { id: 'geometry-view-dark-fit', fixture: 'visual', space: 'golden-geometry', mode: 'view',
+    theme: 'dark', viewport: { width: 1000, height: 900 }, ...stage },
+  { id: 'geometry-view-light-fit', fixture: 'visual', space: 'golden-geometry', mode: 'view',
+    theme: 'light', viewport: { width: 1000, height: 900 }, ...stage },
+  { id: 'geometry-plan-editor-dark', fixture: 'visual', space: 'golden-geometry', mode: 'plan',
+    theme: 'dark', viewport: { width: 1180, height: 900 }, ...page },
+  { id: 'geometry-devices-editor-dark', fixture: 'visual', space: 'golden-geometry', mode: 'devices',
+    theme: 'dark', viewport: { width: 1180, height: 900 }, ...page },
+  { id: 'geometry-decor-editor-dark', fixture: 'visual', space: 'golden-geometry', mode: 'decor',
+    theme: 'dark', viewport: { width: 1180, height: 900 }, ...page },
+  // HP-UX-11 visual contract: every adaptive width is captured in both
+  // languages while the six materially different tray contents are open.
+  { id: 'tray-wide-selection-en', fixture: 'visual', space: 'golden-geometry', mode: 'plan',
+    editorTray: 'plan-selection', language: 'en', theme: 'dark',
+    viewport: { width: 1180, height: 900 }, ...page },
+  { id: 'tray-wide-tool-ru', fixture: 'visual', space: 'golden-geometry', mode: 'plan',
+    editorTray: 'plan-tool', language: 'ru', theme: 'dark',
+    viewport: { width: 1180, height: 900 }, ...page },
+  { id: 'tray-medium-group-en', fixture: 'visual', space: 'golden-geometry', mode: 'plan',
+    editorTray: 'group', language: 'en', theme: 'dark',
+    viewport: { width: 760, height: 820 }, ...page },
+  { id: 'tray-medium-selection-ru', fixture: 'visual', space: 'golden-geometry', mode: 'decor',
+    editorTray: 'decor-selection', language: 'ru', theme: 'dark',
+    viewport: { width: 760, height: 820 }, ...page },
+  { id: 'tray-narrow-palette-en', fixture: 'visual', space: 'golden-geometry', mode: 'decor',
+    editorTray: 'furniture-palette', language: 'en', theme: 'dark',
+    viewport: { width: 390, height: 760 }, ...page },
+  { id: 'tray-narrow-tool-ru', fixture: 'visual', space: 'golden-geometry', mode: 'decor',
+    editorTray: 'decor-tool', language: 'ru', theme: 'dark',
+    viewport: { width: 390, height: 760 }, ...page },
+  { id: 'geometry-diagonal-45-opening-dark', fixture: 'visual', space: 'golden-geometry', mode: 'view',
+    theme: 'dark', viewport: { width: 1000, height: 900 }, ...stage },
+  { id: 'openings-thick-wall-dark', fixture: 'visual', space: 'golden-lighting', mode: 'view',
+    fillMode: 'none', theme: 'dark', viewport: { width: 1000, height: 900 }, ...stage },
+  { id: 'openings-hidden-view-dark', fixture: 'visual', space: 'golden-lighting', mode: 'view',
+    fillMode: 'none', hideOpenings: true, theme: 'dark', viewport: { width: 1000, height: 900 }, ...stage },
+  { id: 'lighting-glow-sun-dark', fixture: 'visual', space: 'golden-lighting', mode: 'view',
+    theme: 'dark', viewport: { width: 1000, height: 900 }, ...stage },
+  { id: 'lighting-fill-light-axis-split-dark', fixture: 'visual', space: 'golden-lighting', mode: 'view',
+    fillMode: 'light', theme: 'dark', viewport: { width: 1000, height: 900 }, ...stage },
+  { id: 'lighting-fill-temp-axis-split-dark', fixture: 'visual', space: 'golden-lighting', mode: 'view',
+    fillMode: 'temp', theme: 'dark', viewport: { width: 1000, height: 900 }, ...stage },
+  { id: 'lighting-fill-lqi-axis-split-dark', fixture: 'visual', space: 'golden-lighting', mode: 'view',
+    fillMode: 'lqi', theme: 'dark', viewport: { width: 1000, height: 900 }, ...stage },
+  { id: 'hover-over-glow-dark', fixture: 'visual', space: 'golden-lighting', mode: 'view',
+    hoverRoom: 'light-right', theme: 'dark', viewport: { width: 1000, height: 900 }, ...stage },
+  { id: 'hover-nested-room-dark', fixture: 'visual', space: 'golden-geometry', mode: 'view',
+    hoverRoom: 'geo-nested', theme: 'dark', viewport: { width: 1000, height: 900 }, ...stage },
+  { id: 'large-house-zoom-040-dark', fixture: 'large', space: 'perf-floor-1', mode: 'view',
+    zoom: 0.4, theme: 'dark', viewport: { width: 1180, height: 900 }, ...stage },
+  { id: 'large-house-zoom-250-dark', fixture: 'large', space: 'perf-floor-1', mode: 'view',
+    zoom: 2.5, theme: 'dark', viewport: { width: 1180, height: 900 }, ...stage },
+  { id: 'large-house-warm-remount-dark', fixture: 'large', space: 'perf-floor-2', mode: 'view',
+    warmRemount: true, theme: 'dark', viewport: { width: 1180, height: 900 }, ...stage },
+  { id: 'device-dialog-desktop-en', fixture: 'visual', space: 'golden-lighting',
+    dialog: 'device', deviceId: 'golden-climate',
+    deviceName: 'Living room climate controller with an intentionally long title',
+    focusDialogClose: true, language: 'en', theme: 'dark', viewport: { width: 1180, height: 900 }, ...page },
+  { id: 'device-dialog-mobile-ru', fixture: 'visual', space: 'golden-lighting',
+    dialog: 'device', deviceId: 'golden-climate',
+    deviceName: 'Контроллер климата гостиной с намеренно очень длинным названием',
+    language: 'ru', theme: 'dark', viewport: { width: 390, height: 760 }, ...page },
+  { id: 'decor-color-popover-mobile-ru', fixture: 'visual', space: 'golden-geometry',
+    dialog: 'decor-color', language: 'ru', theme: 'dark',
+    viewport: { width: 390, height: 760 }, ...page },
+]);

demo/golden/policy.mjs

@@ -0,0 +1,13 @@
+export const GOLDEN_BASELINE_MANIFEST = 'baseline-manifest.json';
+
+export const assertGoldenInvocation = (mode, scenarioFilter = '') => {
+  if (!['capture', 'verify'].includes(mode)) throw new Error(`unknown golden mode: ${mode}`);
+  if (mode === 'verify' && scenarioFilter)
+    throw new Error('golden verify must run the complete matrix; use capture for a diagnostic --scenario run');
+};
+
+export const goldenRunFailed = (mode, manifestValid, results) => {
+  if (results.some((result) => result.status === 'error')) return true;
+  return mode === 'verify'
+    && (!manifestValid || results.some((result) => result.status !== 'passed'));
+};

demo/golden/run.mjs

@@ -0,0 +1,209 @@
+#!/usr/bin/env node
+import { createHash } from 'node:crypto';
+import { existsSync, mkdirSync, readFileSync, writeFileSync } from 'node:fs';
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { launch } from '../serve.mjs';
+import { assertFreshDemoBundle } from '../bundle-freshness.mjs';
+import { goldenClip, prepareGoldenScenario } from './harness.mjs';
+import { GOLDEN_MATRIX_VERSION, GOLDEN_SCENARIOS } from './matrix.mjs';
+import { assertGoldenInvocation, GOLDEN_BASELINE_MANIFEST, goldenRunFailed } from './policy.mjs';
+
+const ROOT = resolve(dirname(fileURLToPath(import.meta.url)), '../..');
+const mode = process.argv.find((arg) => arg.startsWith('--mode='))?.slice(7) || 'capture';
+const scenarioFilter = process.argv.find((arg) => arg.startsWith('--scenario='))?.slice(11) || '';
+assertGoldenInvocation(mode, scenarioFilter);
+const scenarios = scenarioFilter
+  ? GOLDEN_SCENARIOS.filter((scenario) => scenario.id === scenarioFilter)
+  : GOLDEN_SCENARIOS;
+if (!scenarios.length) throw new Error(`unknown golden scenario: ${scenarioFilter}`);
+
+const artifactRoot = resolve(ROOT, 'artifacts/golden');
+const actualRoot = resolve(artifactRoot, 'actual');
+const diffRoot = resolve(artifactRoot, 'diff');
+const baselineRoot = resolve(ROOT, 'demo/golden/baselines');
+mkdirSync(actualRoot, { recursive: true });
+mkdirSync(diffRoot, { recursive: true });
+
+const sha256 = (buffer) => createHash('sha256').update(buffer).digest('hex');
+
+async function comparePng(page, actual, baseline, threshold) {
+  return page.evaluate(async ({ actual64, baseline64, threshold }) => {
+    const decode = async (base64) => {
+      const bytes = Uint8Array.from(atob(base64), (char) => char.charCodeAt(0));
+      return createImageBitmap(new Blob([bytes], { type: 'image/png' }));
+    };
+    const [actualImage, baselineImage] = await Promise.all([decode(actual64), decode(baseline64)]);
+    if (actualImage.width !== baselineImage.width || actualImage.height !== baselineImage.height) {
+      return {
+        dimensionsMatch: false,
+        actualSize: [actualImage.width, actualImage.height],
+        baselineSize: [baselineImage.width, baselineImage.height],
+        differingPixels: null,
+        diffRatio: 1,
+        maxObservedDelta: 255,
+        passed: false,
+        diffPngBase64: null,
+      };
+    }
+    const width = actualImage.width;
+    const height = actualImage.height;
+    const canvas = document.createElement('canvas');
+    const baselineCanvas = document.createElement('canvas');
+    const diffCanvas = document.createElement('canvas');
+    for (const item of [canvas, baselineCanvas, diffCanvas]) {
+      item.width = width;
+      item.height = height;
+    }
+    const context = canvas.getContext('2d', { willReadFrequently: true });
+    const baselineContext = baselineCanvas.getContext('2d', { willReadFrequently: true });
+    const diffContext = diffCanvas.getContext('2d');
+    context.drawImage(actualImage, 0, 0);
+    baselineContext.drawImage(baselineImage, 0, 0);
+    const actualData = context.getImageData(0, 0, width, height).data;
+    const baselineData = baselineContext.getImageData(0, 0, width, height).data;
+    const diff = diffContext.createImageData(width, height);
+    let differingPixels = 0;
+    let maxObservedDelta = 0;
+    for (let offset = 0; offset < actualData.length; offset += 4) {
+      let delta = 0;
+      for (let channel = 0; channel < 4; channel++)
+        delta = Math.max(delta, Math.abs(actualData[offset + channel] - baselineData[offset + channel]));
+      maxObservedDelta = Math.max(maxObservedDelta, delta);
+      if (delta > threshold.maxChannelDelta) {
+        differingPixels++;
+        diff.data[offset] = 255;
+        diff.data[offset + 1] = 0;
+        diff.data[offset + 2] = 180;
+        diff.data[offset + 3] = 255;
+      } else {
+        const gray = Math.round((actualData[offset] + actualData[offset + 1] + actualData[offset + 2]) / 9);
+        diff.data[offset] = gray;
+        diff.data[offset + 1] = gray;
+        diff.data[offset + 2] = gray;
+        diff.data[offset + 3] = 90;
+      }
+    }
+    diffContext.putImageData(diff, 0, 0);
+    const diffRatio = differingPixels / (width * height);
+    return {
+      dimensionsMatch: true,
+      actualSize: [width, height],
+      baselineSize: [width, height],
+      differingPixels,
+      diffRatio,
+      maxObservedDelta,
+      passed: diffRatio <= threshold.maxDiffRatio,
+      diffPngBase64: differingPixels
+        ? diffCanvas.toDataURL('image/png').slice('data:image/png;base64,'.length)
+        : null,
+    };
+  }, {
+    actual64: actual.toString('base64'),
+    baseline64: baseline.toString('base64'),
+    threshold,
+  });
+}
+
+let baselineManifest = null;
+const baselineManifestPath = resolve(baselineRoot, GOLDEN_BASELINE_MANIFEST);
+if (existsSync(baselineManifestPath)) {
+  try { baselineManifest = JSON.parse(readFileSync(baselineManifestPath, 'utf8')); }
+  catch { baselineManifest = { invalid: true }; }
+}
+
+const { page, browser } = await launch(
+  { width: 1000, height: 900 },
+  1,
+  ['--force-color-profile=srgb', '--font-render-hinting=none', '--disable-lcd-text'],
+  { locale: 'en-US', timezoneId: 'UTC', colorScheme: 'dark', reducedMotion: 'reduce' },
+);
+const chromium = await browser.version();
+const results = [];
+const pageErrors = [];
+page.on('pageerror', (error) => pageErrors.push(error.message));
+let buildFingerprint = null;
+try {
+  buildFingerprint = await assertFreshDemoBundle(page, ROOT);
+  for (const scenario of scenarios) {
+    const result = {
+      id: scenario.id,
+      threshold: scenario.threshold,
+      status: 'error',
+      actualSha256: null,
+    };
+    try {
+      pageErrors.length = 0;
+      result.runtime = await prepareGoldenScenario(page, scenario);
+      if (pageErrors.length) throw new Error(`browser exception: ${pageErrors.join(' | ')}`);
+      const clip = await goldenClip(page, scenario.capture);
+      const actual = await page.screenshot({
+        ...(clip ? { clip } : {}),
+        animations: 'disabled',
+        caret: 'hide',
+        scale: 'css',
+      });
+      const actualPath = resolve(actualRoot, `${scenario.id}.png`);
+      writeFileSync(actualPath, actual);
+      result.actualSha256 = sha256(actual);
+      result.actual = actualPath;
+      const baselinePath = resolve(baselineRoot, `${scenario.id}.png`);
+      result.baseline = baselinePath;
+      if (!existsSync(baselinePath)) {
+        result.status = 'missing-baseline';
+      } else {
+        const baseline = readFileSync(baselinePath);
+        const expectedBaselineSha256 = baselineManifest?.scenarios?.[scenario.id];
+        result.baselineSha256 = sha256(baseline);
+        if (!expectedBaselineSha256 || result.baselineSha256 !== expectedBaselineSha256) {
+          result.status = 'invalid-baseline';
+          result.error = expectedBaselineSha256
+            ? 'baseline PNG does not match its reviewed manifest hash'
+            : 'baseline PNG is not listed in the reviewed manifest';
+          results.push(result);
+          console.log(`${result.status.padEnd(17)} ${scenario.id}`);
+          continue;
+        }
+        const comparison = await comparePng(page, actual, baseline, scenario.threshold);
+        Object.assign(result, comparison);
+        result.status = comparison.passed ? 'passed' : 'different';
+        if (comparison.diffPngBase64) {
+          const diffPath = resolve(diffRoot, `${scenario.id}.png`);
+          writeFileSync(diffPath, Buffer.from(comparison.diffPngBase64, 'base64'));
+          result.diff = diffPath;
+        }
+        delete result.diffPngBase64;
+      }
+    } catch (error) {
+      result.error = error instanceof Error ? error.message : String(error);
+    }
+    results.push(result);
+    console.log(`${result.status.padEnd(17)} ${scenario.id}`);
+  }
+} finally {
+  await browser.close();
+}
+
+const manifestValid = !!baselineManifest
+  && !baselineManifest.invalid
+  && baselineManifest.matrixVersion === GOLDEN_MATRIX_VERSION
+  && baselineManifest.chromium === chromium
+  && GOLDEN_SCENARIOS.every((scenario) => typeof baselineManifest.scenarios?.[scenario.id] === 'string');
+const report = {
+  schema: 1,
+  mode,
+  generatedAt: new Date().toISOString(),
+  matrixVersion: GOLDEN_MATRIX_VERSION,
+  buildFingerprint,
+  chromium,
+  baselineManifest: baselineManifest ? {
+    present: true,
+    valid: manifestValid,
+    matrixVersion: baselineManifest.matrixVersion ?? null,
+    chromium: baselineManifest.chromium ?? null,
+  } : { present: false, valid: false, matrixVersion: null, chromium: null },
+  results,
+};
+writeFileSync(resolve(artifactRoot, 'golden-report.json'), `${JSON.stringify(report, null, 2)}\n`, 'utf8');
+
+if (goldenRunFailed(mode, manifestValid, results)) process.exitCode = 1;

demo/performance/README.md

@@ -0,0 +1,81 @@
+# Large-house performance gate
+
+`benchmark_large_house.mjs` exercises the deterministic `large-house-v1`
+fixture. The fixture has 60 rooms, 200 devices, 100 openings, 60 partitions,
+40 columns and 500 decor objects on three floors.
+
+The runner records seven measured samples after one discarded warm-up. With
+this intentionally small CI sample, the nearest-rank `p95` is the observed
+maximum; reports keep the conventional field name but should be read as a
+high-tail guard rather than a population estimate:
+
+- model readiness and first stable render;
+- space switch, HA state update, pan/zoom and opening the settings dialog;
+- a shared-wall room-resize preview which is cancelled before persistence;
+- a twelve-switch navigation cycle;
+- Long Tasks for every measured window;
+- heap growth after four additional navigation rounds with forced GC;
+- hot-cache size and growth after the same warmed cycles.
+
+Every report is tied to the source fingerprint embedded by Rollup. A stale
+bundle is a hard failure.
+
+## CI contract
+
+The `performance` job checks out the candidate and its base SHA, builds both,
+and runs them sequentially with the same Node.js 22 process family, pinned
+Playwright Chromium and hosted runner. `compare.mjs` then applies two limits:
+
+1. a relative regression allowance against the base-SHA report;
+2. an absolute safety ceiling from `budgets.json`.
+
+The tighter limit wins. The absolute values are catastrophic safety ceilings,
+not normal-performance targets; the base-relative comparison catches smaller
+regressions. Small fast operations receive an absolute noise
+allowance so normal scheduler jitter does not become a false regression. Heap,
+Long Tasks, warmed-cache growth and the expected rendered-device count are
+gated separately. Long-Task maximum/count/total checks use the same
+relative-plus-absolute policy as timings. Both raw reports and the comparison are always uploaded as
+the `large-house-performance` artifact, and the table is written to the GitHub
+job summary.
+
+This base-vs-candidate design intentionally does not compare timings captured
+on different machines or different Chromium builds. A runtime/profile mismatch
+fails closed.
+
+## Local diagnostics
+
+Build and copy a fresh demo bundle first, then run:
+
+```bash
+npm run benchmark:large-house -- --samples=7 --warmups=1 --output=artifacts/performance/local.json
+```
+
+A local report is diagnostic only; it cannot replace the CI comparison.
+
+To reproduce the comparison against another checkout using one harness and one
+browser installation:
+
+```bash
+npm run benchmark:large-house -- --target-root=../base --samples=7 --output=artifacts/performance/baseline.json
+npm run benchmark:large-house -- --target-root=. --samples=7 --output=artifacts/performance/candidate.json
+npm run benchmark:compare
+```
+
+## Changing budgets
+
+Budget changes require an explicit review of recent CI artifacts and a written
+rationale in the change. Do not loosen a threshold merely to make a single red
+run pass. A new fixture profile gets a new profile id instead of silently
+changing the meaning of `large-house-v1`.
+
+The `cleanFloor` entry ceiling is 160: the reviewed fixture currently warms
+120 deterministic room/physical-body entries, and the extra 40 slots allow a
+legitimate fixture extension without weakening the separate zero-growth gate.
+
+The absolute switch-cycle/Long-Task ceilings include roughly 20–30% headroom
+over the paired 2026-08-09 Ubuntu run where the unchanged base and candidate
+both reached about 5.3 s / 2.45 s / 22 tasks / 9.9 s total under runner load.
+The same-runner relative checks remain tighter for an actual candidate-only
+regression; this prevents an overloaded but symmetric runner from turning an
+absolute safety ceiling into a flaky code-regression signal.

demo/performance/budgets.json

@@ -0,0 +1,87 @@
+{
+  "schema": 1,
+  "profile": "large-house-v1",
+  "minimumSamples": 7,
+  "timings": {
+    "modelReadyMs": {
+      "stat": "median",
+      "maxRegressionRatio": 0.3,
+      "noiseAllowanceMs": 200,
+      "hardMaxMs": 2500
+    },
+    "firstStableRenderMs": {
+      "stat": "median",
+      "maxRegressionRatio": 0.3,
+      "noiseAllowanceMs": 250,
+      "hardMaxMs": 3000
+    },
+    "spaceSwitchMs": {
+      "stat": "median",
+      "maxRegressionRatio": 0.5,
+      "noiseAllowanceMs": 75,
+      "hardMaxMs": 1500
+    },
+    "stateUpdateMs": {
+      "stat": "median",
+      "maxRegressionRatio": 0.5,
+      "noiseAllowanceMs": 75,
+      "hardMaxMs": 1000
+    },
+    "resizePreviewMs": {
+      "stat": "median",
+      "maxRegressionRatio": 0.4,
+      "noiseAllowanceMs": 150,
+      "hardMaxMs": 2000
+    },
+    "panZoomMs": {
+      "stat": "median",
+      "maxRegressionRatio": 0.5,
+      "noiseAllowanceMs": 60,
+      "hardMaxMs": 500
+    },
+    "settingsDialogMs": {
+      "stat": "median",
+      "maxRegressionRatio": 0.5,
+      "noiseAllowanceMs": 100,
+      "hardMaxMs": 1000
+    },
+    "switchCycleMs": {
+      "stat": "median",
+      "maxRegressionRatio": 0.35,
+      "noiseAllowanceMs": 250,
+      "hardMaxMs": 7000
+    }
+  },
+  "longTasks": {
+    "maxSingleMs": 3000,
+    "maxSingleRegressionRatio": 0.3,
+    "maxSingleNoiseAllowanceMs": 250,
+    "maxCountP95": 30,
+    "maxCountRegressionRatio": 0.35,
+    "countNoiseAllowance": 3,
+    "maxTotalP95Ms": 12000,
+    "maxTotalRegressionRatio": 0.3,
+    "noiseAllowanceMs": 150
+  },
+  "heap": {
+    "required": true,
+    "hardMaxGrowthBytes": 67108864,
+    "maxRegressionRatio": 0.75,
+    "noiseAllowanceBytes": 16777216
+  },
+  "cacheEntries": {
+    "cleanFloor": 160,
+    "glowClip": 200,
+    "wallUnion": 1,
+    "openingTunnel": 1,
+    "openingWallIndex": 1
+  },
+  "cacheGrowth": {
+    "cleanFloor": 0,
+    "glowClip": 0,
+    "wallUnion": 0,
+    "openingTunnel": 0,
+    "openingWallIndex": 0
+  },
+  "renderedDevices": 200
+}

demo/performance/compare.mjs

@@ -0,0 +1,27 @@
+#!/usr/bin/env node
+import { appendFileSync, mkdirSync, readFileSync, writeFileSync } from 'node:fs';
+import { dirname, resolve } from 'node:path';
+import { evaluatePerformanceBudget, performanceSummaryMarkdown } from './evaluate.mjs';
+
+const valueArg = (name) => process.argv.find((arg) => arg.startsWith(`--${name}=`))?.slice(name.length + 3);
+const candidatePath = resolve(valueArg('candidate') ?? 'artifacts/performance/candidate.json');
+const baselinePath = resolve(valueArg('baseline') ?? 'artifacts/performance/baseline.json');
+const budgetsPath = resolve(valueArg('budgets') ?? 'demo/performance/budgets.json');
+const outputPath = resolve(valueArg('output') ?? 'artifacts/performance/comparison.json');
+
+const readJson = (path) => JSON.parse(readFileSync(path, 'utf8'));
+const evaluation = evaluatePerformanceBudget({
+  candidate: readJson(candidatePath),
+  baseline: readJson(baselinePath),
+  budgets: readJson(budgetsPath),
+});
+
+mkdirSync(dirname(outputPath), { recursive: true });
+writeFileSync(outputPath, `${JSON.stringify(evaluation, null, 2)}\n`, 'utf8');
+const markdown = performanceSummaryMarkdown(evaluation);
+process.stdout.write(markdown);
+if (process.env.GITHUB_STEP_SUMMARY) appendFileSync(process.env.GITHUB_STEP_SUMMARY, markdown, 'utf8');
+if (!evaluation.pass) {
+  console.error(`Performance budget failed: ${evaluation.failures.map((item) => item.id).join(', ')}`);
+  process.exitCode = 1;
+}

demo/performance/evaluate.mjs

@@ -0,0 +1,200 @@
+const percentile = (values, p) => {
+  if (!values.length) return null;
+  const sorted = [...values].sort((a, b) => a - b);
+  return sorted[Math.min(sorted.length - 1, Math.max(0, Math.ceil(sorted.length * p) - 1))];
+};
+
+const finite = (value) => typeof value === 'number' && Number.isFinite(value);
+const round = (value, digits = 2) => finite(value) ? Number(value.toFixed(digits)) : value;
+
+export const summarizeTimings = (rows, metricNames) => Object.fromEntries(
+  metricNames.map((metric) => {
+    const values = rows.map((row) => row[metric]).filter(finite);
+    return [metric, {
+      median: percentile(values, 0.5),
+      p95: percentile(values, 0.95),
+      min: values.length ? Math.min(...values) : null,
+      max: values.length ? Math.max(...values) : null,
+    }];
+  }),
+);
+
+export const summarizeLongTasks = (rows) => {
+  const totals = [];
+  const counts = [];
+  const singles = [];
+  for (const row of rows) {
+    const windows = Object.values(row.longTasks ?? {});
+    totals.push(windows.reduce((sum, item) => sum + (item?.totalMs ?? 0), 0));
+    counts.push(windows.reduce((sum, item) => sum + (item?.count ?? 0), 0));
+    singles.push(...windows.map((item) => item?.maxMs ?? 0));
+  }
+  return {
+    maxSingleMs: round(singles.length ? Math.max(...singles) : 0),
+    countP95: percentile(counts, 0.95) ?? 0,
+    totalP95Ms: round(percentile(totals, 0.95) ?? 0),
+  };
+};
+
+const sameJson = (a, b) => JSON.stringify(a) === JSON.stringify(b);
+
+const requireReport = (report, budgets, label) => {
+  if (!report || report.schema !== 2) throw new Error(`${label}: unsupported report schema`);
+  if (report.profile !== budgets.profile) throw new Error(`${label}: unexpected benchmark profile`);
+  if (!Array.isArray(report.rows) || report.rows.length < budgets.minimumSamples) {
+    throw new Error(`${label}: expected at least ${budgets.minimumSamples} measured samples`);
+  }
+};
+
+const relativeLimit = (baseline, ratio, allowance) => Math.max(
+  baseline * (1 + ratio),
+  baseline + allowance,
+);
+
+const makeCheck = (id, actual, limit, details = {}) => ({
+  id,
+  actual: round(actual),
+  limit: round(limit),
+  pass: finite(actual) && actual <= limit,
+  ...details,
+});
+
+/**
+ * Evaluate a candidate report against both stable absolute ceilings and a
+ * report captured from the base SHA on the same runner.
+ */
+export const evaluatePerformanceBudget = ({ candidate, baseline, budgets }) => {
+  requireReport(candidate, budgets, 'candidate');
+  requireReport(baseline, budgets, 'baseline');
+  if (!sameJson(candidate.fixture, baseline.fixture)) throw new Error('fixture mismatch');
+  for (const key of ['node', 'chromium', 'platform', 'arch']) {
+    if (candidate.runtime?.[key] !== baseline.runtime?.[key]) {
+      throw new Error(`runtime mismatch for ${key}`);
+    }
+  }
+
+  const checks = [];
+  for (const [metric, budget] of Object.entries(budgets.timings)) {
+    const stat = budget.stat ?? 'median';
+    const actual = candidate.summary?.[metric]?.[stat];
+    const base = baseline.summary?.[metric]?.[stat];
+    if (!finite(actual) || !finite(base)) throw new Error(`missing ${stat} for ${metric}`);
+    const regressionLimit = relativeLimit(base, budget.maxRegressionRatio, budget.noiseAllowanceMs);
+    checks.push(makeCheck(
+      `timing.${metric}.${stat}`,
+      actual,
+      Math.min(budget.hardMaxMs, regressionLimit),
+      { baseline: round(base), hardLimit: budget.hardMaxMs, regressionLimit: round(regressionLimit) },
+    ));
+  }
+
+  const candidateLong = candidate.longTasks ?? summarizeLongTasks(candidate.rows);
+  const baselineLong = baseline.longTasks ?? summarizeLongTasks(baseline.rows);
+  const longTasksAvailable = candidate.rows.every((row) => {
+    const windows = Object.values(row.longTasks ?? {});
+    return windows.length > 0 && windows.every((item) => item?.supported === true);
+  });
+  checks.push({ id: 'longTask.available', actual: longTasksAvailable ? 1 : 0, limit: 1, pass: longTasksAvailable });
+  const singleRegressionLimit = relativeLimit(
+    baselineLong.maxSingleMs,
+    budgets.longTasks.maxSingleRegressionRatio,
+    budgets.longTasks.maxSingleNoiseAllowanceMs,
+  );
+  checks.push(makeCheck(
+    'longTask.maxSingleMs',
+    candidateLong.maxSingleMs,
+    Math.min(budgets.longTasks.maxSingleMs, singleRegressionLimit),
+    { baseline: baselineLong.maxSingleMs, hardLimit: budgets.longTasks.maxSingleMs },
+  ));
+  const countRegressionLimit = relativeLimit(
+    baselineLong.countP95,
+    budgets.longTasks.maxCountRegressionRatio,
+    budgets.longTasks.countNoiseAllowance,
+  );
+  checks.push(makeCheck(
+    'longTask.countP95',
+    candidateLong.countP95,
+    Math.min(budgets.longTasks.maxCountP95, countRegressionLimit),
+    { baseline: baselineLong.countP95, hardLimit: budgets.longTasks.maxCountP95 },
+  ));
+  const longRegressionLimit = relativeLimit(
+    baselineLong.totalP95Ms,
+    budgets.longTasks.maxTotalRegressionRatio,
+    budgets.longTasks.noiseAllowanceMs,
+  );
+  checks.push(makeCheck(
+    'longTask.totalP95Ms',
+    candidateLong.totalP95Ms,
+    Math.min(budgets.longTasks.maxTotalP95Ms, longRegressionLimit),
+    { baseline: baselineLong.totalP95Ms, hardLimit: budgets.longTasks.maxTotalP95Ms },
+  ));
+
+  const candidateHeap = candidate.rows
+    .map((row) => row.heapGrowthBytes)
+    .filter(finite)
+    .map((value) => Math.max(0, value));
+  const baselineHeap = baseline.rows
+    .map((row) => row.heapGrowthBytes)
+    .filter(finite)
+    .map((value) => Math.max(0, value));
+  const preciseGc = candidate.rows.every((row) => row.preciseGc === true);
+  checks.push({
+    id: 'heap.preciseGc', actual: preciseGc ? 1 : 0, limit: budgets.heap.required ? 1 : 0,
+    pass: !budgets.heap.required || preciseGc,
+  });
+  if (budgets.heap.required && (!candidateHeap.length || !baselineHeap.length)) {
+    checks.push({ id: 'heap.available', actual: candidateHeap.length, limit: 1, pass: false });
+  } else if (candidateHeap.length && baselineHeap.length) {
+    const actual = percentile(candidateHeap, 0.95);
+    const base = percentile(baselineHeap, 0.95);
+    const regressionLimit = relativeLimit(base, budgets.heap.maxRegressionRatio, budgets.heap.noiseAllowanceBytes);
+    checks.push(makeCheck(
+      'heap.growthP95Bytes',
+      actual,
+      Math.min(budgets.heap.hardMaxGrowthBytes, regressionLimit),
+      { baseline: base, hardLimit: budgets.heap.hardMaxGrowthBytes },
+    ));
+  }
+
+  for (const [cache, limit] of Object.entries(budgets.cacheEntries)) {
+    const actual = Math.max(...candidate.rows.map((row) => row.cacheEntries?.[cache] ?? Number.POSITIVE_INFINITY));
+    checks.push(makeCheck(`cache.entries.${cache}`, actual, limit));
+  }
+  for (const [cache, limit] of Object.entries(budgets.cacheGrowth)) {
+    const actual = Math.max(...candidate.rows.map((row) => row.cacheGrowth?.[cache] ?? Number.POSITIVE_INFINITY));
+    checks.push(makeCheck(`cache.growth.${cache}`, actual, limit));
+  }
+
+  const renderedDevices = Math.min(...candidate.rows.map((row) => row.renderedDevices ?? -1));
+  checks.push({
+    id: 'renderedDevices',
+    actual: renderedDevices,
+    limit: budgets.renderedDevices,
+    pass: renderedDevices === budgets.renderedDevices,
+  });
+
+  const failures = checks.filter((check) => !check.pass);
+  return {
+    schema: 1,
+    profile: budgets.profile,
+    pass: failures.length === 0,
+    candidateFingerprint: candidate.buildFingerprint,
+    baselineFingerprint: baseline.buildFingerprint,
+    checks,
+    failures,
+  };
+};
+
+export const performanceSummaryMarkdown = (evaluation) => {
+  const icon = evaluation.pass ? '✅' : '❌';
+  const lines = [
+    `### ${icon} House Plan large-house performance`,
+    '',
+    '| Check | Candidate | Limit | Base |',
+    '|---|---:|---:|---:|',
+  ];
+  for (const check of evaluation.checks) {
+    lines.push(`| ${check.pass ? '✅' : '❌'} ${check.id} | ${check.actual} | ${check.limit} | ${check.baseline ?? '—'} |`);
+  }
+  return `${lines.join('\n')}\n`;
+};

demo/serve.mjs

@@ -40,16 +40,24 @@ export async function finish(browser, out) {
   }
 }
 
-export async function launch(viewport = { width: 820, height: 760 }, scale = 1) {
-  const browser = await chromium.launch({ args: ['--no-sandbox'] });
-  const page = await (await browser.newContext({ viewport, deviceScaleFactor: scale })).newPage();
+export async function launch(
+  viewport = { width: 820, height: 760 },
+  scale = 1,
+  browserArgs = [],
+  contextOptions = {},
+  serveRoot = ROOT,
+) {
+  const browser = await chromium.launch({ args: ['--no-sandbox', ...browserArgs] });
+  const page = await (await browser.newContext({
+    viewport, deviceScaleFactor: scale, ...contextOptions,
+  })).newPage();
   // audit T1: an exception inside the card used to be logged and ignored
   page.on('pageerror', (e) => { _pageErrors++; console.log('EXC', e.message); });
   await page.route('**/*', (r) => {
     const u = new URL(r.request().url());
     let p = decodeURIComponent(u.pathname);
     if (p === '/') p = '/demo.html';
-    const f = ROOT + p;
+    const f = serveRoot + p;
     existsSync(f)
       ? r.fulfill({ status: 200, headers: { 'content-type': CT[p.slice(p.lastIndexOf('.'))] || 'application/octet-stream' }, body: readFileSync(f) })
       : r.fulfill({ status: 404, body: 'nf' });

demo/shot_cover_move.mjs

@@ -1,11 +1,14 @@
-// Capture: a curtain on the move — the breathing ring (.covermove) around a
+// Capture: a curtain on the move — the semantic transition ring around a
 // NEUTRAL plate (owner 2026-08-03). The pulse is frozen at a visible frame so
 // the shot is deterministic.
 import { launch } from './serve.mjs';
 const { page, browser } = await launch({ width: 820, height: 760 }, 2);
 await page.evaluate(async () => {
   const c = window.__card;
-  c._serverCfg = { ...c._serverCfg, markers: [{ id: 'm_mower', binding: 'device:d_mower', hidden: true }] };
+  c._serverCfg = { ...c._serverCfg, markers: [
+    { id: 'm_gate', binding: 'device:d_gate', tap_action: 'cover', display: 'icon_ripple' },
+    { id: 'm_mower', binding: 'device:d_mower', hidden: true },
+  ] };
   c._cfgEpoch++; c._regSignature = ''; c._maybeRebuildDevices();
   c.hass = { ...c.hass, states: { ...c.hass.states,
     'cover.gate': { entity_id: 'cover.gate', state: 'opening',
@@ -14,13 +17,13 @@ await page.evaluate(async () => {
   c.requestUpdate();
   await c.updateComplete;
   const st = document.createElement('style');
-  st.textContent = '.dev.covermove::after{animation-delay:-1.1s;animation-play-state:paused;}';
+  st.textContent = '.activity-ring.transition i:first-child{animation-delay:-1.1s!important;animation-play-state:paused!important;}';
   (c.shadowRoot || c.renderRoot).appendChild(st);
 });
 await page.waitForTimeout(400);
 const box = await page.evaluate(() => {
   const c = window.__card;
-  const r = (c.shadowRoot || c.renderRoot).querySelector('.dev.covermove').getBoundingClientRect();
+  const r = (c.shadowRoot || c.renderRoot).querySelector('.dev.activity-transition').getBoundingClientRect();
   return { x: r.x, y: r.y, w: r.width, h: r.height };
 });
 const pad = 70;

demo/shot_cover_states.mjs

@@ -1,7 +1,7 @@
 // Capture: one curtain in the four states an owner sees — closed, open,
 // opening, closing (owner's contract 2026-08-04). The plate is the plain
 // neutral badge in ALL of them; open/closed is told by the icon morph alone,
-// and the two travelling ones add the breathing .covermove ring (frozen at a
+// and the two travelling ones add the breathing transition ring (frozen at a
 // visible frame so the shot is deterministic).
 import { launch } from './serve.mjs';
 const { page, browser } = await launch({ width: 900, height: 520 }, 2);
@@ -22,7 +22,8 @@ await page.evaluate(async (STATES) => {
     entities: { ...c.hass.entities, ...entities },
     states: { ...c.hass.states, ...states } };
   c._serverCfg = { ...c._serverCfg, markers: [
-    ...STATES.map((s, i) => ({ id: 'm_cur' + i, binding: 'device:d_cur' + i, tap_action: 'cover' })),
+    ...STATES.map((s, i) => ({ id: 'm_cur' + i, binding: 'device:d_cur' + i,
+      tap_action: 'cover', display: 'icon_ripple' })),
     { id: 'm_mower', binding: 'device:d_mower', hidden: true },
     { id: 'm_gate', binding: 'device:d_gate', hidden: true },
   ] };
@@ -37,7 +38,7 @@ await page.evaluate(async (STATES) => {
   c.requestUpdate();
   await c.updateComplete;
   const st = document.createElement('style');
-  st.textContent = '.dev.covermove::after{animation-delay:-1.1s;animation-play-state:paused;}';
+  st.textContent = '.activity-ring.transition i:first-child{animation-delay:-1.1s!important;animation-play-state:paused!important;}';
   (c.shadowRoot || c.renderRoot).appendChild(st);
 }, STATES);
 await page.waitForTimeout(500);

demo/shot_furniture.mjs

@@ -0,0 +1,63 @@
+// Скриншоты библиотеки мебели: палитра и расставленная мебель на плане.
+import { launch } from './serve.mjs';
+const OUT = process.env.HP_SHOT_DIR || '/tmp';
+const { page, browser } = await launch({ width: 900, height: 900 }, 2);
+
+await page.evaluate(async () => {
+  const c = window.__card;
+  const sr = c.shadowRoot || c.renderRoot;
+  sr.querySelectorAll('.modetab')[2].click();
+  await c.updateComplete;
+  c._curSpaceCfg.decor = [];
+  c._decorTool = 'furniture';
+  c._cfgEpoch++; c.requestUpdate();
+  await c.updateComplete;
+  sr.querySelector('.furnitem[data-symbol="sofa"]').click();
+  await c.updateComplete;
+});
+await page.waitForTimeout(400);
+await page.screenshot({ path: `${OUT}/furniture_palette.png` });
+
+await page.evaluate(async () => {
+  const c = window.__card;
+  const P = 1000 / 240;
+  const cm = (v) => (v / 5) * P / 1000;                 // cm -> normalised
+  const put = (id, symbol, w, h, cx, cy, angle) => ({
+    id, kind: 'furniture', symbol,
+    x: cx / 1000 - cm(w) / 2, y: cy / 1000 - cm(h) / 2,
+    w: cm(w), h: cm(h), color: '#8d6e63', width: 3,
+    ...(angle ? { angle } : {}),
+  });
+  // r1 living 40..550 x 140..580 | r2 kitchen 550..960 x 140..460
+  // r3 bedroom 550..960 x 460..860 | r4 hall 40..550 x 580..860
+  c._curSpaceCfg.decor = [
+    put('f1', 'sofa', 220, 90, 250, 140 + 37.5),
+    put('f2', 'coffee_table', 110, 60, 250, 300),
+    put('f3', 'tv', 120, 30, 250, 570),
+    put('f4', 'armchair', 90, 85, 90, 340, 90),
+    put('f5', 'table_dining', 140, 80, 700, 300),
+    put('f6', 'chair', 45, 45, 700, 240),
+    put('f7', 'chair', 45, 45, 700, 360, 180),
+    put('f8', 'fridge', 60, 65, 590, 140 + 27, 0),
+    put('f9', 'stove', 60, 60, 670, 140 + 25),
+    put('f10', 'kitchen_sink', 80, 60, 760, 140 + 25),
+    put('f11', 'dishwasher', 60, 60, 840, 140 + 25),
+    put('f12', 'bed_double', 160, 200, 700, 460 + 42),
+    put('f13', 'nightstand', 45, 40, 620, 470),
+    put('f14', 'nightstand', 45, 40, 780, 470),
+    put('f15', 'wardrobe', 100, 60, 910, 700, 90),
+    put('f16', 'washer', 60, 60, 120, 860 - 25, 180),
+    put('f17', 'toilet', 40, 70, 220, 860 - 29, 180),
+    put('f18', 'bathtub', 170, 75, 400, 860 - 31, 180),
+    put('f19', 'plant', 40, 40, 500, 620),
+    put('f20', 'shower', 90, 90, 490, 700),
+  ];
+  c._decorTool = 'select';
+  c._decorSel = 'f1';
+  c._cfgEpoch++; c.requestUpdate();
+  await c.updateComplete;
+});
+await page.waitForTimeout(500);
+await page.screenshot({ path: `${OUT}/furniture_plan.png` });
+await browser.close();
+console.log('shots written to', OUT);

demo/shot_motion_sense.mjs

@@ -2,6 +2,9 @@ import { launch } from './serve.mjs';
 const { page, browser } = await launch({ width: 820, height: 760 }, 2);
 await page.evaluate(async () => {
   const c = window.__card;
+  c._serverCfg.markers = (c._serverCfg.markers || []).filter((m) => m.binding !== 'device:d_motion');
+  c._serverCfg.markers.push({ id: 'd_motion', binding: 'device:d_motion', display: 'icon_ripple' });
+  c._cfgEpoch++; c._regSignature = ''; c._maybeRebuildDevices();
   // the flash is keyed to a WITNESSED off→on transition (owner's rule
   // 2026-08-01: разовая вспышка в момент обнаружения) — cycle through off
   const set = async (state) => {
@@ -14,13 +17,13 @@ await page.evaluate(async () => {
   await set('on');
   // freeze the pulse at a visible frame for a deterministic capture
   const st = document.createElement('style');
-  st.textContent = '.dev.senseflash::after{animation-delay:-0.4s;animation-play-state:paused;}';
+  st.textContent = '.activity-ring.event i{animation-delay:-0.4s!important;animation-play-state:paused!important;}';
   (c.shadowRoot || c.renderRoot).appendChild(st);
 });
 await page.waitForTimeout(300);
 const box = await page.evaluate(() => {
   const c = window.__card;
-  const el = (c.shadowRoot || c.renderRoot).querySelector('.dev.senseflash');
+  const el = (c.shadowRoot || c.renderRoot).querySelector('.dev.activity-event');
   const r = el.getBoundingClientRect();
   return { x: r.x, y: r.y, w: r.width, h: r.height };
 });

demo/shot_sun.mjs

@@ -46,7 +46,8 @@ await page.evaluate(async () => {
   c.shadowRoot.querySelector('.compass').scrollIntoView({ block: 'center' });
 });
 await page.waitForTimeout(200);
-const dlg = await page.evaluateHandle(() => window.__card.shadowRoot.querySelector('.dialog'));
+const dlg = await page.evaluateHandle(() => window.__card.shadowRoot
+  .querySelector('hp-dialog').shadowRoot.querySelector('.surface'));
 await dlg.asElement().screenshot({ path: outDir + '/sun_compass.png' });
 await browser.close();
 console.log('shots written to ' + outDir);

demo/shot_sun_rim.mjs

@@ -0,0 +1,64 @@
+// Stills for the rim (docs/SUN.md, «The rim»). Two scenes — white paper and
+// the dark glow canvas — and, in each, the SAME frame at several rim peaks so
+// the value can be picked by looking rather than by arguing. The alphas other
+// than the shipped one are applied by rewriting the `hp-sunrim-*` stops in the
+// DOM, which is why a rebuild is not needed to compare them.
+//   node demo/shot_sun_rim.mjs <outdir> [alphas, default 0,0.3,0.42,0.5]
+// `0` is the "before" frame: the wedge alone, with no rim at all.
+import { launch } from './serve.mjs';
+const outDir = process.argv[2] || '/tmp';
+const ALPHAS = (process.argv[3] || '0,0.3,0.42,0.5').split(',').map(Number);
+const { page, browser } = await launch({ width: 900, height: 900 }, 2);
+await page.emulateMedia({ reducedMotion: 'reduce' }); // still shots, no fades
+
+const setup = async (scene) => {
+  await page.evaluate(async (sc) => {
+    const c = window.__card;
+    const cfg = c._serverCfg;
+    const sp = cfg.spaces.find((s) => s.id === 'f1');
+    sp.openings = [
+      { id: 'wN', type: 'window', x: 0.30, y: 0.14, angle: 0, length: 0.08 },
+      { id: 'wW', type: 'window', x: 0.04, y: 0.30, angle: 90, length: 0.08 },
+      { id: 'wW2', type: 'window', x: 0.04, y: 0.72, angle: 90, length: 0.08 },
+      { id: 'wE', type: 'window', x: 0.96, y: 0.60, angle: 90, length: 0.08 },
+    ];
+    sp.plan_url = null;             // plain paper, nothing to hide behind
+    sp.settings = { ...(sp.settings || {}), fill_mode: sc === 'dark' ? 'glow' : 'none' };
+    cfg.settings = { ...(cfg.settings || {}), north_deg: 0, sun_rays: true,
+      bg_mode: 'static', bg_color: sc === 'dark' ? '#101720' : '#f2f2f0' };
+    c._cfgEpoch++;
+    c.hass = { ...c.hass, states: { ...c.hass.states,
+      'light.ceiling': { ...c.hass.states['light.ceiling'], state: sc === 'dark' ? 'on' : 'off' },
+      'sun.sun': { entity_id: 'sun.sun', state: 'above_horizon',
+        attributes: { azimuth: 250, elevation: 35 } } } };
+    c.requestUpdate();
+    await c.updateComplete;
+  }, scene);
+  await page.waitForTimeout(300);
+};
+
+// Rescale every rim gradient to `peak`, always from the stops as BUILT — a
+// scale relative to the current values would collapse to zero the moment the
+// 0 frame is taken and never come back.
+const setAlpha = async (peak) => {
+  await page.evaluate((a) => {
+    for (const g of window.__card.shadowRoot.querySelectorAll('linearGradient[id^=hp-sunrim-]')) {
+      const stops = [...g.querySelectorAll('stop')];
+      if (!g.__base) g.__base = stops.map((s) => Number(s.getAttribute('stop-opacity')));
+      const p0 = g.__base[0] || 1;
+      stops.forEach((s, i) => s.setAttribute('stop-opacity', (a * (g.__base[i] / p0)).toFixed(4)));
+    }
+  }, peak);
+  await page.waitForTimeout(120);
+};
+
+for (const scene of ['light', 'dark']) {
+  await setup(scene);
+  for (const a of ALPHAS) {
+    await setAlpha(a);
+    const stage = await page.evaluateHandle(() => window.__card.shadowRoot.querySelector('.stage'));
+    await stage.asElement().screenshot({ path: `${outDir}/rim_${scene}_${String(a).replace('.', '')}.png` });
+  }
+}
+await browser.close();
+console.log('shots written to ' + outDir);

demo/smoke_backdrop.mjs

@@ -7,7 +7,7 @@
  *   • dragging the body moves the picture and writes plan_x/plan_y;
  *   • a corner handle scales UNIFORMLY about the opposite corner;
  *   • live badges state the real size in metres, through cell_cm;
- *   • position and size land on the grid, Shift steps off it;
+ *   • position and size always land on the grid, including with Shift;
  *   • the paper follows the ROOMS even here, and the picture is drawn above
  *     the paper and below the walls;
  *   • «Вписать всё» still finds a picture that has been dragged away;
@@ -25,16 +25,23 @@ const restore = () => page.evaluate((s) => {
   return c.updateComplete && true;
 }, snap);
 
-const mode = (m) => page.evaluate((m) => {
+const mode = async (m) => {
+  await page.evaluate((m) => {
   const c = window.__card;
   c._setMode(m); c.requestUpdate();
   return c.updateComplete && true;
-}, m);
+  }, m);
+  await page.waitForTimeout(220); // editor chrome transition owns stage geometry
+};
 const settle = () => page.evaluate(() => new Promise((r) => requestAnimationFrame(() => requestAnimationFrame(r))));
 const q = (sel) => page.evaluate((s) => window.__card.renderRoot.querySelectorAll(s).length, sel);
 const spaceCfg = () => page.evaluate(() => {
   const sp = window.__card._serverCfg.spaces.find((s) => s.id === 'f1');
-  return { x: sp.plan_x ?? null, y: sp.plan_y ?? null, k: sp.plan_scale ?? null };
+  return {
+    x: sp.plan_x ?? null, y: sp.plan_y ?? null,
+    sx: sp.plan_scale_x ?? null, sy: sp.plan_scale_y ?? null,
+    legacy: sp.plan_scale ?? null, angle: sp.plan_angle ?? null,
+  };
 });
 /** The image rect AS RENDERED (attributes of the <image> in the stage svg). */
 const imageRect = () => page.evaluate(() => {
@@ -84,20 +91,24 @@ const tool = (t) => page.evaluate((t) => {
 
 await mode('decor');
 await settle();
-// the frame is on screen the moment the backdrop editor opens…
-check('frame_in_backdrop_editor', await q('.bdframe'), 1);
-check('four_finger_handles', await q('.bdframe .bdhandle'), 4);
-check('frame_hugs_the_picture', await frameRect(), BASE);
+// Every Background session starts predictably on Select. The image frame is
+// exclusive to its own tool and therefore cannot steal a Select/pan gesture.
+check('no_frame_until_picture_tool', await q('.bdframe'), 0);
+check('no_handles_until_picture_tool', await q('.bdframe .bdhandle'), 0);
+check('no_picture_frame_until_picture_tool', await frameRect(), null);
 check('untouched_picture_is_where_it_always_was', await imageRect(), BASE);
 // …and the picture has a tool of its own, offered because f1 HAS a picture
-check('the_picture_has_a_tool', await q('.decorbar .btn.dtool'), 7);
-check('no_grab_cursor_until_that_tool', await page.evaluate(() =>
+check('the_picture_has_a_tool', await q('.decorbar .btn.dtool'), 8);
+check('select_tool_armed_on_open', await page.evaluate(() => window.__card._decorTool), 'select');
+check('no_grab_cursor_under_select', await page.evaluate(() =>
   window.__card.renderRoot.querySelector('.stage').classList.contains('bdgrab')), false);
 await tool('backdrop');
 await settle();
-check('grab_cursor', await page.evaluate(() =>
-  window.__card.renderRoot.querySelector('.stage').classList.contains('bdgrab')), true);
 check('frame_still_there_under_its_own_tool', await q('.bdframe'), 1);
+check('four_corners_plus_rotate_under_picture_tool', await q('.bdframe .bdhandle'), 5);
+check('frame_hugs_the_picture_under_picture_tool', await frameRect(), BASE);
+check('grab_cursor_under_picture_tool', await page.evaluate(() =>
+  window.__card.renderRoot.querySelector('.stage').classList.contains('bdgrab')), true);
 // a drawing tool owns the drag instead — no frame competing with it
 await tool('rect');
 await settle();
@@ -137,7 +148,8 @@ check('badge_gone_after_release', (await badges()).length, 0);
   // corner lands on a lattice node within one step of where the finger let go
   check('plan_x_saved', near(cfg.x, im.x / 1000, 1e-6), true);
   check('plan_y_saved', near(cfg.y, (im.y - BASE.y) / 1000, 1e-6), true);
-  check('scale_untouched_by_a_move', cfg.k, 1);
+  check('scale_untouched_by_a_move', near(cfg.sx, 1) && near(cfg.sy, 1), true);
+  check('legacy_scale_not_written', cfg.legacy, null);
   check('size_untouched_by_a_move', [im.w, im.h], [BASE.w, BASE.h]);
   check('corner_lands_on_a_grid_node', onGrid(im.x) && onGrid(im.y), true);
   // …at the node NEAREST the finger: 102 → 100 (24 steps), 152 → 150 (36).
@@ -150,7 +162,7 @@ check('badge_gone_after_release', (await badges()).length, 0);
 check('the_plan_geometry_never_moved', await page.evaluate(() =>
   JSON.stringify(window.__card._serverCfg.spaces.find((s) => s.id === 'f1').rooms)), roomsBefore);
 
-// ---------- 3) Shift steps off the grid ----------------------------------
+// ---------- 3) Shift cannot step off the grid -----------------------------
 await restore();
 await settle();
 {
@@ -165,12 +177,8 @@ await settle();
   await page.keyboard.up('Shift');
   await settle();
   const im = await imageRect();
-  // Shift is not "a different snap", it is NO snap: the corner is wherever the
-  // finger left it, to the pixel — and a pixel is a fraction of a grid step,
-  // so at least one axis is bound to sit between the nodes.
-  check('shift_lands_where_the_finger_did',
-    Math.abs(im.x - 102) <= 1 && Math.abs(im.y - 152) <= 1, true);
-  check('shift_is_off_the_lattice', onGrid(im.x) && onGrid(im.y), false);
+  check('shift_still_lands_on_the_nearest_node', [im.x, im.y], [100, 150]);
+  check('shift_stays_on_the_lattice', onGrid(im.x) && onGrid(im.y), true);
 }
 
 // ---------- 4) a corner handle scales UNIFORMLY about the opposite one ----
@@ -197,9 +205,10 @@ await settle();
   check('scaled_down', im.w < BASE.w, true);
   check('uniform_no_stretch', near(im.w / im.h, BASE.w / BASE.h, 1e-9), true);
   const cfg = await spaceCfg();
-  check('plan_scale_saved', near(cfg.k, im.w / BASE.w, 1e-5), true);
-  check('scaled_width_is_on_the_grid',
-    Math.abs((im.x + im.w) / PITCH - Math.round((im.x + im.w) / PITCH)) < 1e-6, true);
+  check('axis_scales_saved', near(cfg.sx, im.w / BASE.w, 1e-5)
+    && near(cfg.sy, im.h / BASE.h, 1e-5), true);
+  check('proportional_scale_keeps_axes_equal', near(cfg.sx, cfg.sy, 1e-6), true);
+  check('scaled_width_is_on_the_grid', onGrid(im.x + im.w), true);
   // …and the badge states the picture's REAL size through cell_cm
   check('badge_matches_the_new_size', await page.evaluate(() => {
     const c = window.__card;
@@ -213,12 +222,15 @@ await settle();
 }
 
 // ---------- 5) the reset button ------------------------------------------
-check('reset_button_offered_once_moved', await q('.decorbar .bdreset'), 1);
+check('reset_button_offered_once_moved', await q('.editor-secondary .bdreset'), 1);
+check('reset_button_absent_from_primary_bar', await q('.decorbar .bdreset'), 0);
 await page.evaluate(() => { const c = window.__card; c._bdReset?.(); c.requestUpdate(); return c.updateComplete; });
 await settle();
 check('reset_puts_the_picture_back', await imageRect(), BASE);
-check('reset_clears_the_fields', await spaceCfg(), { x: null, y: null, k: null });
-check('reset_button_gone_again', await q('.decorbar .bdreset'), 0);
+check('reset_clears_the_fields', await spaceCfg(), {
+  x: null, y: null, sx: null, sy: null, legacy: null, angle: null,
+});
+check('reset_button_gone_again', await q('.editor-secondary .bdreset'), 0);
 
 // ---------- 5b) the SELECT tool still pans right over the picture ---------
 // The body of the picture is most of the screen; claiming it outside its own
@@ -263,6 +275,45 @@ check('no_paper_the_size_of_the_picture', layers.imageSizedPaper, false);
 check('picture_is_above_the_paper', layers.iImage > layers.iPaper && layers.iPaper >= 0, true);
 check('picture_is_below_the_walls', layers.iImage < layers.iRoom, true);
 
+// ---------- 6b) editors keep a WHITE sheet under the grid with a backdrop --
+const editorWhite = await page.evaluate(async () => {
+  const c = window.__card;
+  const sr = () => c.shadowRoot || c.renderRoot;
+  const upd = async () => { c.requestUpdate(); await c.updateComplete; };
+  const navSettled = () => new Promise((resolve) => setTimeout(resolve, 220));
+  const probe = async (mode) => {
+    c._setMode(mode);
+    await upd();
+    await navSettled();
+    const stage = sr().querySelector('.stage');
+    const paper = sr().querySelector('.stage svg .hp-paper');
+    return {
+      mode,
+      stageWhite: getComputedStyle(stage).backgroundColor === 'rgb(255, 255, 255)',
+      paperWhite: !paper || getComputedStyle(paper).fill === 'rgb(255, 255, 255)',
+      hasBg: !!c._spaceModel().bg,
+      noNoplan: !stage.classList.contains('noplan'),
+    };
+  };
+  const plan = await probe('plan');
+  const devices = await probe('devices');
+  const decor = await probe('decor');
+  c._setMode('view');
+  await upd();
+  await navSettled();
+  const viewStage = sr().querySelector('.stage');
+  // View with a backdrop must NOT force white — theme/card colour stays
+  const viewForcedWhite = getComputedStyle(viewStage).backgroundColor === 'rgb(255, 255, 255)'
+    && !viewStage.classList.contains('noplan');
+  return { plan, devices, decor, viewForcedWhite, hasBg: plan.hasBg };
+});
+check('editors_have_backdrop', editorWhite.hasBg, true);
+check('plan_editor_stage_white_with_backdrop', editorWhite.plan.stageWhite && editorWhite.plan.noNoplan, true);
+check('plan_editor_paper_white_with_backdrop', editorWhite.plan.paperWhite, true);
+check('devices_editor_stage_white_with_backdrop', editorWhite.devices.stageWhite, true);
+check('decor_editor_stage_white_with_backdrop', editorWhite.decor.stageWhite, true);
+check('view_with_backdrop_is_not_forced_white', editorWhite.viewForcedWhite, false);
+
 // ---------- 7) «Вписать всё» keeps a picture that was dragged away --------
 await page.evaluate(() => {
   const c = window.__card;

demo/smoke_bg_color.mjs

@@ -13,6 +13,15 @@ const res = await page.evaluate(async () => {
     await c.updateComplete;
     return getComputedStyle(sr().querySelector('.stage')).backgroundColor;
   };
+  const waitStageBg = async (accept) => {
+    const deadline = performance.now() + 700;
+    let value = await stageBg();
+    while (!accept(value) && performance.now() < deadline) {
+      await new Promise((resolve) => setTimeout(resolve, 25));
+      value = await stageBg();
+    }
+    return value;
+  };
   const rgb = (hex) => `rgb(${parseInt(hex.slice(1, 3), 16)}, ${parseInt(hex.slice(3, 5), 16)}, ${parseInt(hex.slice(5, 7), 16)})`;
 
   const themeBg = await stageBg(); // theme default from the stylesheet
@@ -48,7 +57,7 @@ const res = await page.evaluate(async () => {
   };
   c._openSettingsDialog();
   await c.updateComplete;
-  out.dialogHasBgRow = !!sr().querySelector('.dialog .colorrow input[type=color]');
+  out.dialogHasBgRow = !!sr().querySelector('hp-dialog .colorrow input[type=color]');
   c._settingsDialog = { ...c._settingsDialog, bgColor: '#0a2a4a' };
   out.dialogPreviews = (await stageBg()) === rgb('#0a2a4a');
   await c._saveSettingsDialog();
@@ -81,10 +90,10 @@ const res = await page.evaluate(async () => {
 
   // 8) editors keep their own canvas (inline bg only in view/kiosk)
   c._setMode('decor');
-  const editorBg = await stageBg();
+  const editorBg = await waitStageBg((value) => value !== rgb('#0a2a4a'));
   out.editorUnpainted = editorBg !== rgb('#0a2a4a');
   c._setMode('view');
-  out.viewPaintedAgain = (await stageBg()) === rgb('#0a2a4a');
+  out.viewPaintedAgain = (await waitStageBg((value) => value === rgb('#0a2a4a'))) === rgb('#0a2a4a');
 
   // 9) kiosk instance respects the setting
   const k = document.createElement('houseplan-card');
@@ -181,9 +190,11 @@ const paper = await page.evaluate(async () => {
   // editors keep the paper too (their canvas ignores bg_color anyway)
   c._setMode('decor');
   await upd();
+  await new Promise((resolve) => setTimeout(resolve, 220));
   out.editorKeepsPaper = !!sr().querySelector('.stage svg .hp-paper');
   c._setMode('view');
   await upd();
+  await new Promise((resolve) => setTimeout(resolve, 220));
   // daynight night: the paper dims via the brightness filter ONLY, never alpha
   c._serverCfg.settings.bg_mode = 'daynight';
   c._serverCfg.settings.north_deg = 0;

demo/smoke_binding_ui.mjs

@@ -15,7 +15,7 @@ const res = await page.evaluate(async () => {
   radios()[1].click(); await c.updateComplete;
   out.dropShown = !!sr().querySelector('.dropbtn');
   out.panelOpen = !!sr().querySelector('.droppanel');
-  const saveBtn = [...sr().querySelectorAll('.dialog .btn.on')].pop();
+  const saveBtn = [...sr().querySelectorAll('hp-dialog .btn.on')].pop();
   out.saveDisabled = saveBtn?.disabled === true;
   // без чекбокса в списке нет individual-сущностей устройств
   const subs = () => [...sr().querySelectorAll('.cand .cs')].map((e) => e.textContent);
@@ -32,7 +32,7 @@ const res = await page.evaluate(async () => {
   sr().querySelector('.cand').click(); await c.updateComplete;
   out.picked = c._markerDialog.binding !== '' && c._markerDialog.binding !== 'virtual';
   out.panelClosed = !sr().querySelector('.droppanel');
-  out.saveEnabled = [...sr().querySelectorAll('.dialog .btn.on')].pop()?.disabled === false;
+  out.saveEnabled = [...sr().querySelectorAll('hp-dialog .btn.on')].pop()?.disabled === false;
   // радио назад на «Виртуальное» → binding=virtual
   radios()[0].click(); await c.updateComplete;
   out.backToVirtual = c._markerDialog.binding === 'virtual' && c._markerDialog.bindingMode === 'virtual';

demo/smoke_card_controls.mjs

@@ -1,5 +1,7 @@
 import { launch, checkAll, finish } from './serve.mjs';
 const { page, browser } = await launch();
+// Reproduce the narrow wall-tablet/mobile dialog from the field report.
+await page.setViewportSize({ width: 390, height: 760 });
 const res = await page.evaluate(async () => {
   const out = {};
   const c = window.__card;
@@ -12,8 +14,17 @@ const res = await page.evaluate(async () => {
   const dev = c._devices.find((d) => d.entities?.some((e) => e.startsWith('light.') || e.startsWith('switch.')));
   out.hasDev = !!dev;
   c._infoCard = dev; await c.updateComplete;
+  await new Promise((resolve) => requestAnimationFrame(resolve));
+  out.infoUsesWideShell = sr().querySelector('hp-dialog')?.hasAttribute('wide') === true;
+  const footer = sr().querySelector('.infofooter');
+  const footerBox = footer?.getBoundingClientRect();
+  const footerButtons = [...(footer?.querySelectorAll('button') || [])];
+  out.footerActionsContained = !!footerBox && footerButtons.length >= 2 && footerButtons.every((button) => {
+    const rect = button.getBoundingClientRect();
+    return rect.left >= footerBox.left - 1 && rect.right <= footerBox.right + 1;
+  });
   // 1) блок сущностей идёт ПЕРВЫМ, до модели/ссылок
-  const body = sr().querySelector('.dialog .body');
+  const body = sr().querySelector('hp-dialog .body');
   out.entListFirst = body.firstElementChild?.classList.contains('entlist')
     || body.querySelector('.entlist') === body.children[0];
   const rows = [...sr().querySelectorAll('.entrow')];

demo/smoke_card_tool_conflict.mjs

@@ -45,6 +45,19 @@ const res = await page.evaluate(async () => {
   label.dispatchEvent(new MouseEvent('click', { bubbles: true, composed: true, clientX: 10, clientY: 10 }));
   await c.updateComplete;
   out.delroomIgnored = !confirmCalled;
+  // 6) Delete has exactly one semantic result: the clicked room disappears;
+  // it never closes a virtual boundary or merges a neighbour into it.
+  const roomCount = c._curSpaceCfg.rooms.length;
+  const deleteId = room.id;
+  window.confirm = () => true;
+  c._deleteRoomClick(c._roomCenter(room));
+  await c.updateComplete;
+  out.deleteOnlyClickedRoom = c._curSpaceCfg.rooms.length === roomCount - 1
+    && !c._curSpaceCfg.rooms.some((x) => x.id === deleteId);
+  c._undoGeometry();
+  await c.updateComplete;
+  out.deleteUndoRestoresRoom = c._curSpaceCfg.rooms.length === roomCount
+    && c._curSpaceCfg.rooms.some((x) => x.id === deleteId);
   return out;
 });
 checkAll(res);

demo/smoke_climate_once.mjs

@@ -62,13 +62,14 @@ const res = await page.evaluate(async () => {
   return out;
 });
 // зафиксировано прогоном на v1.45.0 и сверено с кодом.
-// scansPerUpdate = 2: один обход у areaClimateMap, один у buildDevices. Важно
+// scansPerUpdate = 1: active-registry projection is shared by the climate map
+// and buildDevices. Важно
 // не само число, а что оно не растёт вместе с числом комнат.
 checkAll(res, {
   scansOnRerender: 0,
   roomCount: 44,
   scansSameWith44Rooms: true,
-  scansPerUpdate: 2,
+  scansPerUpdate: 1,
   tempBefore: 22.4,
   tempAfter: 33.3,
   climateIsMap: true,

demo/smoke_climate_temp.mjs

@@ -61,12 +61,12 @@ Object.assign(out, await page.evaluate(async () => {
   // у обычного термометра чекбокса нет
   const th = c._devices.find((d) => d.entities?.includes('sensor.living_temp'));
   c._openMarkerDialog(th); await c.updateComplete;
-  o.noCheckboxForThermometer = !sr().querySelector('.dialog .climrow');
+  o.noCheckboxForThermometer = !sr().querySelector('hp-dialog .climrow');
   c._markerDialog = null; await c.updateComplete;
   // у кондиционера — есть и по умолчанию снят
   const ac = c._devices.find((d) => d.entities?.includes('climate.ac'));
   c._openMarkerDialog(ac); await c.updateComplete;
-  const row = sr().querySelector('.dialog .climrow input');
+  const row = sr().querySelector('hp-dialog .climrow input');
   o.checkboxForClimate = !!row;
   o.uncheckedByDefault = !!row && !row.checked;
   if (row) row.scrollIntoView({ block: 'center' });
@@ -77,7 +77,7 @@ Object.assign(out, await page.evaluate(async () => {
 const box = await page.evaluate(() => {
   const c = window.__card;
   const sr = c.shadowRoot || c.renderRoot;
-  const r = sr.querySelector('.dialog .climrow input')?.getBoundingClientRect();
+  const r = sr.querySelector('hp-dialog .climrow input')?.getBoundingClientRect();
   return r ? { x: r.x + r.width / 2, y: r.y + r.height / 2 } : null;
 });
 check('checkboxClickable', !!box);
@@ -138,7 +138,7 @@ Object.assign(out, await page.evaluate(async () => {
   const ac = c._devices.find((d) => d.entities?.includes('climate.ac'));
   c._openMarkerDialog(ac); await c.updateComplete;
   o.survivesReopen = c._markerDialog?.useClimateTemp === true;
-  o.checkboxChecked = sr().querySelector('.dialog .climrow input')?.checked === true;
+  o.checkboxChecked = sr().querySelector('hp-dialog .climrow input')?.checked === true;
   c._markerDialog = null;
   return o;
 }));

demo/smoke_controls.mjs

@@ -19,7 +19,8 @@ const res = await page.evaluate(async () => {
   c._openMarkerDialog();
   const room = c._spaceModel().rooms.find((r) => r.id && r.area);
   c._markerDialog = { ...c._markerDialog, name: 'Выключатель', binding: 'virtual',
-    room: c._space + '#' + room.area, tapAction: 'toggle', controls: lights, icon: 'mdi:light-switch' };
+    room: c._space + '#' + room.area, tapAction: 'toggle', controls: lights,
+    icon: 'mdi:light-switch', display: 'icon_ripple' };
   await c._saveMarker(); await c.updateComplete;
   const dev = c._devices.find((d) => d.name === 'Выключатель');
   out.markerSaved = !!dev && JSON.stringify(dev.marker.controls) === JSON.stringify(lights);
@@ -36,6 +37,7 @@ const res = await page.evaluate(async () => {
   // 3) значок отражает цели: горит одна → класс on
   const el = [...sr().querySelectorAll('.dev')].find((e) => e.title === 'Выключатель' || e.textContent.includes(''));
   out.stateOn = !!c._stateClass(dev2()).includes('on');
+  out.aggregateActivityRuns = c._stateClass(dev2()).includes('activity-running');
   await setSt({ [lights[0]]: 'off' });
   out.stateOff = c._stateClass(dev2()) === '';
   // 4) без tap_action=toggle клик НЕ переключает (инфо)
@@ -55,6 +57,43 @@ const res = await page.evaluate(async () => {
   c._clickDevice(new MouseEvent('click'), dev2());
   const last = calls.at(-1);
   out.lockFiltered = JSON.stringify(last) === JSON.stringify(['homeassistant', 'turn_on', [lights[0]]]);
+
+  // Opening and saving must not rewrite configuration that runtime cannot
+  // currently execute: YAML-only domains and duplicates are still user data.
+  const losslessControls = [lights[0], 'input_boolean.yaml_only', lights[0], 'sensor.vendor_option'];
+  cfg.controls = [...losslessControls];
+  c._regSignature = ''; c._maybeRebuildDevices(); await c.updateComplete;
+  c._openMarkerDialog(dev2()); await c.updateComplete;
+  out.dialogKeepsUnknownAndDuplicateControls = JSON.stringify(c._markerDialog?.controls)
+    === JSON.stringify(losslessControls);
+  await c._saveMarker(); await c.updateComplete;
+  const savedLossless = c._serverCfg.markers.find((m) => m.name === 'Выключатель')?.controls;
+  out.saveKeepsUnknownAndDuplicateControls = JSON.stringify(savedLossless)
+    === JSON.stringify(losslessControls);
+
+  // Legacy configs could store a standalone entity as its own external
+  // control. That self-reference must neither become a light source/group nor
+  // disappear behind ambiguous dialog UI. Its normal Toggle action still
+  // operates the entity, and an ON hood/fan still has working-state yellow.
+  const own = Object.keys(c.hass.states).find((eid) => eid.startsWith('switch.'));
+  out.hasStandaloneSwitch = !!own;
+  const self = own && {
+    id: 'self-control-regression', name: 'Hood', icon: 'mdi:fan',
+    space: c._space, area: room.area, entities: [own], primary: own,
+    bindingKind: 'entity', bindingRef: own, tapAction: 'toggle',
+    marker: { id: 'self-control-regression', binding: `entity:${own}`, controls: [own] },
+  };
+  if (self) {
+    await setSt({ [own]: 'off' });
+    c._clickDevice(new MouseEvent('click'), self);
+    out.selfControlUsesDirectToggle = JSON.stringify(calls.at(-1))
+      === JSON.stringify(['homeassistant', 'toggle', own]);
+    c._openMarkerDialog(self); await c.updateComplete;
+    out.selfControlAbsentFromDialog = c._markerDialog?.controls.length === 0;
+    c._markerDialog = null;
+    await setSt({ [own]: 'on' });
+    out.selfSwitchStillShowsWorkingState = c._stateClass(self).includes('on');
+  }
   return out;
 });
 checkAll(res);

demo/smoke_cover_no_plate.mjs

@@ -8,8 +8,8 @@
 // underneath the breathing ring. Now a cover returns no plate class at all:
 //
 //   closed / open / ajar   -> neutral plate, the ICON tells the state
-//   opening / closing      -> neutral plate + the .covermove ring (kept, the
-//                             owner approved it 2026-08-03)
+//   opening / closing      -> neutral plate + activity-transition when the
+//                             marker opts into «Icon + activity»
 //
 // The frame itself is NOT gone: door/window binary sensors and locks still
 // wear it, and a valve keeps it too (nothing morphs its icon). Those are
@@ -43,7 +43,7 @@ const out = await page.evaluate(async () => {
     c._serverCfg = {
       ...c._serverCfg,
       markers: [
-        { id: 'm_gate', binding: 'device:d_gate', tap_action: 'cover' },
+        { id: 'm_gate', binding: 'device:d_gate', tap_action: 'cover', display: 'icon_ripple' },
         { id: 'm_mower', binding: 'device:d_mower', hidden: true },
       ],
     };
@@ -84,12 +84,14 @@ const out = await page.evaluate(async () => {
   };
 
   plateIsNeutral('closed');
-  o.closedNoRing = !cls().includes('covermove');
+  o.closedNoRing = !cls().includes('activity-transition');
   o.closedIconClosed = icon() === 'mdi:curtains-closed';
 
   await setCover('open', { device_class: 'curtain' });
   plateIsNeutral('open');
-  o.openNoRing = !cls().includes('covermove');
+  // This fixture jumps closed → open without an intermediate HA state, so
+  // the unified resolver supplies the agreed ~3.3 s transition fallback.
+  o.openDirectTransition = cls().includes('activity-transition');
   o.openIconOpen = icon() === 'mdi:curtains';
 
   // ajar: HA reports a positioned curtain as plain 'open' — it reads as OPEN
@@ -99,15 +101,16 @@ const out = await page.evaluate(async () => {
 
   await setCover('opening', { device_class: 'curtain' });
   plateIsNeutral('opening');
-  o.openingRings = cls().includes('covermove');
+  o.openingRings = cls().includes('activity-transition');
   o.openingRingIsTheBreathingOne = (() => {
-    const cs = getComputedStyle(devEl(), '::after');
-    return cs.animationName === 'hp-covermove' && cs.animationDuration === '2.2s';
+    const ring = devEl()?.querySelector('.activity-ring.transition i:first-child');
+    const cs = ring ? getComputedStyle(ring) : null;
+    return !!cs && cs.animationName === 'hp-activity-breathe' && cs.animationDuration === '2.2s';
   })();
 
   await setCover('closing', { device_class: 'curtain' });
   plateIsNeutral('closing');
-  o.closingRings = cls().includes('covermove');
+  o.closingRings = cls().includes('activity-transition');
 
   // --- the morph covers every class, both ways ---------------------------
   const morph = async (dc, closedIcon, openIcon) => {
@@ -135,7 +138,7 @@ const out = await page.evaluate(async () => {
   await setCover('unknown', { device_class: 'curtain' });
   plateIsNeutral('unknown');
   o.unknownNoMorph = icon() === 'mdi:garage-variant';
-  o.unknownNoRing = !cls().includes('covermove');
+  o.unknownNoRing = !cls().includes('activity-transition');
 
   // --- NOT touched: the «открыто» frame elsewhere ------------------------
   // the demo house has a lock and a window sensor on the ground floor
@@ -178,7 +181,15 @@ const out = await page.evaluate(async () => {
   const valve = { id: 'v', primary: 'valve.water', entities: ['valve.water'], marker: null };
   const clsOfState = (d, states) => {
     const saved = c.hass;
-    c.hass = { ...c.hass, states: { ...c.hass.states, ...states } };
+    const entities = Object.fromEntries(Object.keys(states).map((entity_id) => [
+      entity_id,
+      { entity_id, platform: 'demo', disabled_by: null },
+    ]));
+    c.hass = {
+      ...c.hass,
+      entities: { ...c.hass.entities, ...entities },
+      states: { ...c.hass.states, ...states },
+    };
     const r = c._stateClass(d);
     c.hass = saved;
     return r;
@@ -186,10 +197,10 @@ const out = await page.evaluate(async () => {
   o.valveOpenKeepsTheFrame = clsOfState(valve, { 'valve.water': { state: 'open', attributes: {} } }) === 'open';
   o.valveClosedIsNeutral = clsOfState(valve, { 'valve.water': { state: 'closed', attributes: {} } }) === '';
   // and the cover's own class string, straight from the source
-  const cover = { id: 'k', primary: 'cover.blind', entities: ['cover.blind'], marker: null };
+  const cover = { id: 'k', primary: 'cover.blind', entities: ['cover.blind'], marker: { display: 'icon_ripple' } };
   o.coverOpenClassIsEmpty = clsOfState(cover, { 'cover.blind': { state: 'open', attributes: { device_class: 'blind' } } }) === '';
-  o.coverOpeningClassIsRingOnly = clsOfState(cover, { 'cover.blind': { state: 'opening', attributes: { device_class: 'blind' } } }) === 'covermove';
-  o.coverClosingClassIsRingOnly = clsOfState(cover, { 'cover.blind': { state: 'closing', attributes: { device_class: 'blind' } } }) === 'covermove';
+  o.coverOpeningClassIsRingOnly = clsOfState(cover, { 'cover.blind': { state: 'opening', attributes: { device_class: 'blind' } } }) === 'activity-transition';
+  o.coverClosingClassIsRingOnly = clsOfState(cover, { 'cover.blind': { state: 'closing', attributes: { device_class: 'blind' } } }) === 'activity-transition';
   o.coverUnavailableStillFades = clsOfState(cover, { 'cover.blind': { state: 'unavailable', attributes: {} } }) === 'unavail';
   return o;
 });

demo/smoke_cover_not_primary.mjs

@@ -1,16 +1,14 @@
-// «Открыть/закрыть» on a curtain whose cover entity is NOT the primary one
+// «Открыть/закрыть» on a curtain whose cover entity used to lose to an option
+// switch in registry/domain order.
 // (owner's report 2026-08-04: «в настройках "открыть\закрыть", а по нажатию
 // по-прежнему инфо-карточка»).
 //
 // The device below is his, entity for entity: an Aqara «Roller shade driver
 // E1» ships the `cover.*` HIDDEN by the integration and a perfectly visible
-// `switch.*_reverse_direction` beside it. `primaryEntity` ranks visible above
-// hidden and `switch` above `cover`, so the marker's primary was the service
-// switch — the tap then resolved on the domain `switch` and the action the
-// user had explicitly chosen degraded to the info card, while the dialog kept
-// OFFERING the action, because that check already looked at every entity of
-// the device. The tap now finds the cover the same way the climate
-// temperature finds the thermostat: among all of them.
+// `switch.*_reverse_direction` beside it. The shared role resolver must pick
+// the real cover for status, while the explicit tap action decides whether a
+// click controls it. A mixed lamp+cover still stays a lamp unless the owner
+// explicitly selects the cover action.
 //
 // End to end: the action is chosen in the dialog and SAVED through the normal
 // path, and the click is done on the marker the card rebuilt from that config.
@@ -77,16 +75,17 @@ const out = await page.evaluate(async () => {
   const curtain = () => c._devices.find((x) => x.bindingRef === 'd_curtain');
   const mixed = () => c._devices.find((x) => x.bindingRef === 'd_mixed');
   o.deviceIsOnThePlan = !!curtain();
-  // the premise of the whole report: the cover is NOT the primary entity
-  o.primaryIsNotTheCover = curtain()?.primary === 'switch.office_curtain_reverse';
+  // Registry order and visibility no longer let an option switch outrank the
+  // actual functional entity.
+  o.primaryIsTheCover = curtain()?.primary === 'cover.office_curtain';
   o.coverIsAmongTheEntities = (curtain()?.entities || []).includes('cover.office_curtain');
 
   // ---- the dialog offers the action and SAVES it -------------------------
   c._setMode('devices'); await c.updateComplete;
   c._openMarkerDialog(curtain()); await c.updateComplete;
-  const optionValues = () => [...sr().querySelectorAll('.dialog option')].map((e) => e.value);
+  const optionValues = () => [...sr().querySelectorAll('hp-dialog option')].map((e) => e.value);
   o.dialogOffersCover = optionValues().includes('cover');
-  c._markerDialog = { ...c._markerDialog, tapAction: 'cover' };
+  c._markerDialog = { ...c._markerDialog, tapAction: 'cover', display: 'icon_ripple' };
   await c.updateComplete;
   await c._saveMarker();
   await c.updateComplete;
@@ -165,7 +164,7 @@ const out = await page.evaluate(async () => {
   await push('closed', { device_class: 'curtain' });
   o.markerIsOnScreen = !!devEl(curtain());
   o.closedIsNeitherOpenNorMoving =
-    !clsOf(curtain()).includes('open') && !clsOf(curtain()).includes('covermove');
+    !clsOf(curtain()).includes('open') && !clsOf(curtain()).includes('activity-transition');
   o.closedIconIsClosedCurtains = iconOf(curtain()) === 'mdi:curtains-closed';
 
   await push('open', { device_class: 'curtain' });
@@ -176,10 +175,10 @@ const out = await page.evaluate(async () => {
   o.openIconIsOpenCurtains = iconOf(curtain()) === 'mdi:curtains';
 
   await push('opening', { device_class: 'curtain' });
-  o.travellingBreathes = clsOf(curtain()).includes('covermove');
+  o.travellingBreathes = clsOf(curtain()).includes('activity-transition');
   await push('closing', { device_class: 'curtain' });
-  o.closingBreathesToo = clsOf(curtain()).includes('covermove');
-  o.stateClassIsTheSameStory = c._stateClass(curtain()).includes('covermove');
+  o.closingBreathesToo = clsOf(curtain()).includes('activity-transition');
+  o.stateClassIsTheSameStory = c._stateClass(curtain()).includes('activity-transition');
 
   // the service switch never speaks for the marker again: reverse-direction
   // ON used to paint the curtain yellow («включено») while it stood still
@@ -187,28 +186,25 @@ const out = await page.evaluate(async () => {
   await setSwitch('on');
   o.reverseSwitchNeverLightsTheMarker = !clsOf(curtain()).includes('on');
 
-  // THE BOUNDARY of the rule: take the explicit action away and the marker
-  // goes back to its primary entity — no cover indication is invented
+  // Status and action are independent: taking the explicit action away keeps
+  // the resolved cover status, but a click returns to the ordinary info path.
   const savedMarker = (c._serverCfg.markers || []).find((m) => m.binding === 'device:d_curtain');
   savedMarker.tap_action = 'info';
   await push('opening', { device_class: 'curtain' });
   await setSwitch('on');
-  o.withoutTheActionThePrimarySpeaks = clsOf(curtain()).includes('on')
-    && !clsOf(curtain()).includes('covermove');
+  o.withoutTheActionResolvedCoverSpeaks = clsOf(curtain()).includes('activity-transition')
+    && !clsOf(curtain()).includes('on');
   savedMarker.tap_action = 'cover';
   await push('closed', { device_class: 'curtain' });
   await setSwitch('off');
   o.actionBackMeansCoverBack = iconOf(curtain()) === 'mdi:curtains-closed';
 
   // ---- the auditor's own probe: BOTH entities visible ---------------------
-  // DEV-2C947-04 was written up with a plain visible `cover.*` beside a
-  // visible `switch.*`: no hidden tier involved, `switch` simply outranks
-  // `cover` inside DOMAIN_PRIORITY. Same premise, same cure — pinned here so
-  // the finding cannot come back through the other door.
+  // The same rule must hold when BOTH entities are visible.
   ENTS['cover.office_curtain'] = { ...ENTS['cover.office_curtain'], hidden: false };
   await push('closed', { device_class: 'curtain' });
   await setSwitch('off');
-  o.visibleCoverIsStillNotThePrimary = curtain()?.primary === 'switch.office_curtain_reverse';
+  o.visibleCoverIsThePrimary = curtain()?.primary === 'cover.office_curtain';
   calls.length = 0;
   await tap();
   o.visibleCoverOpensOnTap = JSON.stringify(calls[calls.length - 1] || [])
@@ -223,7 +219,7 @@ const out = await page.evaluate(async () => {
   // never disagree, owner's principle 2026-07-29).
   o.mixedPrimaryIsTheLight = mixed()?.primary === 'light.mixed';
   o.mixedCoverIsTravelling = c.hass.states['cover.mixed'].state === 'opening';
-  o.mixedStaysALitLamp = clsOf(mixed()).includes('on') && !clsOf(mixed()).includes('covermove');
+  o.mixedStaysALitLamp = clsOf(mixed()).includes('on') && !clsOf(mixed()).includes('activity-transition');
   // its icon is the device's own auto icon, NOT the cover's open/closed pair
   o.mixedIconIsNotMorphedByTheCover =
     iconOf(mixed()) === mixed()?.icon && !iconOf(mixed()).includes('curtains');

demo/smoke_cover_plate_precedence.mjs

@@ -45,7 +45,15 @@ const out = await page.evaluate(async () => {
   // =======================================================================
   const withStates = (states, fn) => {
     const saved = c.hass;
-    c.hass = { ...c.hass, states: { ...c.hass.states, ...states } };
+    const entities = Object.fromEntries(Object.keys(states).map((entity_id) => [
+      entity_id,
+      { entity_id, platform: 'demo', disabled_by: null },
+    ]));
+    c.hass = {
+      ...c.hass,
+      entities: { ...c.hass.entities, ...entities },
+      states: { ...c.hass.states, ...states },
+    };
     const r = fn();
     c.hass = saved;
     return r;
@@ -54,14 +62,14 @@ const out = await page.evaluate(async () => {
   /** The auditor's marker #1: primary is a LIT light, the cover is explicit. */
   const litLamp = {
     id: 'p_lamp', primary: 'light.mixed', entities: ['light.mixed', 'cover.mixed'],
-    tapAction: 'cover', marker: null,
+    tapAction: 'cover', marker: { display: 'icon_ripple' },
   };
   /** The auditor's marker #2: a cover marker whose bound control is on. */
   const controlled = {
     id: 'p_ctrl', primary: 'cover.mixed', entities: ['cover.mixed'],
-    tapAction: 'cover', marker: { id: 'p_ctrl', binding: 'device:x', controls: ['switch.control'] },
+    tapAction: 'cover', marker: { id: 'p_ctrl', binding: 'device:x', controls: ['switch.control'], display: 'icon_ripple' },
   };
-  const CV = { closed: '', open: '', opening: 'covermove', closing: 'covermove' };
+  const CV = { closed: '', open: '', opening: 'activity-transition', closing: 'activity-transition' };
   for (const [state, want] of Object.entries(CV)) {
     const states = {
       'light.mixed': st('on', { friendly_name: 'Bedside lamp' }),
@@ -78,14 +86,15 @@ const out = await page.evaluate(async () => {
   o.controlledUnavailFades = withStates({
     'switch.control': st('on', {}), 'cover.mixed': st('unavailable', {}),
   }, () => c._stateClass(controlled)) === 'unavail';
-  // …and a cover entity with no state at all is simply neutral, not yellow
-  o.litLampNoCoverStateIsNeutral = withStates({
+  // …and a selected cover with no state is unavailable, never borrowed from
+  // the lit neighbour that the explicit cover action deliberately outranks.
+  o.litLampNoCoverStateIsUnavailable = withStates({
     'light.mixed': st('on', {}),
-  }, () => c._stateClass(litLamp)) === '';
+  }, () => c._stateClass(litLamp)) === 'unavail';
 
   // ---- the OTHER side of the rule: nothing changed for the rest ----------
   // the very same mixed device WITHOUT the explicit action keeps its primary
-  const plainLamp = { ...litLamp, id: 'p_plain', tapAction: null };
+  const plainLamp = { ...litLamp, id: 'p_plain', tapAction: null, marker: null };
   o.mixedWithoutTheOptionStaysYellow = withStates({
     'light.mixed': st('on', {}), 'cover.mixed': st('opening', { device_class: 'curtain' }),
   }, () => c._stateClass(plainLamp)) === 'on';
@@ -104,7 +113,7 @@ const out = await page.evaluate(async () => {
   // a curtain marker with controls that are OFF is still just a curtain
   o.controlledOffStillRings = withStates({
     'switch.control': st('off', {}), 'cover.mixed': st('opening', { device_class: 'curtain' }),
-  }, () => c._stateClass(controlled)) === 'covermove';
+  }, () => c._stateClass(controlled)) === 'activity-transition';
   // an explicit «cover» marker with NO cover among its entities falls back to
   // the old order — the statement is only as strong as the entity behind it
   const noCover = {
@@ -143,8 +152,8 @@ const out = await page.evaluate(async () => {
     c._serverCfg = {
       ...c._serverCfg,
       markers: [
-        { id: 'm_mixed', binding: 'device:d_mixed', tap_action: 'cover' },
-        { id: 'm_ctrl', binding: 'device:d_ctrl', tap_action: 'cover', controls: ['switch.control'] },
+        { id: 'm_mixed', binding: 'device:d_mixed', tap_action: 'cover', display: 'icon_ripple' },
+        { id: 'm_ctrl', binding: 'device:d_ctrl', tap_action: 'cover', controls: ['switch.control'], display: 'icon_ripple' },
       ],
     };
     c._cfgEpoch++;
@@ -187,7 +196,7 @@ const out = await page.evaluate(async () => {
     o[tag + 'NotYellow'] = bg !== YELLOW;
     o[tag + 'NotOrange'] = bg !== ORANGE;
     o[tag + 'NoOnClass'] = !el.classList.contains('on') && !el.classList.contains('open');
-    o[tag + 'Rings'] = el.classList.contains('covermove');
+    o[tag + 'Rings'] = el.classList.contains('activity-transition');
     o[tag + 'IconIsTheCover'] = el.querySelector('ha-icon')?.getAttribute('icon') === 'mdi:curtains';
   };
   o.lampIsTrulyLit = c.hass.states['light.mixed'].state === 'on';
@@ -200,7 +209,7 @@ const out = await page.evaluate(async () => {
   const closedBg = (ref) => getComputedStyle(elOf(dev(ref))).backgroundColor;
   o.litLampClosedNeutral = closedBg('d_mixed') === NEUTRAL;
   o.controlledClosedNeutral = closedBg('d_ctrl') === NEUTRAL;
-  o.litLampClosedNoRing = !elOf(dev('d_mixed')).classList.contains('covermove');
+  o.litLampClosedNoRing = !elOf(dev('d_mixed')).classList.contains('activity-transition');
   return o;
 });
 checkAll(out);

demo/smoke_cover_tap.mjs

@@ -10,8 +10,8 @@
 // The option is offered ONLY for a binding that HAS a cover entity, and never
 // for the guarded classes (garage/door/gate) — for those a value smuggled into
 // the config degrades to 'info', exactly like a card-wide toggle does.
-// While travelling the icon breathes a soft ring (.covermove, the vacuum
-// puck's 2.2s period) and the plate stays NEUTRAL — yellow means «включено».
+// With «Icon + activity», travelling breathes a soft activity ring (the
+// vacuum puck's 2.2s period) and the plate stays NEUTRAL — yellow means work.
 // Since 2026-08-04 the plate is neutral in EVERY cover state, the «открыто»
 // frame included: open/closed is told by the icon morph alone (the full
 // contract lives in smoke_cover_no_plate.mjs).
@@ -45,7 +45,8 @@ const out = await page.evaluate(async () => {
     c._serverCfg = {
       ...c._serverCfg,
       markers: [
-        { id: 'm_gate', binding: 'device:d_gate', tap_action: tapAction, tap_confirm: confirm || null },
+        { id: 'm_gate', binding: 'device:d_gate', tap_action: tapAction,
+          tap_confirm: confirm || null, display: 'icon_ripple' },
         ...(solo ? [{ id: 'm_mower', binding: 'device:d_mower', hidden: true }] : []),
       ],
     };
@@ -73,13 +74,13 @@ const out = await page.evaluate(async () => {
   // ---- the dialog offers the option only where it makes sense ------------
   await setCover('closed', { device_class: 'curtain' });
   c._setMode('devices'); await c.updateComplete;
-  const optionValues = () => [...sr().querySelectorAll('.dialog option')].map((e) => e.value);
+  const optionValues = () => [...sr().querySelectorAll('hp-dialog option')].map((e) => e.value);
   c._openMarkerDialog(gate()); await c.updateComplete;
   o.dialogOffersCoverForCurtain = optionValues().includes('cover');
   // …and the confirmation checkbox follows the choice, like it does for run/toggle
-  const rowsBefore = sr().querySelectorAll('.dialog .srcrow').length;
+  const rowsBefore = sr().querySelectorAll('hp-dialog .srcrow').length;
   c._markerDialog = { ...c._markerDialog, tapAction: 'cover' }; await c.updateComplete;
-  o.confirmCheckboxShownForCover = sr().querySelectorAll('.dialog .srcrow').length > rowsBefore;
+  o.confirmCheckboxShownForCover = sr().querySelectorAll('hp-dialog .srcrow').length > rowsBefore;
   c._markerDialog = null; await c.updateComplete;
 
   // a GARAGE door never gets the option (owner: «нет, только шторы/жалюзи»)
@@ -149,9 +150,9 @@ const out = await page.evaluate(async () => {
 
   // ---- the indication ----------------------------------------------------
   const afterAnim = () => {
-    const el = devEl();
+    const el = devEl()?.querySelector('.activity-ring.transition i:first-child');
     if (!el) return null;
-    const cs = getComputedStyle(el, '::after');
+    const cs = getComputedStyle(el);
     return { name: cs.animationName, dur: cs.animationDuration };
   };
   await setMarker('cover', false, true); // the gate alone on the plan
@@ -160,33 +161,33 @@ const out = await page.evaluate(async () => {
   // mower used, so a plate colour read in the same frame is still mid-fade
   await new Promise((r) => setTimeout(r, 300));
   o.onlyTheCoverOnThePlan = sr().querySelectorAll('.dev').length === 1;
-  o.pulseWhileOpening = sr().querySelectorAll('.dev.covermove').length === 1;
+  o.pulseWhileOpening = sr().querySelectorAll('.dev.activity-transition').length === 1;
   const a1 = afterAnim();
-  o.pulseIsBreathingRing = a1?.name === 'hp-covermove' && a1?.dur === '2.2s';
+  o.pulseIsBreathingRing = a1?.name === 'hp-activity-breathe' && a1?.dur === '2.2s';
   // the plate stays NEUTRAL while travelling: yellow is reserved for «включено»
   o.movingPlateNotYellow = getComputedStyle(devEl()).backgroundColor !== YELLOW;
 
   await setCover('closing', { device_class: 'curtain' });
   await new Promise((r) => setTimeout(r, 300));
-  o.pulseWhileClosing = sr().querySelectorAll('.dev.covermove').length === 1;
+  o.pulseWhileClosing = sr().querySelectorAll('.dev.activity-transition').length === 1;
   o.closingPlateNotYellow = getComputedStyle(devEl()).backgroundColor !== YELLOW;
 
   await setCover('open', { device_class: 'curtain' });
-  o.noPulseWhenOpen = sr().querySelectorAll('.dev.covermove').length === 0;
+  o.noPulseWhenOpen = sr().querySelectorAll('.dev.activity-transition').length === 0;
   o.iconMorphOpen = icons().includes('mdi:curtains') && !icons().includes('mdi:curtains-closed');
   // owner 2026-08-04: never a coloured plate on a cover — not even «открыто»
   o.openWearsNoFrame = sr().querySelectorAll('.dev.open').length === 0;
   o.openPlateNotYellow = getComputedStyle(devEl()).backgroundColor !== YELLOW;
 
   await setCover('closed', { device_class: 'curtain' });
-  o.noPulseWhenClosed = sr().querySelectorAll('.dev.covermove').length === 0;
+  o.directCloseGetsFallback = sr().querySelectorAll('.dev.activity-transition').length === 1;
   o.iconMorphClosed = icons().includes('mdi:curtains-closed') && !icons().includes('mdi:curtains');
 
   await setCover('open', { device_class: 'shutter' });
   o.iconMorphShutterOpen = icons().includes('mdi:window-shutter-open');
 
   await setCover('unknown', { device_class: 'curtain' });
-  o.noPulseWhenUnknown = sr().querySelectorAll('.dev.covermove').length === 0;
+  o.noPulseWhenUnknown = sr().querySelectorAll('.dev.activity-transition').length === 0;
   o.noMorphWhenUnknown = icons().includes(gate().icon)
     && !icons().some((i) => i.startsWith('mdi:curtains'));
 

demo/smoke_decor.mjs

@@ -11,9 +11,28 @@ const res = await page.evaluate(async () => {
   tabs[2].click(); await c.updateComplete;
   out.decorMode = c._mode === 'decor';
   out.decorBar = !!sr().querySelector('.editbar.decorbar');
-  // six drawing tools + «Картинка-подложка», which f1 offers because it HAS a
-  // picture (docs/BACKDROP.md §2); a hand-drawn space still shows six
-  out.toolBtns = sr().querySelectorAll('.decorbar .btn.dtool').length === 7;
+  // The compact colour/opacity control must escape the clipped editor/dialog
+  // surface through the browser top layer and remain inside the viewport.
+  c._decorTool = 'line'; c.requestUpdate(); await c.updateComplete;
+  const picker = sr().querySelector('.editor-secondary hp-color-opacity');
+  out.transientStyleLivesInContextTray = !!picker
+    && !sr().querySelector('.decorbar hp-color-opacity');
+  const trigger = picker?.shadowRoot?.querySelector('.trigger');
+  trigger?.click();
+  await picker?.updateComplete;
+  await new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve)));
+  const popup = picker?.shadowRoot?.querySelector('.picker');
+  const popupRect = popup?.getBoundingClientRect();
+  out.colorPickerUsesTopLayer = !!popup?.matches(':popover-open');
+  out.colorPickerInsideViewport = !!popupRect
+    && popupRect.left >= 0 && popupRect.top >= 0
+    && popupRect.right <= innerWidth && popupRect.bottom <= innerHeight;
+  trigger?.click();
+  await picker?.updateComplete;
+  // seven tools (the six drawing ones + «Мебель», docs/FURNITURE.md) plus
+  // «Картинка-подложка», which f1 offers because it HAS a picture
+  // (docs/BACKDROP.md §2); a hand-drawn space still shows seven
+  out.toolBtns = sr().querySelectorAll('.decorbar .btn.dtool').length === 8;
   // 2) нарисовать прямоугольник drag-ом (через прямые вызовы)
   c._decorTool = 'rect'; c._decorStyle = { color: '#ff0000', width: 3, fill: true }; await c.updateComplete;
   const g = c._gridPitch;
@@ -47,6 +66,9 @@ const res = await page.evaluate(async () => {
   c._decorDraft = { kind: 'line', a: [g, g], b: [g, g], pid: 1 };
   c._decorCommitDraft();
   out.degenerateSkipped = c._decorList.length === 3;
+  c._decorDraft = { kind: 'rect', a: [g, g], b: [g * 5, g], pid: 1 };
+  c._decorCommitDraft();
+  out.flatRectSkipped = c._decorList.length === 3;
   // 3b) живая плашка размера, пока фигуру ещё тянут (владелец 2026-08-04:
   // «в редакторе подложки у линий писать длину, как при рисовании комнат в
   // редакторе плана»). Та же .measurelabel, тот же formatLength/cell_cm.
@@ -75,10 +97,11 @@ const res = await page.evaluate(async () => {
   await c.updateComplete;
   out.obliqueBadge = txt() === fmt(g * 5) + ' · 53.1°';
   out.obliqueNotGreen = !!label() && !label().classList.contains('on45');
-  // прямоугольник и овал: длины у них нет, есть габарит «Ш × В»
+  // прямоугольник показывает габарит и чистую площадь
   c._decorDraft = { kind: 'rect', a: [g * 4, g * 20], b: [g * 12, g * 26], pid: 3 };
   await c.updateComplete;
-  out.rectBadgeIsSize = txt() === fmt(g * 8) + ' × ' + fmt(g * 6);
+  out.rectBadgeHasSizeAndArea = txt().startsWith(fmt(g * 8) + ' × ' + fmt(g * 6) + ' · ')
+    && /(?:m²|ft²)$/.test(txt());
   // отпустили — плашки нет
   c._decorCommitDraft(); await c.updateComplete;
   out.badgeGoneAfterRelease = !label();
@@ -86,8 +109,10 @@ const res = await page.evaluate(async () => {
   c._decorTool = 'select';
   await c.updateComplete;
   out.stillThreeShapes = c._decorList.length === 3;
-  // 4) надпись через диалог
-  c._decorTextDialog = { x: 0.5, y: 0.5, text: 'Сауна', size: 'l', color: '#0000ff' };
+  // 4) надпись через диалог. Поля `size` в диалоге больше нет — размер задаётся
+  // углами блока (см. smoke_decor_text); сохранённый старый `size` по-прежнему
+  // читается как начальный масштаб.
+  c._decorTextDialog = { x: 0.5, y: 0.5, text: 'Сауна', color: '#0000ff' };
   c._decorSaveText(); await c.updateComplete;
   out.textSaved = c._decorList.some((x) => x.kind === 'text' && x.text === 'Сауна');
   out.textRendered = [...sr().querySelectorAll('.decorlayer text')].some((t) => t.textContent.includes('Сауна'));
@@ -151,7 +176,10 @@ const res = await page.evaluate(async () => {
     out[key] = !!c._decorDraft && c._decorDraft.kind === tool && c._decorSel === null;
     c._decorDraft = null;
   }
-  // — «текст» по фигуре открывает диалог новой надписи, а не выделяет
+  // — «текст» по ЛИНИИ открывает диалог новой надписи, а не выделяет её.
+  // Инертность нетекстовых фигур под рисующими инструментами остаётся в силе;
+  // единственное исключение — надпись под инструментом «текст», она открывает
+  // СВОЮ форму (владелец 2026-08-04, пинится в smoke_decor_text).
   c._decorTool = 'text'; c._decorSel = null; c._decorTextDialog = null; await c.updateComplete;
   press(probe(), g * 12, g * 30, 43);
   await c.updateComplete;
@@ -165,14 +193,131 @@ const res = await page.evaluate(async () => {
   out.selectStillSelects = c._decorSel === 'dcprobe';
   out.selectStillGrabs = !!c._decorMove && c._decorMove.id === 'dcprobe';
   out.selectMakesNoDraft = !c._decorDraft;
-  c._decorMove = null; c._decorSel = null;
+  c._decorMove = null;
+  const selectionTray = sr().querySelector('.editor-secondary-host.open .editor-secondary.kind-selection');
+  out.selectionActionsUseContextTray = !!selectionTray
+    && !!selectionTray.querySelector('ha-icon[icon="mdi:tune"]')
+    && !!selectionTray.querySelector('ha-icon[icon="mdi:delete-outline"]')
+    && !sr().querySelector('.decorbar .danger');
+  const selectionAction = selectionTray?.querySelector('button');
+  selectionAction?.focus();
+  selectionAction?.dispatchEvent(new KeyboardEvent('keydown', {
+    key: 'Delete', bubbles: true, composed: true, cancelable: true,
+  }));
+  await c.updateComplete;
+  out.deleteDoesNotFallThroughContextTray = c._decorSel === 'dcprobe'
+    && c._decorList.some((shape) => shape.id === 'dcprobe');
+  const staleContextId = c._editorSecondaryContextId;
+  let staleInvokes = 0;
+  const staleInvoke = () => c._runEditorContext(staleContextId, () => { staleInvokes += 1; });
+  const otherShape = c._decorList.find((shape) => shape.id !== 'dcprobe');
+  c._decorSel = otherShape?.id || null;
+  c._decorShapeDialog = null;
+  c.requestUpdate(); await c.updateComplete;
+  staleInvoke();
+  out.staleContextActionIsIgnored = staleInvokes === 0 && c._decorShapeDialog === null;
+  c._decorSel = 'dcprobe'; c.requestUpdate(); await c.updateComplete;
+  // Double click in Select is the universal properties gesture for every
+  // object, not only text. It must go through the rendered listener so this
+  // also pins the event wiring, then persist the common colour/width fields.
+  probe().dispatchEvent(new MouseEvent('dblclick', {
+    bubbles: true, composed: true, cancelable: true, button: 0,
+  }));
+  await c.updateComplete;
+  out.doubleClickOpensObjectDialog = c._decorShapeDialog?.id === 'dcprobe'
+    && !!sr().querySelector('hp-dialog .dfill') === false;
+  out.lineStyleDefaultsSolid = c._decorShapeDialog?.lineStyle === 'solid'
+    && sr().querySelectorAll('input[name="decor-line-style"]').length === 2
+    && !c._decorList.find((x) => x.id === 'dcprobe')?.line_style;
+  const angleInput = sr().querySelector('hp-dialog input[min="-180"][max="180"]');
+  if (angleInput) {
+    angleInput.value = '12.3456';
+    angleInput.dispatchEvent(new Event('input', { bubbles: true, composed: true }));
+    await c.updateComplete;
+  }
+  out.angleInputKeepsWorkingPrecision = c._decorShapeDialog?.angle === '12.3456'
+    && sr().querySelector('hp-dialog input[min="-180"][max="180"]')?.value === '12.3456';
+  out.lineStyleAbsentFromToolbar = !sr().querySelector('.editbar input[name="decor-line-style"]');
+  c._decorShapeDialog = {
+    ...c._decorShapeDialog, color: '#123456', widthCm: 6.5, lineStyle: 'dashed',
+  };
+  c._decorSaveShape(); await c.updateComplete;
+  const editedProbe = c._decorList.find((x) => x.id === 'dcprobe');
+  out.objectDialogSavesStyle = editedProbe?.color === '#123456'
+    && editedProbe?.width_cm === 6.5 && editedProbe?.width === undefined
+    && editedProbe?.line_style === 'dashed'
+    && c._decorShapeDialog === null;
+  out.dashedLineRendered = !!probe()?.getAttribute('stroke-dasharray');
+  c._undoGeometry(); await c.updateComplete;
+  const undoSolid = !c._decorList.find((x) => x.id === 'dcprobe')?.line_style;
+  c._redoGeometry(); await c.updateComplete;
+  out.lineStyleUndoRedo = undoSolid
+    && c._decorList.find((x) => x.id === 'dcprobe')?.line_style === 'dashed';
+  const selectHit = sr().querySelector('.decorlayer line.dselecthit');
+  const dashedPaint = probe();
+  let gapPicked = null;
+  if (selectHit && dashedPaint) {
+    const sw = Number(dashedPaint.getAttribute('stroke-width')) || 1;
+    const gapPoint = dashedPaint.getPointAtLength(Math.min(dashedPaint.getTotalLength() * 0.75, sw * 5.5));
+    const screenPoint = new DOMPoint(gapPoint.x, gapPoint.y).matrixTransform(dashedPaint.getScreenCTM());
+    gapPicked = sr().elementFromPoint(screenPoint.x, screenPoint.y);
+  }
+  out.dashedLineSelectableAcrossGaps = gapPicked === selectHit
+    && selectHit?.classList.contains('dshape')
+    && selectHit?.dataset.hp === 'decor'
+    && selectHit?.dataset.id === 'dcprobe';
+  // Erase gets a constant screen-space target around hairlines. Exercise the
+  // browser's actual SVG hit-test 6 px away from a sub-pixel painted stroke;
+  // dispatching directly to the proxy would only prove that its listener exists.
+  c._replaceDecor('dcprobe', { width_cm: 0.1, width: undefined });
+  c._decorTool = 'erase'; await c.updateComplete;
+  const paintedProbe = sr().querySelector('.decorlayer line.dshape:not(.derasehit)');
+  const eraseHit = sr().querySelector('.decorlayer line.derasehit');
+  const matrix = paintedProbe?.getScreenCTM();
+  let picked = null;
+  if (paintedProbe && eraseHit && matrix) {
+    const p1 = new DOMPoint(+paintedProbe.getAttribute('x1'), +paintedProbe.getAttribute('y1')).matrixTransform(matrix);
+    const p2 = new DOMPoint(+paintedProbe.getAttribute('x2'), +paintedProbe.getAttribute('y2')).matrixTransform(matrix);
+    const dx = p2.x - p1.x, dy = p2.y - p1.y, len = Math.hypot(dx, dy) || 1;
+    picked = sr().elementFromPoint((p1.x + p2.x) / 2 - (dy / len) * 6,
+      (p1.y + p2.y) / 2 + (dx / len) * 6);
+  }
+  out.eraseHairlineHasWideHitTarget = picked === eraseHit
+    && getComputedStyle(eraseHit).strokeWidth === '16px'
+    && getComputedStyle(eraseHit).pointerEvents === 'stroke';
+  picked?.dispatchEvent(new PointerEvent('pointerdown', {
+    bubbles: true, composed: true, cancelable: true, pointerId: 45, button: 0, isPrimary: true,
+  }));
+  await c.updateComplete;
+  out.eraseWideHitOpensConfirmation = c._decorEraseConfirm?.id === 'dcprobe';
+  c._decorEraseConfirm = null;
+  c._decorSel = null;
   c._curSpaceCfg.decor = decorBefore;                 // сцена как была до пробы
   c._decorTool = 'select'; await c.updateComplete;
   out.decorRestored = c._decorList.length === decorBefore.length;
+  // Switching modes during a live move cancels the transaction and restores
+  // its start instead of leaving mutated geometry with a forgotten pointer.
+  const liveShape = c._decorList[0];
+  const liveBefore = JSON.parse(JSON.stringify(liveShape));
+  const liveSnapshot = c._geometrySnapshot();
+  c._decorMove = {
+    id: liveShape.id, start: [0, 0], orig: liveBefore, pid: 99,
+    moved: true, before: liveSnapshot,
+  };
+  c._curSpaceCfg.decor = c._decorList.map((shape) => shape.id === liveShape.id
+    ? { ...shape, x: (shape.x || 0) + 0.2 }
+    : shape);
+  c._setMode('view'); await c.updateComplete;
+  const restoredLive = c._decorList.find((shape) => shape.id === liveShape.id);
+  out.modeSwitchCancelsLiveDecor = !c._decorMove
+    && JSON.stringify(restoredLive) === JSON.stringify(liveBefore);
+  c._setMode('decor'); await c.updateComplete;
   // 6) erase удаляет
   const n0 = c._decorList.length;
   c._decorTool = 'erase';
   c._decorShapeDown({ stopPropagation() {}, preventDefault() {}, target: null, pointerId: 1 }, c._decorList[0]);
+  out.eraseAsksConfirmation = c._decorList.length === n0 && !!c._decorEraseConfirm;
+  c._confirmDecorErase();
   out.eraseWorks = c._decorList.length === n0 - 1;
   // 7) Esc-лестница: инструмент → select → выход
   c._decorTool = 'line'; c._decorSel = null; await c.updateComplete;

demo/smoke_decor_text.mjs

@@ -0,0 +1,226 @@
+// Текстовый блок декора (правки владельца 2026-08-04):
+//   1) выбора размера шрифта БОЛЬШЕ НЕТ — размер задаётся углами блока и
+//      после явной правки хранится физически в `size_cm`; старый `size`
+//      до этого продолжает читаться без визуальной миграции;
+//   2) многострочный текст: перевод строки сохраняется и рисуется, блок
+//      выравнивается по центру;
+//   3) у выделенного блока есть угловые ручки (масштаб) и ручка поворота
+//      (шаг 5°, Shift — мимо шага); ВИДИМЫЙ размер ручки — четверть хит-зоны
+//      (правка владельца 2026-08-05 «уменьшить в 4 раза»), сама хит-зона
+//      прежняя, пальцевая: 1.8 % видимого вида;
+//   4) при инструменте «текст» клик по УЖЕ РАЗМЕЩЁННОЙ надписи открывает её
+//      форму, а не создаёт новую; по пустому месту и по НЕтекстовой фигуре —
+//      создаёт новую (нетекстовые фигуры остаются инертными, см. smoke_decor).
+// ПАДАЕТ на сборке до этих правок: в диалоге ещё радиокнопки размера, перевод
+// строки схлопывается в одну строку, ручек нет, а «текст» по надписи создаёт
+// вторую надпись поверх первой.
+import { launch, checkAll, finish } from './serve.mjs';
+const { page, browser } = await launch();
+const res = await page.evaluate(async () => {
+  const out = {};
+  const c = window.__card;
+  const sr = () => c.shadowRoot || c.renderRoot;
+  const sleep = (ms) => new Promise((r) => setTimeout(r, ms));
+  // null-safe: на сборке ДО этих правок у надписи нет ни data-id, ни tspan —
+  // смок должен показать список провалов, а не упасть с исключением
+  const el = (id) => sr().querySelector(`.decorlayer text.dtext[data-id="${id}"]`);
+  const attr = (id, name) => { const e = el(id); return e ? e.getAttribute(name) : null; };
+  const tspans = (id) => { const e = el(id); return e ? [...e.querySelectorAll('tspan')] : []; };
+  const stageEl = () => sr().querySelector('.stage');
+  /** открыть форму существующей надписи (на старой сборке — двойным щелчком) */
+  const open = (sh) => (c._decorOpenText ? c._decorOpenText(sh) : c._decorShapeDbl(sh));
+  const toScreen = (x, y) => {
+    const r = stageEl().getBoundingClientRect();
+    const v = c._viewOr(c._baseVb());
+    return { clientX: r.left + ((x - v.x) / v.w) * r.width,
+      clientY: r.top + ((y - v.y) / v.h) * r.height };
+  };
+  const ev = (type, target, x, y, extra = {}) => {
+    const { clientX, clientY } = toScreen(x, y);
+    target.dispatchEvent(new PointerEvent(type, { bubbles: true, composed: true,
+      cancelable: true, pointerId: 7, clientX, clientY, button: 0, isPrimary: true, ...extra }));
+  };
+
+  sr().querySelectorAll('.modetab')[2].click(); await c.updateComplete;
+  c._curSpaceCfg.decor = [];
+  c._decorTool = 'select'; c._decorSel = null; await c.updateComplete;
+
+  // ================= 1. размера шрифта в диалоге больше нет ================
+  c._decorTool = 'text';
+  c._decorTextDialog = { x: 0.3, y: 0.3, text: '', color: '#223344' };
+  await c.updateComplete;
+  out.noSizePicker = !sr().querySelector('input[name="dtsize"]');
+  out.textareaNotInput = !!sr().querySelector('hp-dialog textarea.dtarea');
+  c._decorTextDialog = null; await c.updateComplete;
+
+  // старый `size` продолжает рисоваться ровно как раньше: 'l' = 30px
+  c._curSpaceCfg.decor = [
+    { id: 'dtl', kind: 'text', x: 0.25, y: 0.25, text: 'Старый', size: 'l', color: '#223344' },
+    { id: 'dts', kind: 'text', x: 0.25, y: 0.4, text: 'Мелкий', size: 's', color: '#223344' },
+    { id: 'dtm', kind: 'text', x: 0.25, y: 0.55, text: 'Обычный', color: '#223344' },
+  ];
+  c._cfgEpoch++; c.requestUpdate(); await c.updateComplete;
+  out.legacyLarge = +attr('dtl', 'font-size') === 30;
+  out.legacySmall = +attr('dts', 'font-size') === 14;
+  out.noSizeIsMedium = +attr('dtm', 'font-size') === 20;
+
+  // ================= 2. многострочный текст, по центру =====================
+  c._decorTool = 'text';
+  c._decorTextDialog = { x: 0.5, y: 0.5, text: '  Гараж\nпод ключ  ', color: '#223344' };
+  c._decorSaveText(); await c.updateComplete;
+  const multi = c._decorList.find((x) => x.text && x.text.includes('\n'));
+  out.newlineStored = !!multi && multi.text === 'Гараж\nпод ключ'; // края обрезаны, середина цела
+  const tsp = tspans(multi.id);
+  out.twoLinesRendered = tsp.length === 2
+    && tsp[0].textContent === 'Гараж' && tsp[1].textContent === 'под ключ';
+  out.linesCentredHorizontally = tsp.length === 2 && !!el(multi.id)
+    && getComputedStyle(el(multi.id)).textAnchor === 'middle'
+    && tsp[0].getAttribute('x') === tsp[1].getAttribute('x');
+  // блок центрирован и по вертикали: якорь ровно между строками
+  const ay = multi.y * 1000;
+  const y0 = tsp[0] ? +tsp[0].getAttribute('y') : NaN;
+  const y1 = tsp[1] ? +tsp[1].getAttribute('y') : NaN;
+  out.blockCentredVertically = Math.abs((y0 + y1) / 2 - ay) < 0.01 && y1 > y0;
+  // длинная строка НЕ переносится сама (docs/LIVE-TEXT.md: никаких автопереносов)
+  open(multi); await c.updateComplete;
+  c._decorTextDialog = { ...c._decorTextDialog, text: 'x'.repeat(120) };
+  c._decorSaveText(); await c.updateComplete;
+  out.noAutoWrap = tspans(multi.id).length === 1;
+  open(c._decorList.find((x) => x.id === multi.id)); await c.updateComplete;
+  c._decorTextDialog = { ...c._decorTextDialog, text: 'Гараж\nпод ключ' };
+  c._decorSaveText(); await c.updateComplete;
+
+  // ================= 3. ручки масштаба и поворота ==========================
+  c._decorTool = 'select'; c._decorSel = null; await c.updateComplete;
+  out.noFrameWithoutSelection = !sr().querySelector('.dtframe');
+  c._decorSel = 'dtm'; c.requestUpdate();
+  await c.updateComplete; await sleep(60); await c.updateComplete;
+  const frame = () => sr().querySelector('.dtframe');
+  out.frameOnSelection = !!frame();
+  out.fourCornersAndRotate = !!frame()
+    && frame().querySelectorAll('.dthandle').length === 5
+    && !!frame().querySelector('.dtrot');
+
+  // --- визуал в 4 раза меньше, хит-зона прежняя (docs/LIVE-TEXT.md §3) ---
+  out.fiveVisibleKnobs = frame()?.querySelectorAll('.dtknob').length === 5;
+  const rOf = (sel) => { const e = frame()?.querySelector(sel); return e ? +e.getAttribute('r') : NaN; };
+  const hitR = rOf('.dthandle.dtrot');
+  const knobR = rOf('.dtknob');
+  const vw = c._viewOr(c._baseVb());
+  const expectHit = Math.max(vw.w, vw.h) * 0.018;
+  out.hitRadiusUnchanged = Math.abs(hitR - expectHit) < 0.1;       // прежние 1.8 %
+  out.knobIsAQuarterOfTheHit = Math.abs(knobR * 4 - hitR) / Math.max(hitR, 1e-9) < 0.05;
+  out.knobTakesNoPointer = getComputedStyle(frame().querySelector('.dtknob')).pointerEvents === 'none';
+  out.handleTakesThePointer = getComputedStyle(frame().querySelector('.dthandle')).pointerEvents !== 'none';
+  // …и палец, попавший МИМО бусины, но внутрь прежнего круга, всё ещё берёт ручку
+  const rotEl = frame().querySelector('.dtrot');
+  const rcx = +rotEl.getAttribute('cx'), rcy = +rotEl.getAttribute('cy');
+  const far = toScreen(rcx + hitR * 0.7, rcy);                     // > knobR, < hitR
+  const hitEl = sr().elementFromPoint(far.clientX, far.clientY);
+  out.fingerZoneStillCatchesTheHandle = !!hitEl?.classList?.contains?.('dthandle');
+  // линия использует общую рамку, но только с двумя ручками концов
+  c._curSpaceCfg.decor = [...c._decorList, { id: 'dline', kind: 'line',
+    x1: 0.1, y1: 0.8, x2: 0.4, y2: 0.8, color: '#000000', width: 3 }];
+  c._cfgEpoch++; c._decorSel = 'dline'; c.requestUpdate();
+  await c.updateComplete; await sleep(40); await c.updateComplete;
+  const lineFrame = sr().querySelector('.dtframe.dtlineframe');
+  out.lineGetsEndpointFrame = !!lineFrame
+    && lineFrame.querySelectorAll('.dthandle.dtendpoint').length === 2
+    && !lineFrame.querySelector('.dtrot');
+  c._decorSel = 'dtm'; c.requestUpdate();
+  await c.updateComplete; await sleep(60); await c.updateComplete;
+
+  // тянем угол: физический размер растёт пропорционально расстоянию от якоря
+  const anchor = () => {
+    const sh = c._decorList.find((x) => x.id === 'dtm');
+    return [sh.x * 1000, sh.y * 1000];
+  };
+  const [ax, ay2] = anchor();
+  const mediumSizeCm0 = c._decorTextSizeCm(c._decorList.find((x) => x.id === 'dtm'));
+  const corner = frame()?.querySelector('.dthandle.dt-nwse') || stageEl();
+  ev('pointerdown', corner, ax + 40, ay2);
+  out.dragStarted = !!c._dtDrag && c._dtDrag.kind === 'scale';
+  ev('pointermove', stageEl(), ax + 80, ay2);
+  await c.updateComplete;
+  const scaled = c._decorList.find((x) => x.id === 'dtm');
+  out.cornerStoresPhysicalSize = scaled.scale === undefined && scaled.size === undefined
+    && Math.abs((scaled.size_cm || 0) - mediumSizeCm0 * 2) < 0.01;
+  out.fontFollowsScale = +attr('dtm', 'font-size') === 40;
+  ev('pointerup', stageEl(), ax + 80, ay2);
+  out.dragEnded = !c._dtDrag;
+
+  // старый `size` становится физическим `size_cm` только после явной правки
+  c._decorSel = 'dtl'; c.requestUpdate();
+  await c.updateComplete; await sleep(60); await c.updateComplete;
+  const [lx, ly] = [c._decorList.find((x) => x.id === 'dtl').x * 1000,
+    c._decorList.find((x) => x.id === 'dtl').y * 1000];
+  const legacySizeCm0 = c._decorTextSizeCm(c._decorList.find((x) => x.id === 'dtl'));
+  ev('pointerdown', frame()?.querySelector('.dthandle.dt-nwse') || stageEl(), lx + 50, ly);
+  ev('pointermove', stageEl(), lx + 100, ly);
+  await c.updateComplete;
+  const grown = c._decorList.find((x) => x.id === 'dtl');
+  out.legacySizeBecomesPhysical = grown.size === undefined && grown.scale === undefined
+    && Math.abs((grown.size_cm || 0) - legacySizeCm0 * 2) < 0.01;
+  ev('pointerup', stageEl(), lx + 100, ly);
+
+  // ручка поворота: шаг 5°, Shift — мимо шага
+  c._decorSel = 'dtm'; c.requestUpdate();
+  await c.updateComplete; await sleep(60); await c.updateComplete;
+  const [rx, ry] = anchor();
+  const rot = frame()?.querySelector('.dthandle.dtrot') || stageEl();
+  ev('pointerdown', rot, rx + 100, ry);
+  out.rotateStarted = c._dtDrag?.kind === 'rotate';
+  ev('pointermove', stageEl(), rx + 100, ry + 100);   // ровно 45°
+  await c.updateComplete;
+  out.rotates = Math.abs((c._decorList.find((x) => x.id === 'dtm').angle || 0) - 45) < 1e-6;
+  ev('pointermove', stageEl(), rx + 100, ry + 2);     // ~1.1° → прилипает к 0
+  await c.updateComplete;
+  out.snapsTo5 = (c._decorList.find((x) => x.id === 'dtm').angle || 0) === 0;
+  ev('pointermove', stageEl(), rx + 100, ry + 2, { shiftKey: true });
+  await c.updateComplete;
+  const free = c._decorList.find((x) => x.id === 'dtm').angle;
+  out.shiftGoesFree = free > 0.5 && free < 5;   // тот же жест, но точный угол
+  ev('pointerup', stageEl(), rx + 100, ry + 2);
+  await c.updateComplete;
+  out.rotationRendered = /rotate\(/.test(attr('dtm', 'transform') || '');
+  // …а без Shift тот же 1.1° снова прилипает к нулю
+  // повернули обратно в ноль — поле исчезает, фигура снова «прямая»
+  ev('pointerdown', frame()?.querySelector('.dthandle.dtrot') || stageEl(), rx + 100, ry);
+  ev('pointermove', stageEl(), rx + 100, ry);
+  ev('pointerup', stageEl(), rx + 100, ry);
+  await c.updateComplete;
+  out.zeroAngleDropped = c._decorList.find((x) => x.id === 'dtm').angle === undefined;
+
+  // ================= 4. инструмент «текст» по надписи = редактировать =======
+  c._decorTool = 'text'; c._decorSel = null; c._decorTextDialog = null;
+  await c.updateComplete;
+  const before = c._decorList.length;
+  const target = c._decorList.find((x) => x.id === 'dtm');
+  out.labelIsLiveUnderTextTool = !!el('dtm') && getComputedStyle(el('dtm')).pointerEvents !== 'none';
+  out.chromiumTextUsesAtomicBoundingBox = getComputedStyle(el('dtm')).pointerEvents === 'bounding-box';
+  ev('pointerdown', el('dtm') || stageEl(), target.x * 1000, target.y * 1000);
+  await c.updateComplete;
+  out.textToolEditsTheLabel = c._decorTextDialog?.id === 'dtm'
+    && c._decorTextDialog.text === target.text;
+  out.textToolMakesNoSecondLabel = c._decorList.length === before;
+  out.textToolDoesNotSelect = c._decorSel === null;
+  c._decorTextDialog = null; await c.updateComplete;
+
+  // по пустому месту — новая надпись
+  ev('pointerdown', stageEl(), 60, 940);
+  await c.updateComplete;
+  out.textToolOnEmptyCreates = !!c._decorTextDialog && !c._decorTextDialog.id;
+  c._decorTextDialog = null; await c.updateComplete;
+
+  // по НЕтекстовой фигуре — тоже новая надпись: она осталась инертной
+  const lineEl = sr().querySelector('.decorlayer line.dshape');
+  out.lineStillInert = getComputedStyle(lineEl).pointerEvents === 'none';
+  ev('pointerdown', lineEl, 250, 800);
+  await c.updateComplete;
+  out.textToolOnAShapeCreates = !!c._decorTextDialog && !c._decorTextDialog.id
+    && c._decorSel === null;
+  c._decorTextDialog = null;
+  return out;
+});
+checkAll(res);
+await finish(browser, res);

demo/smoke_device_preview_parity.mjs

@@ -0,0 +1,60 @@
+// Shared face parity for the same live light on the full plan, the marker
+// editor preview and houseplan-space-card.
+import { launch, checkAll, finish } from './serve.mjs';
+
+const { page, browser } = await launch({ width: 1100, height: 900 }, 1);
+const res = await page.evaluate(async () => {
+  const c = window.__card;
+  const sr = () => c.shadowRoot || c.renderRoot;
+  const wait = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+  const face = (node) => {
+    if (!node) return null;
+    const semantic = ['on', 'open', 'alarm', 'unavail', 'valonly', 'activity-running', 'activity-event', 'activity-presence', 'activity-transition'];
+    return {
+      classes: semantic.filter((name) => node.classList.contains(name)),
+      icon: node.querySelector(':scope > ha-icon')?.getAttribute('icon') || '',
+      value: node.querySelector('.valtext')?.textContent?.trim() || '',
+      temp: node.querySelector('.tval')?.textContent?.trim() || '',
+      hum: node.querySelector('.hval')?.textContent?.trim() || '',
+      scale: node.style.getPropertyValue('--dev-scale'),
+      rippleScale: node.style.getPropertyValue('--ripple-scale'),
+      rippleColor: node.style.getPropertyValue('--ripple-color'),
+    };
+  };
+
+  c._setMode('view');
+  c.requestUpdate();
+  await c.updateComplete;
+  const planFace = face(sr().querySelector('.dev[data-id="d_light1"]'));
+
+  c._setMode('devices');
+  const device = c._devices.find((item) => item.id === 'd_light1');
+  c._openMarkerDialog(device);
+  await c.updateComplete;
+  const preview = sr().querySelector('hp-device-preview');
+  await preview?.updateComplete;
+  const previewFace = face(preview?.renderRoot?.querySelector('.dev'));
+  const providerShown = /demo/i.test(preview?.renderRoot?.querySelector('.previewfacts')?.textContent || '');
+
+  await customElements.whenDefined('houseplan-space-card');
+  const card = document.createElement('houseplan-space-card');
+  card.setConfig({ type: 'custom:houseplan-space-card', space: 'f1' });
+  card.hass = c.hass;
+  document.body.appendChild(card);
+  const started = Date.now();
+  while (!card.renderRoot?.querySelector('.hp-static-stage') && Date.now() - started < 6000) await wait(60);
+  await card.updateComplete;
+  const staticNode = card.renderRoot.querySelector('.dev[data-id="d_light1"]');
+  const staticFace = face(staticNode);
+
+  return {
+    allFacesPresent: !!planFace && !!previewFace && !!staticFace,
+    planPreviewEqual: JSON.stringify(planFace) === JSON.stringify(previewFace),
+    planStaticEqual: JSON.stringify(planFace) === JSON.stringify(staticFace),
+    providerShown,
+    staticBindingHook: staticNode?.getAttribute('data-binding-status') === 'active',
+  };
+});
+
+checkAll(res);
+await finish(browser, res);

demo/smoke_disabled_device.mjs

@@ -0,0 +1,70 @@
+// HA-disabled lifecycle: saved marker -> forced hidden -> service ghost and
+// blocked Show -> same marker restored after reactivation, without config writes.
+import { launch, checkAll, finish } from './serve.mjs';
+
+const { page, browser } = await launch({ width: 1000, height: 900 }, 1);
+const res = await page.evaluate(async () => {
+  const c = window.__card;
+  const sr = () => c.shadowRoot || c.renderRoot;
+  const wait = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+  const paint = async () => { c.requestUpdate(); await c.updateComplete; };
+
+  c._serverCfg = {
+    ...c._serverCfg,
+    markers: [
+      ...(c._serverCfg.markers || []).filter((marker) => marker.id !== 'd_light1'),
+      { id: 'd_light1', binding: 'device:d_light1' },
+    ],
+  };
+  c._cfgEpoch++;
+  c._regSignature = '';
+  c._maybeRebuildDevices();
+  c._setMode('view');
+  await paint();
+  const configBefore = JSON.stringify(c._serverCfg);
+  const layoutBefore = JSON.stringify(c._layout);
+  const visibleBefore = !!sr().querySelector('.dev[data-id="d_light1"]');
+
+  window.__setRegistryDisabled('device', 'd_light1', 'user');
+  c.hass = window.__mkHass();
+  await wait(220);
+  await paint();
+  const hiddenInView = !sr().querySelector('.dev[data-id="d_light1"]');
+
+  c._showHidden = true;
+  c._setMode('devices');
+  c._regSignature = '';
+  c._maybeRebuildDevices();
+  await paint();
+  const ghost = sr().querySelector('.dev[data-id="d_light1"][data-binding-status="ha-disabled"]');
+  const disabledDevice = c._devices.find((device) => device.id === 'd_light1');
+  c._openMarkerDialog(disabledDevice);
+  await paint();
+  const hiddenBeforeShow = c._markerDialog?.hideFromPlan;
+  c._toggleMarkerDialogVisibility();
+  await paint();
+  const showBlocked = /disabled|deactiv/i.test(c._toast)
+    && c._markerDialog?.hideFromPlan === hiddenBeforeShow
+    && sr().querySelector('.toast')?.getAttribute('role') === 'alert';
+  c._markerDialog = null;
+
+  window.__setRegistryDisabled('device', 'd_light1', null);
+  c.hass = window.__mkHass();
+  await wait(220);
+  c._showHidden = false;
+  c._setMode('view');
+  await paint();
+
+  return {
+    visibleBefore,
+    hiddenInView,
+    labelledGhost: !!ghost,
+    showBlocked,
+    restored: !!sr().querySelector('.dev[data-id="d_light1"]'),
+    configUnchanged: JSON.stringify(c._serverCfg) === configBefore,
+    layoutUnchanged: JSON.stringify(c._layout) === layoutBefore,
+  };
+});
+
+checkAll(res);
+await finish(browser, res);

demo/smoke_drag_bounds.mjs

@@ -110,14 +110,14 @@ const out = await page.evaluate(async () => {
   c._drag = null;
   o.garbageStillClamped = c._layout[dev2.id].x === 5000 && c._layout[dev2.id].y === 5000;
 
-  // ---- (f) Shift is the only way to land BETWEEN the nodes --------------
+  // ---- (f) Shift cannot land between the nodes ---------------------------
   const dev3 = c._devices.find((d) => d.id !== dev.id && d.id !== dev2.id && !d.virtual);
   const r0 = c._pos(dev3);
   const halfStep = NORM_W / 240 / 2;
   c._drag = { id: dev3.id, sx: 400, sy: 400, ox: r0.x, oy: r0.y, moved: false };
   c._pointerMove(mk(2.5 * NORM_W + halfStep - r0.x, 2.5 * NORM_W - r0.y, 400, 400, { shiftKey: true }), dev3);
   c._drag = null;
-  o.shiftPlacesBetweenTheNodes = !onGrid(c._layout[dev3.id].x);
+  o.shiftStillSnapsToTheNodes = onGrid(c._layout[dev3.id].x);
 
   c._setMode('view');
   return o;

demo/smoke_draw_wall_thickness.mjs

@@ -0,0 +1,101 @@
+/**
+ * Draw toolbar wall thickness (docs/WALL-THICKNESS.md §6): default 15 cm on
+ * commit, live preview, shared neighbour cm kept.
+ */
+import { launch, checkAll, finish } from './serve.mjs';
+const { page, browser } = await launch();
+
+const res = await page.evaluate(async () => {
+  const out = {};
+  const c = window.__card;
+  const sr = () => c.shadowRoot || c.renderRoot;
+  const upd = async () => { c._cfgEpoch++; c.requestUpdate(); await c.updateComplete; };
+  const sp = () => c._serverCfg.spaces.find((s) => s.id === c._space);
+
+  c._setMode('plan');
+  c._tool = 'draw';
+  await upd();
+  out.fieldDefault = c._drawWallFieldValue === '15' || c._drawWallFieldValue === '15.0';
+  const field = sr().querySelector('.editor-secondary.kind-tool .drawwall input');
+  out.fieldInContextTray = !!field;
+  out.fieldAbsentFromPrimaryBar = !sr().querySelector('.editbar .drawwall input');
+  out.fieldTrayIsStageOverlay = field?.closest('.editor-secondary-host')?.closest('.stage')
+    === sr().querySelector('.stage');
+  const wallsButton = sr().querySelector('.editbar button.on');
+  out.drawButtonNamedRoomOutline = ['Room outline', 'Контур комнаты']
+    .includes((wallsButton?.textContent || '').trim());
+
+  // draw a small room away from existing rooms (garden/demo f1 may have rooms)
+  // use empty space if available, else clear rooms on a copy path
+  const space = sp();
+  const savedRooms = JSON.parse(JSON.stringify(space.rooms || []));
+  const savedWalls = space.walls ? JSON.parse(JSON.stringify(space.walls)) : null;
+  space.rooms = [];
+  delete space.walls;
+  await upd();
+
+  const g = c._gridPitch;
+  // 4×4 cell square
+  const pts = [
+    [100, 100], [100 + 8 * g, 100], [100 + 8 * g, 100 + 8 * g], [100, 100 + 8 * g],
+  ];
+  c._path = [];
+  c._tool = 'draw';
+  for (const p of pts) {
+    c._path = [...c._path, p];
+    c._cursorPt = p;
+    await upd();
+  }
+  // close
+  c._path = [...c._path, pts[0]];
+  await upd();
+  out.previewWhileOpen = !!sr().querySelector('.drawwall-preview')
+    || c._drawWallCm === 15;
+  // force closed state if helper exists
+  if (!c._contourClosed) {
+    // last point equals first — _contourClosed should be true
+  }
+  out.contourClosed = !!c._contourClosed;
+  c._nameSel = 'ThickDraw';
+  c._areaSel = '';
+  c._commitRoom();
+  await upd();
+
+  out.roomSaved = (space.rooms || []).some((r) => r.name === 'ThickDraw');
+  out.wallsApplied = (space.walls || []).length >= 4
+    && (space.walls || []).every((w) => w.cm === 15);
+  out.bodyDrawn = sr().querySelectorAll('[data-hp="wall"]').length >= 1;
+
+  // second room sharing the right edge — neighbour keeps 15, new edges get 20
+  c._drawWallField = '20';
+  const r1 = space.rooms.find((r) => r.name === 'ThickDraw');
+  const poly = r1.poly.map((p) => [p[0] * 1000, p[1] * (c._spaceH || 1000)]);
+  // shared vertical: right edge of r1
+  const x1 = Math.max(...poly.map((p) => p[0]));
+  const y0 = Math.min(...poly.map((p) => p[1]));
+  const y1 = Math.max(...poly.map((p) => p[1]));
+  const w = 6 * g;
+  c._path = [
+    [x1, y0], [x1 + w, y0], [x1 + w, y1], [x1, y1], [x1, y0],
+  ];
+  await upd();
+  c._nameSel = 'Neighbour';
+  c._commitRoom();
+  await upd();
+
+  const sharedStill15 = (space.walls || []).some((w) => w.cm === 15);
+  const has20 = (space.walls || []).some((w) => w.cm === 20);
+  out.sharedKept = sharedStill15 && has20;
+
+  // restore demo space
+  space.rooms = savedRooms;
+  if (savedWalls) space.walls = savedWalls;
+  else delete space.walls;
+  c._path = [];
+  await upd();
+
+  return out;
+});
+
+checkAll(res);
+await finish(browser, res);

demo/smoke_editor_gestures.mjs

@@ -26,6 +26,75 @@ out.pinchZoomsInPlanEditor = await page.evaluate(() => {
   return zoomed && c._path.length === 0;
 });
 
+// A child control may stop pointer events before the stage sees the first
+// finger. The card-level capture guard must still classify the sequence as a
+// pinch and swallow WebKit's synthetic click before it reaches that control.
+out.pinchCannotMisclickInteractiveChild = await page.evaluate(async () => {
+  const c = window.__card;
+  c._setMode('view');
+  await c.updateComplete;
+  const stage = c._stageEl;
+  const probe = document.createElement('button');
+  let clicks = 0;
+  probe.addEventListener('pointerdown', (ev) => ev.stopPropagation());
+  probe.addEventListener('pointermove', (ev) => ev.stopPropagation());
+  probe.addEventListener('pointerup', (ev) => ev.stopPropagation());
+  probe.addEventListener('click', () => clicks++);
+  stage.appendChild(probe);
+  const pointer = (type, id, target, x = id === 51 ? 300 : 400) => target.dispatchEvent(new PointerEvent(type, {
+    bubbles: true, composed: true, pointerId: id, pointerType: 'touch',
+    clientX: x, clientY: 300,
+  }));
+  c._resetZoom();
+  const zoom0 = c._zoom;
+  pointer('pointerdown', 51, probe);
+  pointer('pointerdown', 52, stage);
+  pointer('pointermove', 51, probe, 250);
+  pointer('pointermove', 52, stage, 450);
+  const pinchZoomed = c._zoom > zoom0 * 1.5;
+  pointer('pointerup', 51, probe);
+  pointer('pointerup', 52, stage);
+  probe.dispatchEvent(new MouseEvent('click', { bubbles: true, composed: true, cancelable: true }));
+  const gestureClickBlocked = clicks === 0;
+  await new Promise((resolve) => setTimeout(resolve, 520));
+  probe.dispatchEvent(new MouseEvent('click', { bubbles: true, composed: true, cancelable: true }));
+  probe.remove();
+  const ordinaryTapStillWorks = clicks === 1;
+  c._setMode('plan');
+  await c.updateComplete;
+  return pinchZoomed && gestureClickBlocked && ordinaryTapStillWorks;
+});
+
+// Robot-map calibration owns the gesture surface. The card-level capture
+// guard must still suppress a two-finger misclick, but must not seed or apply
+// the plan's pinch zoom underneath the calibration overlay.
+out.pinchDoesNotZoomBelowVacuumFit = await page.evaluate(async () => {
+  const c = window.__card;
+  c._setMode('view');
+  await c.updateComplete;
+  const stage = c._stageEl;
+  const previousFit = c._vacFit;
+  c._vacFit = { markerId: 'smoke', source: 'smoke', mapId: 'smoke',
+    p: { ox: 0, oy: 0, k: 1, rot: 0, mir: false }, drag: null };
+  c._resetZoom();
+  const zoom0 = c._zoom;
+  const pointer = (type, id, x) => stage.dispatchEvent(new PointerEvent(type, {
+    bubbles: true, composed: true, pointerId: id, pointerType: 'touch',
+    clientX: x, clientY: 300,
+  }));
+  pointer('pointerdown', 61, 300);
+  pointer('pointerdown', 62, 400);
+  pointer('pointermove', 61, 250);
+  pointer('pointermove', 62, 450);
+  const stayed = c._zoom === zoom0 && c._pinchStart === null && c._pointers.size === 0;
+  pointer('pointerup', 61, 250);
+  pointer('pointerup', 62, 450);
+  c._vacFit = previousFit;
+  c._setMode('plan');
+  await c.updateComplete;
+  return stayed;
+});
+
 // --- пан одним пальцем в редакторе, точка не рисуется --------------------
 out.panWorksAndDoesNotDraw = await page.evaluate(async () => {
   const c = window.__card;

demo/smoke_editor_tabs.mjs

@@ -15,24 +15,209 @@ const res = await page.evaluate(async () => {
   out.planActive = c._mode === 'plan' && tabs()[0].classList.contains('active');
   out.planBar = !!sr().querySelector('.editbar');
   out.planBarClose = !!sr().querySelector('.editbar .barclose');
+  const barClose = sr().querySelector('.editbar .barclose');
+  const barCloseIcon = barClose?.querySelector('ha-icon');
+  const barCloseRect = barClose?.getBoundingClientRect();
+  const barCloseIconRect = barCloseIcon?.getBoundingClientRect();
+  out.planBarCloseIconIsCentered = !!barCloseRect && !!barCloseIconRect
+    && Math.abs((barCloseIconRect.left + barCloseIconRect.width / 2)
+      - (barCloseRect.left + barCloseRect.width / 2)) <= 1
+    && Math.abs((barCloseIconRect.top + barCloseIconRect.height / 2)
+      - (barCloseRect.top + barCloseRect.height / 2)) <= 1;
   out.tabCross = !!tabs()[0].querySelector('.closex');
   // 3) повторный клик по активной вкладке — ничего
   tabs()[0].click(); await c.updateComplete;
   out.reclickNoop = c._mode === 'plan';
+  // Let the View -> editor grid transition finish first. A real user cannot
+  // switch editors in the same zero-layout frame, and competing WAAPI/CSS
+  // height animations in that frame are intentionally suppressed.
+  await new Promise((resolve) => setTimeout(resolve, 220));
+  // HP-UX-11: transient tool controls live in a stage overlay. Opening the
+  // thickness controls must not resize/refit the stage or move pinned Close.
+  const stageBeforeContext = sr().querySelector('.stage').getBoundingClientRect();
+  const closeBeforeContext = sr().querySelector('.editbar .barclose').getBoundingClientRect();
+  const hdrBeforeContext = c._hdrH;
+  c._tool = 'draw'; c.requestUpdate(); await c.updateComplete;
+  await new Promise((resolve) => setTimeout(resolve, 40));
+  const stageWithContext = sr().querySelector('.stage').getBoundingClientRect();
+  const closeWithContext = sr().querySelector('.editbar .barclose').getBoundingClientRect();
+  const secondary = sr().querySelector('.editor-secondary-host.open .editor-secondary');
+  out.contextTrayLivesInStage = !!secondary
+    && secondary.closest('.stage') === sr().querySelector('.stage')
+    && !secondary.closest('.editorchrome');
+  out.contextDoesNotResizeStage = Math.abs(stageWithContext.top - stageBeforeContext.top) <= 1
+    && Math.abs(stageWithContext.height - stageBeforeContext.height) <= 1
+    && c._hdrH === hdrBeforeContext;
+  out.contextDoesNotMoveClose = Math.abs(closeWithContext.left - closeBeforeContext.left) <= 1
+    && Math.abs(closeWithContext.top - closeBeforeContext.top) <= 1;
+  out.closeHasPinnedEndCap = !!sr().querySelector('.editbar > .editbar-end > .barclose');
+  // No current tools are grouped automatically. Inject one declarative group
+  // to pin the generic launcher/keyboard/restore contract for future editors.
+  let groupInvokes = 0;
+  Object.defineProperty(c, '_editorToolbarGroups', { configurable: true, get: () => [{
+    id: 'smoke-group', label: 'Smoke group', icon: 'mdi:dots-grid', items: [{
+      id: 'smoke-command', label: 'Smoke command', icon: 'mdi:check',
+      role: 'command', invoke: () => { groupInvokes += 1; },
+    }],
+  }] });
+  c.requestUpdate(); await c.updateComplete;
+  const groupLauncher = sr().querySelector('[data-editor-group="smoke-group"]');
+  groupLauncher?.focus();
+  groupLauncher?.dispatchEvent(new KeyboardEvent('keydown', {
+    key: 'ArrowDown', bubbles: true, composed: true, cancelable: true,
+  }));
+  await c.updateComplete;
+  await new Promise((resolve) => requestAnimationFrame(resolve));
+  out.groupUsesSharedTray = !!sr().querySelector('.editor-secondary.kind-group')
+    && sr().querySelectorAll('.editor-secondary-host').length === 1;
+  out.groupArrowDownMovesFocus = sr().activeElement?.classList?.contains('editor-group-item') === true;
+  window.dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape' }));
+  await c.updateComplete;
+  await new Promise((resolve) => requestAnimationFrame(resolve));
+  out.groupEscapeRestoresToolContext = c._editorSecondary.hasOpenGroup === false
+    && !!sr().querySelector('.editor-secondary.kind-tool')
+    && sr().activeElement === groupLauncher;
+  groupLauncher?.click(); await c.updateComplete;
+  sr().querySelector('.editor-group-item')?.click(); await c.updateComplete;
+  out.groupCommandClosesBeforeInvoke = groupInvokes === 1
+    && c._editorSecondary.hasOpenGroup === false
+    && !!sr().querySelector('.editor-secondary.kind-tool');
+  groupLauncher?.click(); await c.updateComplete;
+  const outsideTool = document.createElement('button');
+  const unrelatedTool = document.createElement('button');
+  let outsideInvokes = 0;
+  let unrelatedInvokes = 0;
+  outsideTool.addEventListener('click', () => outsideInvokes++);
+  unrelatedTool.addEventListener('click', () => unrelatedInvokes++);
+  document.body.append(outsideTool, unrelatedTool);
+  outsideTool.dispatchEvent(new PointerEvent('pointerdown', {
+    pointerId: 301, pointerType: 'mouse', button: 0,
+    bubbles: true, composed: true, cancelable: true,
+  }));
+  outsideTool.dispatchEvent(new MouseEvent('click', {
+    button: 0, bubbles: true, composed: true, cancelable: true,
+  }));
+  unrelatedTool.click();
+  await c.updateComplete;
+  out.groupOutsideDismissIsConsumed = c._editorSecondary.hasOpenGroup === false
+    && outsideInvokes === 0 && c._tool === 'draw';
+  out.dismissTailDoesNotEatUnrelatedClick = unrelatedInvokes === 1;
+  outsideTool.remove();
+  unrelatedTool.remove();
+  delete c._editorToolbarGroups;
+  c._tool = 'select'; c.requestUpdate(); await c.updateComplete;
   // 4) прямое переключение План → Устройства
+  // Deliberately make the outgoing bar taller: the editor transition must
+  // interpolate real content height, not merely fade two equal-height rows.
+  const planBarBeforeSwap = sr().querySelector('.editorchrome .editbar');
+  planBarBeforeSwap.style.minHeight = `${planBarBeforeSwap.getBoundingClientRect().height + 36}px`;
   tabs()[1].click(); await c.updateComplete;
   out.directSwitch = c._mode === 'devices';
   out.devBar = !!sr().querySelector('.editbar.devbar');
   out.devBarBtns = sr().querySelectorAll('.editbar.devbar .btn:not(.barclose)').length === 3; // add/show-all/rules (v1.33.2: Reset removed)
+  const swapChrome = sr().querySelector('.editorchrome');
+  const swapInner = swapChrome.querySelector('.editorchrome-inner');
+  out.editorSwapAnimatesHeight = swapChrome.getAnimations()
+    .some((animation) => animation.id === 'hp-editor-height-swap');
+  out.editorSwapAnimatesContent = swapInner.getAnimations()
+    .some((animation) => animation.id === 'hp-editor-content-swap');
   // 5) инструменты устройств из шапки исчезли (в .bar их больше нет)
   out.headerCleanInDev = !sr().querySelector('.bar > .btn[title*="' + (c._t('title.add_device')) + '"]');
   // 6) крестик на панели → Просмотр
   sr().querySelector('.editbar .barclose').click(); await c.updateComplete;
-  out.barCloseWorks = c._mode === 'view' && !sr().querySelector('.editbar');
+  const chrome = sr().querySelector('.editorchrome');
+  out.barCloseStarts = c._mode === 'view' && !chrome.classList.contains('open')
+    && chrome.getAttribute('aria-hidden') === 'true';
+  // The last bar deliberately remains mounted while its grid row collapses.
+  await new Promise((resolve) => setTimeout(resolve, 220));
+  out.barCloseWorks = c._mode === 'view'
+    && getComputedStyle(chrome).visibility === 'hidden'
+    && chrome.getBoundingClientRect().height < 1;
   // 7) крестик в самой вкладке → Просмотр (и не переключает режим)
   tabs()[1].click(); await c.updateComplete;
   tabs()[1].querySelector('.closex').click(); await c.updateComplete;
   out.tabCrossWorks = c._mode === 'view';
+
+  // Layout-independent editor history: physical KeyZ works when `key` is the
+  // Russian «я», while an input keeps its native browser history.
+  tabs()[0].click(); await c.updateComplete;
+  c._tool = 'draw'; c.requestUpdate(); await c.updateComplete;
+  const realUndo = c._undoGeometry;
+  const realRedo = c._redoGeometry;
+  let undoCalls = 0;
+  let redoCalls = 0;
+  c._undoGeometry = () => { undoCalls += 1; };
+  c._redoGeometry = () => { redoCalls += 1; };
+  window.dispatchEvent(new KeyboardEvent('keydown', {
+    key: 'я', code: 'KeyZ', ctrlKey: true, bubbles: true, composed: true,
+  }));
+  out.layoutIndependentUndo = undoCalls === 1;
+  const editorInput = sr().querySelector('.editor-secondary input');
+  editorInput.dispatchEvent(new KeyboardEvent('keydown', {
+    key: 'я', code: 'KeyZ', ctrlKey: true, bubbles: true, composed: true,
+  }));
+  out.inputKeepsNativeUndo = undoCalls === 1;
+  // QWERTZ swaps the physical Y/Z codes. The labelled key wins when it is a
+  // Latin letter; otherwise both isZ/isY became true and Redo ran first.
+  window.dispatchEvent(new KeyboardEvent('keydown', {
+    key: 'z', code: 'KeyY', ctrlKey: true, bubbles: true, composed: true,
+  }));
+  out.qwertzCtrlZIsUndo = undoCalls === 2 && redoCalls === 0;
+  window.dispatchEvent(new KeyboardEvent('keydown', {
+    key: 'y', code: 'KeyZ', ctrlKey: true, bubbles: true, composed: true,
+  }));
+  out.qwertzCtrlYIsRedo = undoCalls === 2 && redoCalls === 1;
+  // On AZERTY the physical KeyZ carries W: Ctrl+W must remain the browser's
+  // close-tab shortcut, never an editor Undo.
+  window.dispatchEvent(new KeyboardEvent('keydown', {
+    key: 'w', code: 'KeyZ', ctrlKey: true, bubbles: true, composed: true,
+  }));
+  out.azertyCtrlWIsNotUndo = undoCalls === 2 && redoCalls === 1;
+  c._undoGeometry = realUndo;
+  c._redoGeometry = realRedo;
+
+  // Ctrl+click closes a valid draft without adding the click as a new point;
+  // the same gesture must refuse a draft with fewer than two existing edges.
+  const savedPath = c._path;
+  const savedRoomDialog = c._roomDialog;
+  const savedNameSel = c._nameSel;
+  const savedAreaSel = c._areaSel;
+  const ctrlClick = () => {
+    let prevented = false;
+    c._markupClick({
+      ctrlKey: true, metaKey: false, clientX: 0, clientY: 0,
+      preventDefault() { prevented = true; }, composedPath() { return []; },
+    });
+    return prevented;
+  };
+  c._tool = 'draw';
+  c._roomDialog = false;
+  c._path = [[-120, -120], [-80, -120]];
+  const shortBefore = JSON.stringify(c._path);
+  out.ctrlCloseRequiresTwoEdges = ctrlClick()
+    && !c._roomDialog && JSON.stringify(c._path) === shortBefore;
+  c._path = [[-120, -120], [-80, -120], [-80, -80]];
+  out.ctrlCloseValidContour = ctrlClick() && c._roomDialog
+    && c._path.length === 4
+    && c._path[0][0] === c._path[3][0] && c._path[0][1] === c._path[3][1];
+  await c.updateComplete;
+  const roomDialog = sr().querySelector('hp-dialog.roomdialog');
+  const roomBody = roomDialog?.querySelector('.body');
+  out.roomDialogUsesMediumWidth = roomDialog?.wide === true
+    && roomDialog.hasAttribute('wide');
+  out.roomDialogHasNoHorizontalScroll = !!roomBody
+    && roomBody.scrollWidth <= roomBody.clientWidth + 1;
+  c._nameSel = 'No-area room';
+  c._areaSel = '';
+  c.requestUpdate();
+  await c.updateComplete;
+  const noAreaSave = sr().querySelector('hp-dialog.roomdialog .room-save');
+  out.noAreaUsesRegularSave = !!noAreaSave && !noAreaSave.disabled
+    && sr().querySelectorAll('hp-dialog.roomdialog .room-save').length === 1;
+  c._path = savedPath;
+  c._roomDialog = savedRoomDialog;
+  c._nameSel = savedNameSel;
+  c._areaSel = savedAreaSel;
   return out;
 });
 // значения зафиксированы прогоном на v1.43.1 и сверены с кодом (audit T1)

demo/smoke_esc_dialogs.mjs

@@ -3,6 +3,45 @@ const { page, browser } = await launch();
 const res = await page.evaluate(async () => {
   const out = {};
   const c = window.__card;
+  const sr = c.shadowRoot || c.renderRoot;
+  const frame = () => new Promise((resolve) => requestAnimationFrame(resolve));
+  const deepActive = () => {
+    let active = document.activeElement;
+    while (active?.shadowRoot?.activeElement) active = active.shadowRoot.activeElement;
+    return active;
+  };
+
+  // A11Y-02: the shared native fallback carries the same modal/focus contract
+  // that ha-dialog supplies in Home Assistant.
+  const opener = document.createElement('button');
+  opener.textContent = 'open settings';
+  sr.append(opener);
+  opener.focus();
+  c._openSettingsDialog(); await c.updateComplete; await frame();
+  const hp = sr.querySelector('hp-dialog');
+  const native = hp?.shadowRoot?.querySelector('dialog');
+  const titleId = native?.getAttribute('aria-labelledby');
+  out.sharedShell = !!hp && !!native?.open;
+  out.modalSemantics = native?.getAttribute('role') === 'dialog'
+    && native?.getAttribute('aria-modal') === 'true'
+    && !!titleId && !!hp.shadowRoot.getElementById(titleId)?.textContent.trim();
+  let active = deepActive();
+  out.initialFocus = !!active && (hp.contains(active) || hp.shadowRoot.contains(active));
+  const focusable = [...hp.querySelectorAll('button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled])')];
+  const last = focusable.at(-1);
+  last?.focus();
+  last?.dispatchEvent(new KeyboardEvent('keydown', {
+    key: 'Tab', bubbles: true, composed: true, cancelable: true,
+  }));
+  active = deepActive();
+  out.focusTrap = active?.classList?.contains('close') === true;
+  active?.dispatchEvent(new KeyboardEvent('keydown', {
+    key: 'Escape', bubbles: true, composed: true, cancelable: true,
+  }));
+  await c.updateComplete; await frame();
+  out.restoreFocus = !c._settingsDialog && deepActive() === opener;
+  opener.remove();
+
   const esc = async () => { window.dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape' })); await c.updateComplete; };
   // общие настройки
   c._openSettingsDialog(); await c.updateComplete;

demo/smoke_font_scales.mjs

@@ -50,7 +50,7 @@ const res = await page.evaluate(async () => {
   // 5) превью есть и в диалоге пространства
   c._openSpaceDialog('edit', spId); await c.updateComplete;
   out.spacePreview = !!sr().querySelector('.cardpreview');
-  out.spaceSlider = [...sr().querySelectorAll('.dialog label')].some((l) => l.textContent === c._t('space.card_font'));
+  out.spaceSlider = [...sr().querySelectorAll('hp-dialog label')].some((l) => l.textContent === c._t('space.card_font'));
   c._spaceDialog = null; await c.updateComplete;
   return out;
 });

demo/smoke_free_walls.mjs

@@ -0,0 +1,98 @@
+// Browser contract for saved room drafts, independent partitions and columns.
+// This deliberately exercises the card's editor transactions rather than
+// injecting finished records: create, drag, edit and Delete must all pass
+// through the same paths a pointer/keyboard gesture uses.
+import { launch, checkAll, finish } from './serve.mjs';
+
+const { page, browser } = await launch({ width: 1000, height: 820 }, 1);
+
+const out = await page.evaluate(async () => {
+  const o = {};
+  const c = window.__card;
+  const PITCH = 1000 / 240;
+  window.confirm = () => true;
+  c._serverCfg = {
+    spaces: [{ id: 'physical', title: 'Physical', cell_cm: 5,
+      view_box: [0, 0, 1, 1], rooms: [] }],
+    markers: [], settings: {},
+  };
+  c._space = 'physical';
+  c._mode = 'plan';
+  c._modelCache = null;
+  // Keep the smoke local: editor transactions still mutate the real config,
+  // invalidate derived models and history, but do not need a websocket write.
+  c._saveConfig = () => { c._cfgEpoch++; c._modelCache = null; c.requestUpdate(); };
+  await c.updateComplete;
+
+  c._tool = 'partition';
+  c._drawWallField = '15';
+  c._partitionClick([100, 100], false);
+  c._partitionClick([300, 100], false);
+  let sp = c._serverCfg.spaces[0];
+  o.partitionCreated = sp.partitions?.length === 1 && sp.partitions[0].cm === 15;
+
+  c._tool = 'column';
+  c._drawWallField = '30';
+  c._columnClick([200, 200]);
+  sp = c._serverCfg.spaces[0];
+  o.columnCreatedSquare = sp.wall_columns?.length === 1
+    && sp.wall_columns[0].shape === 'square' && sp.wall_columns[0].cm === 30;
+
+  c._tool = 'draw';
+  c._drawWallField = '12';
+  c._path = [[100, 300], [200, 300]];
+  c._activeDraftId = null;
+  c._draftSegmentCms = [];
+  c._persistActiveDraftSegment();
+  sp = c._serverCfg.spaces[0];
+  o.draftPersistedImmediately = sp.room_drafts?.length === 1
+    && sp.room_drafts[0].segments[0].cm === 12;
+
+  // Endpoint-to-endpoint join is one atomic record: the active id survives
+  // and segment thickness follows geometric order.
+  sp.room_drafts = [
+    { id: 'join-a', points: [[0.1, 0.4], [0.3, 0.4]], segments: [{ cm: 10 }] },
+    { id: 'join-b', points: [[0.3, 0.4], [0.5, 0.4]], segments: [{ cm: 20 }] },
+  ];
+  c._modelCache = null;
+  c._activeDraftId = 'join-a';
+  c._path = [[100, 400], [300, 400]];
+  c._draftSegmentCms = [10];
+  const join = c._draftEndAt([300, 400], 'join-a');
+  if (join) c._mergeDraftEndpoint(join);
+  sp = c._serverCfg.spaces[0];
+  o.draftEndpointJoinIsAtomic = sp.room_drafts?.length === 1
+    && sp.room_drafts[0].id === 'join-a'
+    && JSON.stringify(sp.room_drafts[0].segments.map((segment) => segment.cm)) === '[10,20]';
+
+  const part = c._spaceModel().partitions[0];
+  c._physicalDrag = {
+    pid: 71, kind: 'partition', id: part.id, start: [...part.a],
+    startClient: [0, 0], before: c._geometrySnapshot(), moved: true,
+    base: JSON.parse(JSON.stringify(part)), delta: [PITCH, PITCH],
+  };
+  c._physicalUp(new PointerEvent('pointerup', { pointerId: 71, bubbles: true }));
+  sp = c._serverCfg.spaces[0];
+  o.partitionDragIsRigidAndGridBound = Math.abs(sp.partitions[0].a[0] - (0.1 + PITCH / 1000)) < 1e-9
+    && Math.abs((sp.partitions[0].b[0] - sp.partitions[0].a[0]) - 0.2) < 1e-9
+    && Math.abs(sp.partitions[0].a[1] - sp.partitions[0].b[1]) < 1e-9;
+
+  c._physicalSel = { kind: 'partition', id: sp.partitions[0].id };
+  c._deletePhysicalSelection();
+  o.deleteRemovesPartition = !c._serverCfg.spaces[0].partitions;
+
+  const draftId = c._serverCfg.spaces[0].room_drafts[0].id;
+  c._physicalSel = { kind: 'draft', id: draftId, segment: 0 };
+  c._deletePhysicalSelection();
+  o.deleteOnDraftRemovesWholeOutline = !c._serverCfg.spaces[0].room_drafts;
+
+  c._tool = 'partition';
+  c._drawWallField = '120';
+  c._partitionClick([400, 100], false);
+  c._partitionClick([500, 100], false);
+  o.invalidThicknessCreatesNothing = !c._serverCfg.spaces[0].partitions;
+
+  return o;
+});
+
+await finish(browser, checkAll(out));

demo/smoke_furniture.mjs

@@ -0,0 +1,316 @@
+// Библиотека мебели в декор-слое (docs/FURNITURE.md, задача владельца №2):
+//   1) в панели декора есть инструмент «Мебель», он открывает ПАЛИТРУ с
+//      обязательными группами (мебель / техника / сантехника) и превью;
+//   2) выбранный символ ставится кликом по плану в РЕАЛЬНОМ размере — через
+//      cell_cm пространства, и сразу оказывается выделенным в «выбрать»;
+//   3) поля ширины/глубины в палитре меняют размер ДО размещения;
+//   4) магнит к стене: предмет прижимается к ближайшей стене и доворачивается
+//      по ней; Shift не отключает обязательную привязку (docs/CANVAS.md §9.4);
+//   5) у выделенного предмета та же рамка, что у текстового блока, — угловые
+//      ручки (НЕзависимые ширина и глубина) и ручка поворота с шагом 5°;
+//   6) во время растягивания угла показываются живые плашки размеров;
+//   7) фигура пишется в конфиг и переживает пересборку, хуки card-mod на месте.
+// ПАДАЕТ на сборке до этой задачи: инструмента «Мебель» нет, палитры нет,
+// kind:'furniture' не рисуется, магнита и плашек не существует. Смок при этом
+// null-safe — он показывает СПИСОК провалов, а не одно исключение.
+import { launch, checkAll, finish } from './serve.mjs';
+const { page, browser } = await launch();
+const res = await page.evaluate(async () => {
+  const out = {};
+  const c = window.__card;
+  const sr = () => c.shadowRoot || c.renderRoot;
+  const sleep = (ms) => new Promise((r) => setTimeout(r, ms));
+  const stageEl = () => sr().querySelector('.stage');
+  const el = (id) => (id ? sr().querySelector(`.decorlayer [data-id="${id}"]`) : null);
+  const attr = (id, n) => { const e = el(id); return e ? e.getAttribute(n) : null; };
+  const toScreen = (x, y) => {
+    const r = stageEl().getBoundingClientRect();
+    const v = c._viewOr(c._baseVb());
+    return { clientX: r.left + ((x - v.x) / v.w) * r.width,
+      clientY: r.top + ((y - v.y) / v.h) * r.height };
+  };
+  const ev = (type, target, x, y, extra = {}) => {
+    // null-safe: на сборке ДО этой задачи фигуры нет вовсе, а значит нет и
+    // её координат — жест просто не происходит, и смок печатает список
+    // провалов вместо одного исключения
+    if (!target || !Number.isFinite(x) || !Number.isFinite(y)) return;
+    const { clientX, clientY } = toScreen(x, y);
+    target.dispatchEvent(new PointerEvent(type, { bubbles: true, composed: true,
+      cancelable: true, pointerId: 11, clientX, clientY, button: 0, isPrimary: true, ...extra }));
+  };
+  const PITCH = 1000 / 240;           // GRID_PITCH — одна клетка сетки
+  const CELL = 5;                     // cell_cm демо-пространства (по умолчанию)
+  const cmToUnits = (cm) => (cm / CELL) * PITCH;
+  const near = (a, b, tol) => Number.isFinite(a) && Number.isFinite(b) && Math.abs(a - b) <= tol;
+  const pe = (id) => { const e = el(id); return e ? getComputedStyle(e).pointerEvents : null; };
+
+  sr().querySelectorAll('.modetab')[2].click(); await c.updateComplete;
+  c._curSpaceCfg.decor = [];
+  c._decorTool = 'select'; c._decorSel = null; c._furnPalette = null;
+  c._cfgEpoch++; c.requestUpdate(); await c.updateComplete;
+  out.cellCmIsFive = c._cellCm === CELL;
+
+  // ================= 1. инструмент и палитра ==============================
+  const toolBtn = [...sr().querySelectorAll('.decorbar .dtool')]
+    .find((b) => /мебел|furnitur/i.test(b.textContent || ''));
+  out.furnitureToolInTheBar = !!toolBtn;
+  out.noPaletteBeforeTheTool = !sr().querySelector('.furnpalette');
+  if (toolBtn) toolBtn.click();
+  await c.updateComplete;
+  out.toolIsSelected = c._decorTool === 'furniture';
+  const pal = () => sr().querySelector('.furnpalette');
+  out.paletteOpens = !!pal();
+  const groups = [...(pal()?.querySelectorAll('.furngroup') || [])]
+    .map((g) => g.getAttribute('data-group'));
+  out.groupsArePresent = ['furniture', 'appliance', 'sanitary'].every((g) => groups.includes(g));
+  out.everyGroupHasSymbols = groups.length > 0 && [...pal().querySelectorAll('.furnrow')]
+    .every((r) => r.querySelectorAll('.furnitem').length > 0);
+  const item = (sym) => pal()?.querySelector(`.furnitem[data-symbol="${sym}"]`);
+  const pick = (sym) => { const b = item(sym); if (b) b.click(); };
+  out.sofaIsInThePalette = !!item('sofa');
+  out.toiletIsInThePalette = !!item('toilet');
+  out.washerIsInThePalette = !!item('washer');
+  const prevD = item('sofa')?.querySelector('svg.furnprev path')?.getAttribute('d') || '';
+  out.previewIsDrawn = prevD.length > 10;
+  const previewEl = item('sofa')?.querySelector('svg.furnprev');
+  const previewRect = previewEl?.getBoundingClientRect();
+  const itemRect = item('sofa')?.getBoundingClientRect();
+  out.previewStaysInsideItsButton = !!previewRect && !!itemRect
+    && getComputedStyle(previewEl).position !== 'absolute'
+    && previewRect.width <= 42 && previewRect.height <= 42
+    && previewRect.left >= itemRect.left - 1 && previewRect.right <= itemRect.right + 1
+    && previewRect.top >= itemRect.top - 1 && previewRect.bottom <= itemRect.bottom + 1;
+  out.namesAreLocalised = /\S/.test(item('sofa')?.querySelector('span')?.textContent || '');
+
+  // An unarmed explicit palette closes on the first press anywhere outside
+  // the card, consumes only that press/click pair, and returns to Select.
+  const outside = document.createElement('button');
+  const unrelated = document.createElement('button');
+  let outsideClicks = 0, unrelatedClicks = 0;
+  outside.addEventListener('click', () => outsideClicks++);
+  unrelated.addEventListener('click', () => unrelatedClicks++);
+  document.body.append(outside, unrelated);
+  outside.dispatchEvent(new PointerEvent('pointerdown', {
+    bubbles: true, composed: true, cancelable: true, pointerId: 71, pointerType: 'mouse',
+  }));
+  outside.dispatchEvent(new MouseEvent('click', { bubbles: true, composed: true, cancelable: true }));
+  unrelated.click();
+  await c.updateComplete;
+  out.paletteOutsideDismissIsConsumed = c._decorTool === 'select' && !pal() && outsideClicks === 0;
+  out.paletteDismissTailLeavesUnrelatedClick = unrelatedClicks === 1;
+  outside.remove(); unrelated.remove();
+  [...sr().querySelectorAll('.decorbar .dtool')]
+    .find((b) => /мебел|furnitur/i.test(b.textContent || ''))?.click();
+  await c.updateComplete;
+  out.paletteReopensAfterDismiss = c._decorTool === 'furniture' && !!pal();
+
+  // ================= 2. размер по умолчанию и поля =========================
+  pick('sofa'); await c.updateComplete;
+  out.pickArmsTheSymbol = c._furnPalette?.symbol === 'sofa';
+  out.defaultSizeIsTheSymbols = c._furnPalette?.w === 220 && c._furnPalette?.h === 90;
+  const wIn = () => pal()?.querySelector('input.furnw');
+  const hIn = () => pal()?.querySelector('input.furnh');
+  out.sizeFieldsAppear = !!wIn() && !!hIn();
+  out.fieldsShowMetres = +(wIn()?.value ?? NaN) === 2.2 && +(hIn()?.value ?? NaN) === 0.9;
+  out.selectedItemIsMarked = !!item('sofa')?.classList.contains('on');
+
+  // ================= 3. размещение в реальном размере ======================
+  // середина комнаты r1 (40..550 × 140..580) — до стен дальше порога магнита
+  ev('pointerdown', stageEl(), 300, 300);
+  await c.updateComplete;
+  const sofa = c._decorList.find((s) => s.kind === 'furniture');
+  const sofaId = sofa?.id ?? null;
+  const sofaNow = () => c._decorList.find((s) => s.id === sofaId) || {};
+  out.placedOnClick = sofa?.symbol === 'sofa';
+  out.realWidthThroughCellCm = near((sofa?.w ?? NaN) * 1000, cmToUnits(220), 1e-6);
+  out.realDepthThroughCellCm = near((sofa?.h ?? NaN) * 1000, cmToUnits(90), 1e-6);
+  out.centredOnTheClick = !!sofa
+    && near((sofa.x + sofa.w / 2) * 1000, 300, 1e-6)
+    && near((sofa.y + sofa.h / 2) * 1000, 300, 1e-6);
+  out.noAngleWhenStraight = !!sofa && sofa.angle === undefined;
+  out.selectedRightAway = !!sofaId && c._decorSel === sofaId;
+  out.toolWentBackToSelect = c._decorTool === 'select';
+  out.paletteDisarmed = c._furnPalette === null;
+  // …и она НАРИСОВАНА, со всеми хуками card-mod (docs/STYLING-HOOKS.md §3)
+  out.rendered = el(sofaId)?.tagName?.toLowerCase() === 'path';
+  out.hookHp = attr(sofaId, 'data-hp') === 'decor';
+  out.hookKind = attr(sofaId, 'data-kind') === 'furniture';
+  out.hookSymbol = attr(sofaId, 'data-symbol') === 'sofa';
+  out.strokedNotFilled = attr(sofaId, 'fill') === 'none'
+    && attr(sofaId, 'stroke') === c._decorStyle.color;
+  out.pathIsAtRealSize = /^M0 0H183\.333V75H0Z/.test(attr(sofaId, 'd') || '');
+
+  // ================= 4. свой размер до размещения ==========================
+  c._decorTool = 'furniture'; await c.updateComplete;
+  pick('toilet'); await c.updateComplete;
+  if (wIn()) {
+    wIn().value = '0.5';
+    wIn().dispatchEvent(new Event('input', { bubbles: true }));
+  }
+  await c.updateComplete;
+  out.fieldEditsTheArmedSize = Math.abs((c._furnPalette?.w ?? 0) - 50) < 1e-6;
+  ev('pointerdown', stageEl(), 300, 400);
+  await c.updateComplete;
+  const wc = c._decorList.find((s) => s.symbol === 'toilet');
+  out.typedSizeIsUsed = near((wc?.w ?? NaN) * 1000, cmToUnits(50), 1e-6)
+    && near((wc?.h ?? NaN) * 1000, cmToUnits(70), 1e-6);
+
+  // ================= 5. магнит к стене =====================================
+  c._decorTool = 'furniture'; await c.updateComplete;
+  pick('bed_double'); await c.updateComplete;
+  ev('pointerdown', stageEl(), 300, 150);           // 10 единиц от стены y=140
+  await c.updateComplete;
+  const bed = c._decorList.find((s) => s.symbol === 'bed_double');
+  const depth = cmToUnits(200);
+  out.wallMagnetPullsItFlat = !!bed
+    && near((bed.y + bed.h / 2) * 1000, 140 + depth / 2, 1e-6);
+  out.wallMagnetKeepsTheAngle = !!bed && (bed.angle || 0) === 0;   // стена горизонтальна
+  out.wallMagnetQuantisesAlongTheWall = !!bed
+    && Math.abs((bed.x + bed.w / 2) * 1000 - 300) <= PITCH + 1e-6;
+
+  // …Shift больше не отключает магнит
+  c._decorTool = 'furniture'; await c.updateComplete;
+  pick('bed_single'); await c.updateComplete;
+  ev('pointerdown', stageEl(), 301.7, 151.3, { shiftKey: true });
+  await c.updateComplete;
+  const free = c._decorList.find((s) => s.symbol === 'bed_single');
+  out.shiftKeepsTheMagnet = !!free
+    && !near((free.y + free.h / 2) * 1000, 151.3, 1e-6)
+    && free.angle === undefined;
+
+  // …магнит работает и при ПЕРЕТАСКИВАНИИ: тянем диван к левой стене (x=40)
+  c._decorTool = 'select'; c._decorSel = sofaId; c.requestUpdate();
+  await c.updateComplete; await sleep(40); await c.updateComplete;
+  ev('pointerdown', el(sofaId), 300, 300);
+  out.dragStarted = !!sofaId && c._decorMove?.id === sofaId;
+  ev('pointermove', stageEl(), 55, 300);            // 15 единиц от стены x=40
+  await c.updateComplete;
+  const pulled = sofaNow();
+  out.dragMagnetTurnsItToTheWall = Math.abs(Math.abs(pulled.angle || 0) - 90) < 1e-6;
+  out.dragMagnetPressesTheBack =
+    near((pulled.x + pulled.w / 2) * 1000, 40 + cmToUnits(90) / 2, 1e-6);
+  ev('pointermove', stageEl(), 300, 300, { shiftKey: true });
+  await c.updateComplete;
+  const shiftDragGridIndex = (sofaNow().x * 1000) / PITCH;
+  out.shiftDragRemainsGridBound = near(shiftDragGridIndex, Math.round(shiftDragGridIndex), 1e-6);
+  ev('pointerup', stageEl(), 300, 300, { shiftKey: true });
+  await c.updateComplete;
+
+  // ================= 6. рамка, углы, плашки, поворот =======================
+  c._decorSel = sofaId; c.requestUpdate();
+  await c.updateComplete; await sleep(60); await c.updateComplete;
+  const frame = () => sr().querySelector('.dtframe');
+  out.frameOnSelection = !!frame();
+  out.sameFrameAsTheTextBlock = !!frame()
+    && frame().querySelectorAll('.dthandle').length === 5
+    && frame().querySelectorAll('.dtknob').length === 5
+    && !!frame().querySelector('.dtrot');
+  const rOf = (sel) => { const e = frame()?.querySelector(sel); return e ? +e.getAttribute('r') : NaN; };
+  out.handleSizeIsTheTaskOneSize = Math.abs(rOf('.dtknob') * 4 - rOf('.dthandle.dtrot'))
+    / Math.max(rOf('.dthandle.dtrot'), 1e-9) < 0.05;
+  out.frameBoxIsTheShapeBox = !!c._dtBox
+    && near(c._dtBox.w, sofaNow().w * 1000, 1e-6)
+    && near(c._dtBox.h, sofaNow().h * 1000, 1e-6);
+
+  // угол: НЕзависимые ширина и глубина + живые плашки
+  const before = { w: sofaNow().w, h: sofaNow().h };
+  const b = c._dtBox || { x: 0, y: 0, w: 0, h: 0 };
+  const handles = [...(frame()?.querySelectorAll('.dthandle') || [])];
+  const se = handles[3] || stageEl();                       // SE — четвёртый угол
+  ev('pointerdown', se, b.x + b.w, b.y + b.h);
+  out.cornerDragStarted = c._dtDrag?.kind === 'scale' && !!c._dtDrag?.orig;
+  ev('pointermove', stageEl(), b.x + b.w + 100, b.y + b.h + 20, { shiftKey: true });
+  await c.updateComplete;
+  const grown = sofaNow();
+  out.cornerGrowsTheWidth = grown.w > before.w && near(grown.w * 1000, b.w + 100, 1e-6);
+  out.cornerGrowsTheDepthINDEPENDENTLY = grown.h > before.h
+    && near(((grown.h * 1000) / PITCH) % 1, 0, 1e-6);
+  out.oppositeCornerStaysPut = near(grown.x * 1000, b.x, 1e-6) && near(grown.y * 1000, b.y, 1e-6);
+  const plates = [...sr().querySelectorAll('.measurelabel.furnmeasure')];
+  out.twoLivePlates = plates.length === 2;
+  out.platesShowRealLengths = plates.length === 2
+    && plates.every((p) => /\d/.test(p.textContent))
+    && plates.some((p) => /m|м|′/.test(p.textContent));
+  // …и без Shift размер прилипает к сетке
+  ev('pointermove', stageEl(), b.x + b.w + 101.7, b.y + b.h + 21.3);
+  await c.updateComplete;
+  const snapped = sofaNow();
+  const wCells = (snapped.w * 1000) / PITCH;
+  const hCells = (snapped.h * 1000) / PITCH;
+  // Normalised config is rounded to six decimals, so a mathematical cell 27
+  // may read back as 26.9999999. Compare with the nearest integer, not `% 1`.
+  out.sizeSnapsToTheGrid = near(wCells, Math.round(wCells), 1e-4)
+    && near(hCells, Math.round(hCells), 1e-4);
+  ev('pointerup', stageEl(), b.x + b.w + 101.7, b.y + b.h + 21.3);
+  await c.updateComplete;
+  out.cornerDragEnded = !c._dtDrag;
+  out.noPlatesAfterTheDrag = !sr().querySelector('.measurelabel.furnmeasure');
+
+  // поворот: шаг 5°, Shift мимо шага — та же механика, что у текста
+  await sleep(40); await c.updateComplete;
+  const cx = (sofaNow().x + sofaNow().w / 2) * 1000;
+  const cy = (sofaNow().y + sofaNow().h / 2) * 1000;
+  const piv = c._dtPivot ? c._dtPivot(sofaNow()) : [NaN, NaN];
+  out.rotatesAboutTheCENTRE = near(piv[0], cx, 1e-6) && near(piv[1], cy, 1e-6);
+  ev('pointerdown', frame()?.querySelector('.dthandle.dtrot'), cx + 100, cy);
+  out.rotateStarted = c._dtDrag?.kind === 'rotate';
+  ev('pointermove', stageEl(), cx + 100, cy + 100);        // ровно 45°
+  await c.updateComplete;
+  out.rotates45 = near(sofaNow().angle || 0, 45, 1e-6);
+  ev('pointermove', stageEl(), cx + 100, cy + 2);          // ~1.1° → липнет к 0
+  await c.updateComplete;
+  out.snapsTo5 = (sofaNow().angle || 0) === 0;
+  ev('pointermove', stageEl(), cx + 100, cy + 2, { shiftKey: true });
+  await c.updateComplete;
+  const fine = sofaNow().angle;
+  out.shiftGoesPastTheStep = fine > 0.5 && fine < 5;
+  ev('pointerup', stageEl(), cx + 100, cy + 2, { shiftKey: true });
+  await c.updateComplete;
+  out.rotationIsRendered = /rotate\(/.test(attr(sofaId, 'transform') || '');
+
+  // ================= 7. конфиг и пересборка ================================
+  const stored = JSON.parse(JSON.stringify(sofaNow()));
+  out.storedShapeIsComplete = stored.kind === 'furniture' && typeof stored.symbol === 'string'
+    && ['x', 'y', 'w', 'h'].every((k) => Number.isFinite(stored[k]));
+  c.hass = { ...c.hass };                                   // полная пересборка
+  c._cfgEpoch++; c.requestUpdate();
+  await c.updateComplete; await sleep(40); await c.updateComplete;
+  const after = sofaNow();
+  out.survivesARebuild = after.symbol === stored.symbol
+    && near(after.w, stored.w, 1e-12) && near(after.h, stored.h, 1e-12)
+    && near(after.x, stored.x, 1e-12) && near(after.y, stored.y, 1e-12);
+  out.stillRenderedAfterRebuild = !!el(sofaId);
+  c._decorTool = 'select';
+  c._decorShapeDbl({ preventDefault() {}, stopPropagation() {} }, after);
+  await c.updateComplete;
+  out.objectDialogSelectsStoredSymbol = sr().querySelector(
+    '.body select.namein option:checked',
+  )?.value === stored.symbol;
+  c._decorShapeDialog = null;
+
+  // ================= 8. инертность и удаление ==============================
+  c._decorTool = 'furniture'; c._furnPalette = null; await c.updateComplete;
+  out.inertUnderTheStamp = pe(sofaId) === 'none';
+  const n0 = c._decorList.length;
+  ev('pointerdown', stageEl(), 320, 320);                   // символ НЕ выбран
+  await c.updateComplete;
+  out.noSymbolNoStamp = c._decorList.length === n0;
+  out.unarmedCanvasDismissReturnsToSelect = c._decorTool === 'select' && !pal();
+  out.unarmedCanvasDismissLeavesNoClickSuppression = c._suppressClick === false;
+  c._decorTool = 'erase'; await c.updateComplete;
+  ev('pointerdown', el(sofaId), 300, 300);
+  await c.updateComplete;
+  // Eraser is intentionally two-step now; the generic decor smoke verifies
+  // the dialog itself, while this furniture scenario confirms the action.
+  c._confirmDecorErase();
+  await c.updateComplete;
+  out.eraseRemovesIt = !!sofaId && !c._decorList.some((s) => s.id === sofaId);
+  // а в режиме просмотра мебель видна и не кликается
+  c._setMode('view'); await c.updateComplete; await sleep(30);
+  const left = c._decorList.find((s) => s.kind === 'furniture');
+  out.visibleInView = !!left && !!el(left.id);
+  out.inertInView = !!left && pe(left.id) === 'none';
+  return out;
+});
+checkAll(res);
+await finish(browser, res);

demo/smoke_gear_tabs.mjs

@@ -1,4 +1,4 @@
-import { launch, checkAll, finish } from './serve.mjs';
+import { launch, check, checkAll, finish } from './serve.mjs';
 const { page, browser } = await launch();
 const res = await page.evaluate(async () => {
   const out = {};
@@ -25,14 +25,78 @@ const res = await page.evaluate(async () => {
   out.dialogOpens = !!c._spaceDialog;
   out.tabNotSwitched = c._space === cur;
   c._spaceDialog = null; await c.updateComplete;
-  // кнопка "+" по-прежнему только в Плане
-  out.noAddInView = !sr().querySelector('.tab.tabadd');
-  c._setMode('plan'); await c.updateComplete;
-  out.addInPlan = !!sr().querySelector('.tab.tabadd');
+  // «+» — навигационное действие, а не инструмент редактора плана
+  // (владелец 2026-08-04): кнопка есть во ВСЕХ режимах и кликабельна.
+  const addBtn = () => sr().querySelector('.tab.tabadd');
+  const hittable = () => {
+    const b = addBtn();
+    if (!b) return 'нет кнопки';
+    const r = b.getBoundingClientRect();
+    if (r.width < 8 || r.height < 8) return `кнопка ${r.width}x${r.height}px`;
+    const hit = sr().elementFromPoint(r.left + r.width / 2, r.top + r.height / 2);
+    return hit && hit.closest && hit.closest('.tab.tabadd') === b ? true : 'перекрыта';
+  };
+  out.addInView = hittable();
+  for (const m of ['plan', 'devices', 'decor']) {
+    c._setMode(m); await c.updateComplete;
+    out['addIn_' + m] = hittable();
+  }
+  c._setMode('view'); await c.updateComplete;
+  // …и открывает именно диалог СОЗДАНИЯ
+  const b0 = addBtn();
+  if (b0) { b0.click(); await c.updateComplete; }
+  out.addOpensCreate = !!c._spaceDialog && c._spaceDialog.mode === 'create';
+  c._spaceDialog = null; await c.updateComplete;
   return out;
 });
 // значения зафиксированы прогоном на v1.43.1 и сверены с кодом (audit T1)
 checkAll(res, {
   "alignDelta": 0,
 });
-await finish(browser, res);
+
+// киоск — витрина: редактирование недоступно, кнопки «+» нет ВООБЩЕ
+// (display:none у .hdr не считается: скрытый в DOM узел всё ещё кликабелен
+// программно и всё ещё ловится автотестами как «есть»)
+const kio = await page.evaluate(async () => {
+  const out = {};
+  const c = document.createElement('houseplan-card');
+  c.setConfig({ type: 'custom:houseplan-card', kiosk: true, cycle: 0 });
+  c.hass = window.__mkHass();
+  c.style.cssText = 'position:fixed;left:0;top:0;width:900px;height:700px;z-index:99';
+  document.body.appendChild(c);
+  await new Promise((r) => setTimeout(r, 350));
+  c.hass = { ...c.hass }; await c.updateComplete;
+  const sr = c.shadowRoot || c.renderRoot;
+  out.kioskNoAddButton = !sr.querySelector('.tab.tabadd');
+  c.remove();
+  return out;
+});
+for (const [k, v] of Object.entries(kio)) check(k, v);
+
+// мобильный вид: ряд вкладок переносится, а не выезжает за карточку
+await page.setViewportSize({ width: 390, height: 760 });
+const narrow = await page.evaluate(async () => {
+  const out = {};
+  const c = window.__card;
+  await new Promise((r) => setTimeout(r, 250));
+  c.requestUpdate(); await c.updateComplete;
+  const sr = c.shadowRoot || c.renderRoot;
+  const head = sr.querySelector('.head');
+  const btn = sr.querySelector('.tab.tabadd');
+  out.narrowAddPresent = !!btn;
+  out.narrowNoHOverflow = head.scrollWidth <= head.clientWidth + 1
+    ? true : `scrollW=${head.scrollWidth} > clientW=${head.clientWidth}`;
+  const cr = sr.querySelector('ha-card').getBoundingClientRect();
+  const br = btn ? btn.getBoundingClientRect() : null;
+  out.narrowAddInsideCard = !br ? 'нет кнопки'
+    : br.right <= cr.right + 1 && br.left >= cr.left - 1 ? true
+    : `btn ${Math.round(br.left)}..${Math.round(br.right)} vs card ${Math.round(cr.left)}..${Math.round(cr.right)}`;
+  out.narrowAddHittable = !br ? 'нет кнопки' : (() => {
+    const hit = sr.elementFromPoint(br.left + br.width / 2, br.top + br.height / 2);
+    return hit && hit.closest && hit.closest('.tab.tabadd') === btn ? true : 'перекрыта';
+  })();
+  return out;
+});
+for (const [k, v] of Object.entries(narrow)) check(k, v);
+
+await finish(browser, { ...res, ...kio, ...narrow });

demo/smoke_general_settings.mjs

@@ -8,10 +8,10 @@ const res = await page.evaluate(async () => {
   // 1) диалог общих настроек: инвентарь строк и групп (обновлён фичей «Солнце»)
   c._openSettingsDialog(); await c.updateComplete;
   out.rows = sr().querySelectorAll('.gsrow').length;
-  out.groups = [...sr().querySelectorAll('.dialog .dispsection')].map((l) => l.textContent.trim());
+  out.groups = [...sr().querySelectorAll('hp-dialog .dispsection')].map((l) => l.textContent.trim());
   // 1b) блок About: версия + две внешние ссылки (target=_blank rel=noopener)
-  out.aboutVersion = sr().querySelector('.dialog .aboutver')?.textContent.trim() ?? null;
-  out.aboutLinks = [...sr().querySelectorAll('.dialog a.aboutlink')].map((a) => ({
+  out.aboutVersion = sr().querySelector('hp-dialog .aboutver')?.textContent.trim() ?? null;
+  out.aboutLinks = [...sr().querySelectorAll('hp-dialog a.aboutlink')].map((a) => ({
     href: a.getAttribute('href'), target: a.getAttribute('target'), rel: a.getAttribute('rel') }));
   // 2) сменить цвет light_on и сохранить
   c._setFillColor('light_on', { c: '#ff00ff', a: 0.5 });
@@ -21,8 +21,11 @@ const res = await page.evaluate(async () => {
   c._serverCfg = { ...c._serverCfg, spaces: c._serverCfg.spaces.map((s) => s.id !== 'f1' ? s : ({ ...s,
     settings: { ...(s.settings||{}), show_borders: true, fill_mode: 'light' } })) };
   c.requestUpdate(); await c.updateComplete;
-  const styles = [...sr().querySelectorAll('.room.styled')].map((r) => r.getAttribute('style') || '');
-  out.customFillUsed = styles.some((st) => st.includes('#ff00ff') && st.includes('0.500'));
+  const styledRooms = [...sr().querySelectorAll('.room.styled')];
+  out.customFillUsed = styledRooms.some((room) => (
+    room.style.getPropertyValue('--room-fill').trim() === '#ff00ff'
+    && Math.abs(Number(room.style.getPropertyValue('--room-fill-op')) - 0.5) < 1e-9
+  ));
   // 4) show_lqi=false у пространства скрывает LQI-бейджи
   out.lqiBefore = sr().querySelectorAll('.dev .lqi').length;
   c._serverCfg = { ...c._serverCfg, spaces: c._serverCfg.spaces.map((s) => s.id !== 'f1' ? s : ({ ...s,
@@ -42,9 +45,9 @@ const BUNDLE_VERSION = m?.[1] ?? (m?.[2] && bundle.match(new RegExp(`[^\\w$]${m[
 check('bundleVersionFound', typeof BUNDLE_VERSION === 'string' && BUNDLE_VERSION.length > 0);
 // значения зафиксированы прогоном на v1.43.1 и сверены с кодом (audit T1)
 checkAll(res, {
-  "rows": 15, // 10 цветов + радиус свечения + режим фона + цвет фона + погода (docs/SUN.md)
-              // + «Выровнять всё по сетке» (docs/CANVAS.md §9)
-  "groups": ["Fill: lights", "Fill: temperature", "Fill: zigbee signal", "Light-sources fill", "Stage background", "Sun", "Grid", "About"],
+  "rows": 15, // 11 цветов (включая wall_fill) + радиус свечения + фон
+               // + «Оптимизировать планы» (docs/CANVAS.md §9)
+  "groups": ["Fill: lights", "Fill: temperature", "Fill: zigbee signal", "Light-sources fill", "Walls", "Stage background", "Sun", "Plan maintenance", "About"],
   "aboutVersion": `Houseplan Card v${BUNDLE_VERSION}`, // та же константа, что в баннере
   "aboutLinks": [
     { "href": "https://github.com/Matysh/houseplan-card", "target": "_blank", "rel": "noopener" },

demo/smoke_grid_snap.mjs

@@ -1,10 +1,12 @@
 // «Всё строго по сетке» (docs/CANVAS.md §9). Two halves:
 //   1. every element placed or dragged by hand lands on a node — devices, room
 //      labels, decor, room vertices, resize handles; an opening lands ON ITS
-//      WALL at a whole number of steps along it; Shift is the only way out;
-//   2. the explicit «Выровнять всё по сетке» action moves a deliberately
-//      detuned plan onto the grid, tells the truth about how much it moves,
-//      and does nothing at all the second time.
+//      WALL at a whole number of steps along it; positional off-grid placement
+//      is not supported. Shift keeps the room-outline point on the grid while
+//      additionally constraining its wall to the nearest 45° direction;
+//   2. the explicit «Оптимизировать планы» action moves a deliberately
+//      detuned plan onto the grid through one atomic config+layout commit,
+//      tells the truth about how much it moves, and is idempotent.
 import { launch, checkAll, finish } from './serve.mjs';
 
 const { page, browser } = await launch({ width: 900, height: 820 }, 1);
@@ -34,7 +36,7 @@ const out = await page.evaluate(async () => {
   const s1 = c._snap([100 + OFF, 200 + OFF]);
   o.snapRoundsToTheNode = onGridR(s1[0]) && onGridR(s1[1]);
   const s2 = c._snap([100 + OFF, 200 + OFF], { shiftKey: true });
-  o.shiftSuspendsTheSnap = !onGridR(s2[0]);
+  o.shiftCannotSuspendTheSnap = onGridR(s2[0]) && onGridR(s2[1]);
   o.snapAlsoClampsTheGarbage = c._snap([1e12, -1e12])[0] === 5000 * NORM_W;
   // the step is NORM_W/GRID_N and nothing else — it did NOT change with the
   // infinite canvas, so no plan's nodes ever moved out from under it
@@ -145,9 +147,16 @@ const out = await page.evaluate(async () => {
   c._tool = 'draw'; c._path = [];
   c._markupClick(at(220 + OFF, 220 + OFF, 'click'));
   o.roomVertexOnANode = c._path.length === 1 && onGridR(c._path[0][0]) && onGridR(c._path[0][1]);
+  c._path = [[200, 200]];
+  c._markupClick(at(240 + OFF, 310 + OFF, 'click', { shiftKey: true }));
+  const locked = c._path[1];
+  const ldx = Math.abs(locked[0] - 200), ldy = Math.abs(locked[1] - 200);
+  o.shiftLocksRoomWallTo45 = c._path.length === 2
+    && (ldx < 1e-7 || ldy < 1e-7 || Math.abs(ldx - ldy) < 1e-7)
+    && onGridR(locked[0]) && onGridR(locked[1]);
   c._path = []; c._tool = 'draw';
 
-  // ---- 2) «Выровнять всё по сетке» --------------------------------------
+  // ---- 2) «Оптимизировать планы» -----------------------------------------
   c._setMode('view'); await c.updateComplete;
   // a deliberately detuned fixture: a third of a step off, everywhere
   const D = 1 / GRID_N / 3;
@@ -170,11 +179,11 @@ const out = await page.evaluate(async () => {
   c._openAlignDialog();
   await c.updateComplete;
   const dlg = c._alignDialog;
-  o.alignDialogOpens = !!dlg && !!sr().querySelector('.dialogwrap .alignmsg');
+  o.alignDialogOpens = !!dlg && !!sr().querySelector('hp-dialog .alignmsg');
   o.alignCountsWhatMoves = !!dlg && dlg.report.moved > 0 && dlg.report.moved <= dlg.report.total;
   // half a step of 5 cm cells ≈ 2.5 cm; a third of a step is well under that
   o.alignPromisesASmallShift = !!dlg && dlg.cm > 0 && dlg.cm < 3;
-  o.alignWarnsAboutNoUndo = (sr().querySelector('.dialogwrap .rhint')?.textContent || '').length > 20;
+  o.alignExplainsSafeUndo = (sr().querySelector('hp-dialog .rhint')?.textContent || '').length > 20;
 
   // capture what the network is told, then run it
   const sent = [];
@@ -183,8 +192,7 @@ const out = await page.evaluate(async () => {
   await c._runAlignToGrid();
   await c.updateComplete;
   o.alignDialogClosed = c._alignDialog === null;
-  o.alignWroteConfigOnce = sent.filter((t) => t === 'houseplan/config/set').length === 1;
-  o.alignWroteLayout = sent.some((t) => t === 'houseplan/layout/update');
+  o.alignUsedAtomicConfigLayoutWrite = sent.filter((t) => t === 'houseplan/plan/optimize').length === 1;
 
   const g = c._serverCfg.spaces[0];
   o.alignedRoomPoly = g.rooms[0].poly.every((p) => onGridN(p[0]) && onGridN(p[1]));
@@ -204,7 +212,7 @@ const out = await page.evaluate(async () => {
   c._openAlignDialog();
   await c.updateComplete;
   o.secondRunMovesNothing = c._alignDialog.report.moved === 0;
-  o.secondRunOffersNoButton = !sr().querySelector('.dialogwrap .btn.on');
+  o.secondRunOffersNoButton = !sr().querySelector('hp-dialog .btn.on');
   c._alignDialog = null;
   await c.updateComplete;
 
@@ -228,7 +236,7 @@ const out = await page.evaluate(async () => {
   const md = c._alignDialog;
   o.alignPromiseUsesTheOwnScaleOfEachSpace = !!md && md.cm >= 50 && md.cm < 51;
   o.alignPromiseNamesTheSpaceItBelongsTo = !!md && md.where === 'Attic'
-    && (sr().querySelector('.dialogwrap .body')?.textContent || '').includes('Attic');
+    && (sr().querySelector('hp-dialog .body')?.textContent || '').includes('Attic');
   c._alignDialog = null; await c.updateComplete;
 
   // ---- 2d) an angle-only opening fix is offerable (AUD-158B1-02) --------
@@ -246,7 +254,7 @@ const out = await page.evaluate(async () => {
   c._openAlignDialog(); await c.updateComplete;
   const ad = c._alignDialog;
   o.angleOnlyOpeningCounts = !!ad && ad.report.moved === 1 && ad.report.rotated === 1;
-  o.angleOnlyOpeningOffersTheButton = !!sr().querySelector('.dialogwrap .btn.on');
+  o.angleOnlyOpeningOffersTheButton = !!sr().querySelector('hp-dialog .btn.on');
   await c._runAlignToGrid();
   await c.updateComplete;
   o.angleOnlyOpeningIsActuallyFixed = c._serverCfg.spaces[0].openings[0].angle === 0;

demo/smoke_ha_controls.mjs

@@ -14,9 +14,9 @@ const res = await page.evaluate(async () => {
 
   // --- 1) fallback branch: no ha-* registered -> classic inputs ----------
   c._openMarkerDialog(c._devices[0]); await c.updateComplete;
-  out.fallbackCheckbox = !!sr().querySelector('.dialog .srcrow input[type=checkbox]');
-  out.fallbackRange = !!sr().querySelector('.dialog input[type=range]');
-  out.fallbackNoHaSwitch = !sr().querySelector('.dialog ha-switch');
+  out.fallbackCheckbox = !!sr().querySelector('hp-dialog .srcrow input[type=checkbox]');
+  out.fallbackRange = !!sr().querySelector('hp-dialog input[type=range]');
+  out.fallbackNoHaSwitch = !sr().querySelector('hp-dialog ha-switch');
   c._markerDialog = null; await c.updateComplete;
 
   // --- 2) register stubs mimicking the HA contract -----------------------
@@ -35,20 +35,20 @@ const res = await page.evaluate(async () => {
   });
 
   c._openMarkerDialog(c._devices[0]); await c.updateComplete;
-  const switches = [...sr().querySelectorAll('.dialog ha-switch')];
+  const switches = [...sr().querySelectorAll('hp-dialog ha-switch')];
   out.haSwitchRendered = switches.length >= 2; // is_light + hide-from-plan at minimum
-  out.haNoPlainCheckbox = !sr().querySelector('.dialog .srcrow input[type=checkbox]');
-  const sliders = [...sr().querySelectorAll('.dialog ha-slider')];
+  out.haNoPlainCheckbox = !sr().querySelector('hp-dialog .srcrow input[type=checkbox]');
+  const sliders = [...sr().querySelectorAll('hp-dialog ha-slider')];
   out.haSliderRendered = sliders.length >= 2; // size + angle
 
   // --- 3) card -> control: state is pushed into the element --------------
   c._markerDialog = { ...c._markerDialog, isLight: true, hideFromPlan: false };
   await c.updateComplete;
-  out.downstreamChecked = [...sr().querySelectorAll('.dialog ha-switch')].some((el) => el.checked === true);
+  out.downstreamChecked = [...sr().querySelectorAll('hp-dialog ha-switch')].some((el) => el.checked === true);
 
   // --- 4) control -> card: change with .checked lands in the dialog ------
   const before = c._markerDialog.hideFromPlan;
-  const sw = [...sr().querySelectorAll('.dialog ha-switch')].find((el) => el.checked === before);
+  const sw = [...sr().querySelectorAll('hp-dialog ha-switch')].find((el) => el.checked === before);
   sw.checked = !before;
   sw.dispatchEvent(new Event('change', { bubbles: true }));
   await c.updateComplete;
@@ -57,7 +57,7 @@ const res = await page.evaluate(async () => {
 
   // --- 5) slider both ways ----------------------------------------------
   const sizeBefore = c._markerDialog.size;
-  const sl = [...sr().querySelectorAll('.dialog ha-slider')].find((el) => Number(el.value) === Number(sizeBefore));
+  const sl = [...sr().querySelectorAll('hp-dialog ha-slider')].find((el) => Number(el.value) === Number(sizeBefore));
   out.downstreamValue = !!sl;
   sl.value = 2;
   sl.dispatchEvent(new Event('input', { bubbles: true }));
@@ -73,8 +73,8 @@ const res = await page.evaluate(async () => {
 
   // --- 6) general settings: opacity sliders take the ha branch too -------
   c._openSettingsDialog(); await c.updateComplete;
-  out.gsHaSliders = sr().querySelectorAll('.dialog ha-slider').length >= 9;
-  const gsl = sr().querySelector('.dialog ha-slider');
+  out.gsHaSliders = sr().querySelectorAll('hp-dialog ha-slider').length >= 9;
+  const gsl = sr().querySelector('hp-dialog ha-slider');
   gsl.value = 55;
   gsl.dispatchEvent(new Event('input', { bubbles: true }));
   await c.updateComplete;