Integrate Storybook and portable UI design workflow

openspec/schemas/wealth-ledger-sdd/schema.yaml

@@ -1,5 +1,5 @@
 name: wealth-ledger-sdd
-version: 4
+version: 5
 description: WealthLedger SDD workflow - proposal → specs → design → tasks → apply
 artifacts:
   - id: proposal
@@ -114,6 +114,22 @@ artifacts:
         migration, public contract или другого труднообратимого решения; иначе
         `N/A` с конкретным Reason.
 
+      UI/UX Package:
+      - Определи применимость `new/changed`, `reuse` или `N/A` с конкретной
+        причиной. Для применимого scope покажи экраны, состояния, interactions
+        и responsive поведение; для reuse назови точную immutable версию,
+        используемую часть и отличия. Неизменяемой области не нужен новый макет.
+        Immutable reuse locator содержит store ID и путь от OpenSpec root,
+        чтобы archive вызывающего change не менял разрешение источника.
+      - Пакет входит в единый Design approval: revision, inline Markdown и
+        перечень необходимых локальных PNG/SVG в `visuals/` этого change с
+        относительным path, назначением и SHA-256 каждого файла. SVG должен быть
+        самодостаточным, без scripts, handlers, external fonts/assets. Для
+        inline Design self-hash не вводится; external-only URL не заменяет пакет.
+      - Сохраняй применимые материалы и exact archived reuse доступными без
+        временного чата или внешнего аккаунта. General package/approval rules
+        задаёт canonical governance, input binding — context authority.
+
       Solution Assessment:
       Включи section внутри Design, если change вводит или существенно заменяет
       auth, security, storage, external integration, observability, caching,
@@ -161,6 +177,14 @@ artifacts:
       - После записи используй native OpenSpec validation с
         `--store wealth-ledger-specs`.
 
+      Design Input:
+      - Прочитай применимый UI/UX пакет согласованной revision из Design,
+        включая перечисленные материалы; отсутствие или неоднозначность пакета
+        блокирует зависимую decomposition до восстановления или Design boundary.
+      - Планируй implementation-owned проверки состояний, interactions и
+        responsive scope. Независимую Validation не превращай в checkbox,
+        который может закрыть только reviewer.
+
       Testing:
       Автоматические tests обязательны для security/privacy, денежных расчётов,
       data integrity/migration, concurrency, public contracts, critical journeys
@@ -200,6 +224,15 @@ apply:
     - При recovery соблюдай artifact approval binding и повторно используй
       актуальные результаты checks по canonical context authority; state или
       planning completeness сами по себе approval не подтверждают.
+    - Из canonical Design прочитай применимый визуальный пакет: revision,
+      перечисленные материалы и exact immutable reuse. Проверь доступность,
+      SHA-256 и согласованный input binding до зависимой работы; missing file,
+      ambiguous package, digest mismatch или external-only source дают blocker,
+      а не разрешение восстановить решение по догадке.
+    - Следуй согласованным экранам, состояниям, interactions и responsive scope.
+      Несоответствие реализации исправляй в Implementation; изменение самого
+      решения возвращай к самой ранней затронутой planning boundary. Передача
+      и archive package следуют canonical lifecycle без копии пакета в handoff.
     - Feedback routing: intent/scope → Proposal; observable behavior → Delta
       Specs; architecture/rollback → Design; decomposition/ownership/coverage →
       Tasks. Останови downstream work, сообщи evidence и инвалидируй approvals от

openspec/schemas/wealth-ledger-sdd/templates/design.md

@@ -14,6 +14,39 @@
 
 <!-- Key design decisions with rationale and alternatives considered -->
 
+## UI/UX Applicability and Package
+
+<!-- Select new/changed, reuse, or N/A with a concrete reason. For N/A remove
+     the remaining package fields. Unchanged UI does not need a new mockup. -->
+
+**Applicability and scope:**
+
+**Package revision:**
+
+<!-- Describe affected screens, applicable states, interactions and responsive
+     behavior inline. For reuse identify the exact immutable archived package,
+     using its store ID and path from the canonical OpenSpec root, the reused
+     portion and differences. A mutable catalog URL is not identity. -->
+
+**Screens, states and interactions:**
+
+**Responsive behavior:**
+
+**Reused source and differences:**
+
+<!-- Inline Markdown is the default portable material. Only when necessary,
+     list local PNG/SVG exports under visuals/ with the fields below; otherwise
+     remove this table and state that the package is fully inline. SVG must be
+     self-contained: no scripts, handlers or external assets/fonts. -->
+
+| Material ID | Relative path | Screen/state and purpose | SHA-256 |
+| --- | --- | --- | --- |
+| <!-- id --> | <!-- visuals/file.png --> | <!-- purpose --> | <!-- file digest --> |
+
+<!-- One approval covers this entire Design package. File digests bind bytes;
+     they do not prove approval. Do not self-hash Design. Materials must remain
+     accessible across sessions and archive without external accounts. -->
+
 ## Delivery Map
 
 | Area | Status | Architectural outcome or N/A reason |