# Tools and examples atlas Generated from the source contract, parsed packaged examples and extension manifests by `pnpm generate:authoring`. Do not edit the tables by hand. Choose the explanation with [directing](directing.md) and [combinations](combinations.md). This atlas routes every directive to exact API and selected real examples; the full example index lists their actual parsed vocabulary; it does not prescribe their order. Run `node /scripts/build-atlas.mjs --out ./atlas` to build the complete local preview gallery. Pages use the actual runtime: scroll, switch views, play scenes and inspect motion. The gallery contains static, interactive and timed material; a still artifact alone is not a motion demonstration. A separately installed skill discovers the nearest compiler installed for the current project, or the release pinned in its SKILL.md through npx. `--cli ` selects a reviewed checkout explicitly. The compiler examples catalog supplies the actual package source paths; the skill directory need not contain package code or examples. ## Choose by the creative question | Need | Useful vocabulary and examples | Further guidance | | ----------------------------- | ----------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------- | | Show change and causality | composition/object/cue; directed-first-edit, directed-theme-color, directed-change-event | [Actions and timing](directed-scenes.md), [combinations](combinations.md) | | Establish location and scales | spotlight, overview-detail, diagram/zoom, video; capability-tour | [Interface orientation](directed-scenes.md#establish-every-interface-before-showing-a-fragment) | | Reveal a sequence | beat, demo, section scenes, diagram draw/pulse; cinematic-story, motion-showcase, product-theatre extension | [Vocabulary](vocabulary-use.md) | | Give a result weight | count, chart count-up, mark, typing, swap, transition, appear; capability-tour, visualization-catalog | [Motion roles](combinations.md) | | Compose a substantial page | all section recipes and layout families; layout-document, layout-dashboard, layout-landing, layout-mixed | [Composition](compose.md), [art direction](art-direction.md) | | Give the reader control | tabs, filter, toggle, disclosure, modal, response, review | [Detail on demand](vocabulary-use.md#detail-on-demand) | | Add a subject-specific effect | declared effect/provider/block/island extensions | [Extension contract](extensions.md) | ## Complete directive index | Directive | Purpose | Exact API | Parsed example routes | | ----------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `action` | Ordinary safe link inside an actions group. | [Fields and limits](catalog.md#action) | [landing](../../../examples/landing/report.md), [layout-mixed](../../../examples/layout-mixed/report.md), [executive-brief](../../../examples/executive-brief/report.md) | | `actions` | Responsive group containing ordinary action links. | [Fields and limits](catalog.md#actions) | [landing](../../../examples/landing/report.md), [layout-mixed](../../../examples/layout-mixed/report.md), [executive-brief](../../../examples/executive-brief/report.md) | | `appear` | Markdown that appears on the next step of its slide in a presentation (layout slides); on any other page, and under reduced motion or in print, it is simply shown. | [Fields and limits](catalog.md#appear) | [presentation](../../../examples/presentation/report.md), [capability-tour](../../../examples/capability-tour/report.md) | | `asset` | Download link to a confined local file. | [Fields and limits](catalog.md#asset) | [document](../../../examples/document/report.md) | | `beat` | One step of a scene="steps" or scene="scrub" section or of a playable demo: Markdown that scrolls past the pinned media or plays in turn; the nth beat shows the nth picture, lights its focus nodes in the diagram or its lines of the code block. | [Fields and limits](catalog.md#beat) | [layout-mixed](../../../examples/layout-mixed/report.md), [motion-showcase](../../../examples/motion-showcase/report.md), [capability-tour](../../../examples/capability-tour/report.md) | | `bucket` | One named assignment bucket. | [Fields and limits](catalog.md#bucket) | [response-workspace](../../../examples/response-workspace/report.md) | | `callout` | Emphasized finding or notice containing Markdown. | [Fields and limits](catalog.md#callout) | [document](../../../examples/document/report.md), [research](../../../examples/research/report.md), [tutorial](../../../examples/tutorial/report.md) | | `card` | One semantic card containing Markdown, optionally promoted to one safe whole-card link. | [Fields and limits](catalog.md#card) | [document](../../../examples/document/report.md), [answer](../../../examples/answer/report.md), [architecture](../../../examples/architecture/report.md) | | `cards` | Responsive grid, normally containing card directives. | [Fields and limits](catalog.md#cards) | [document](../../../examples/document/report.md), [answer](../../../examples/answer/report.md), [architecture](../../../examples/architecture/report.md) | | `chart` | Responsive bar, line, or pie chart rendered at compile time. | [Fields and limits](catalog.md#chart) | [research](../../../examples/research/report.md), [dashboard](../../../examples/dashboard/report.md), [visualization-catalog](../../../examples/visualization-catalog/report.md) | | `check-item` | One labelled required or optional checklist item. | [Fields and limits](catalog.md#check-item) | [review-workspace](../../../examples/review-workspace/report.md) | | `checklist` | Static structured checklist containing stable check-item directives. | [Fields and limits](catalog.md#checklist) | [review-workspace](../../../examples/review-workspace/report.md) | | `compare` | Before and after of the same view: exactly two Markdown images, before then after, laid over each other with a divider the reader moves by pointer or keyboard. | [Fields and limits](catalog.md#compare) | [layout-mixed](../../../examples/layout-mixed/report.md) | | `composition` | A directed, responsive explanation made of named objects and timed actions. | [Fields and limits](catalog.md#composition) | [directed-first-edit](../../../examples/directed-first-edit/report.md), [directed-theme-color](../../../examples/directed-theme-color/report.md), [directed-change-event](../../../examples/directed-change-event/report.md) | | `contents` | Generated in-flow links to final primary sections using their exact visible headings. | [Fields and limits](catalog.md#contents) | [landing](../../../examples/landing/report.md), [capability-tour](../../../examples/capability-tour/report.md) | | `conversation` | A mock of a dialog or a notification feed: message directives in order, with an optional title and an illustrative mark. | [Fields and limits](catalog.md#conversation) | [run-report](../../../examples/run-report/report.md) | | `copyable` | Ordinary Markdown prose with a localized copy control. | [Fields and limits](catalog.md#copyable) | [interactive-catalog](../../../examples/interactive-catalog/report.md) | | `count` | A number in running text that counts up from zero to its written value when it comes into view; the written value is what the page holds and shows without motion. | [Fields and limits](catalog.md#count) | [layout-mixed](../../../examples/layout-mixed/report.md), [motion-showcase](../../../examples/motion-showcase/report.md) | | `cue` | One declarative action at a time or speech anchor. | [Fields and limits](catalog.md#cue) | [directed-first-edit](../../../examples/directed-first-edit/report.md), [directed-theme-color](../../../examples/directed-theme-color/report.md), [directed-change-event](../../../examples/directed-change-event/report.md) | | `decision` | Static Markdown decision or typed decision containing decision-option directives. | [Fields and limits](catalog.md#decision) | [document](../../../examples/document/report.md), [research](../../../examples/research/report.md), [architecture](../../../examples/architecture/report.md) | | `decision-option` | One labelled option inside a typed decision. | [Fields and limits](catalog.md#decision-option) | [review-workspace](../../../examples/review-workspace/report.md) | | `deck` | A slide deck inside the page: slide directives shown one at a time in a 16:9 slot of the column, paged with buttons and keys, and opened on the whole screen; without the runtime and in print the slides follow one another. | [Fields and limits](catalog.md#deck) | [capability-tour](../../../examples/capability-tour/report.md) | | `demo` | Package-owned demo: a counter card, or with play a scene that reconstructs the product from ordinary directives (code, a diagram, cards, a picture) and plays its beats by time or by scroll; author code is never executed. | [Fields and limits](catalog.md#demo) | [document](../../../examples/document/report.md), [tutorial](../../../examples/tutorial/report.md), [interactive-catalog](../../../examples/interactive-catalog/report.md) | | `diagram` | Directed flow diagram rendered as deterministic SVG. | [Fields and limits](catalog.md#diagram) | [presentation](../../../examples/presentation/report.md), [architecture](../../../examples/architecture/report.md), [layout-mixed](../../../examples/layout-mixed/report.md) | | `diff` | One change in unified diff form: exactly one fenced code block with @@ hunks, drawn with old and new line numbers. | [Fields and limits](catalog.md#diff) | [code-review](../../../examples/code-review/report.md) | | `disclosure` | Native disclosure with a visible summary. | [Fields and limits](catalog.md#disclosure) | [document](../../../examples/document/report.md), [answer](../../../examples/answer/report.md), [research](../../../examples/research/report.md) | | `each` | Repeats its Markdown once per item of a list from the page data when the page builds; a body that is one list or one table repeats its items or rows inside it. | [Fields and limits](catalog.md#each) | [run-report](../../../examples/run-report/report.md), [capability-tour](../../../examples/capability-tour/report.md) | | `edge` | One directed connection between diagram nodes; from equal to to is a step that repeats, drawn as a loop on the node in a flow and on the lifeline in a sequence. | [Fields and limits](catalog.md#edge) | [presentation](../../../examples/presentation/report.md), [architecture](../../../examples/architecture/report.md), [layout-mixed](../../../examples/layout-mixed/report.md) | | `event` | One dated timeline event with optional Markdown detail. | [Fields and limits](catalog.md#event) | [document](../../../examples/document/report.md), [landing](../../../examples/landing/report.md), [visualization-catalog](../../../examples/visualization-catalog/report.md) | | `expect` | A control value over the page data: the build fails at this line when the data at the path diverges from the stated count, bounds or value. Renders nothing. | [Fields and limits](catalog.md#expect) | [run-report](../../../examples/run-report/report.md), [capability-tour](../../../examples/capability-tour/report.md) | | `eyebrow` | A short small-caps line above the title that follows it, in the eyebrow colour of the theme; written first in a section, it stands above the section title. | [Fields and limits](catalog.md#eyebrow) | [run-report](../../../examples/run-report/report.md) | | `filter` | Client-side text filter for authored list items. | [Fields and limits](catalog.md#filter) | [dashboard](../../../examples/dashboard/report.md), [interactive-catalog](../../../examples/interactive-catalog/report.md), [incident-review](../../../examples/incident-review/report.md) | | `finding` | One review finding with a severity, a title and Markdown detail. | [Fields and limits](catalog.md#finding) | [code-review](../../../examples/code-review/report.md) | | `findings` | Review findings in authored order, with a generated count per severity above them. | [Fields and limits](catalog.md#findings) | [code-review](../../../examples/code-review/report.md) | | `font` | Register a confined local font for one text role; the first declaration of each role replaces the theme font of that role. | [Fields and limits](catalog.md#font) | See the exact API and composition reference for this supporting directive. | | `glossary` | Reusable glossary definition containing Markdown, optionally moved from the document root or a direct section child into the appendix. | [Fields and limits](catalog.md#glossary) | [landing](../../../examples/landing/report.md), [interactive-catalog](../../../examples/interactive-catalog/report.md), [vendor-decision](../../../examples/vendor-decision/report.md) | | `group` | One labelled subsystem group around some nodes of a flow diagram. | [Fields and limits](catalog.md#group) | [visualization-catalog](../../../examples/visualization-catalog/report.md) | | `item` | One readable response item. | [Fields and limits](catalog.md#item) | [response-workspace](../../../examples/response-workspace/report.md) | | `lead` | One emphasized opening thesis paragraph inside a section. | [Fields and limits](catalog.md#lead) | [answer](../../../examples/answer/report.md), [code-review](../../../examples/code-review/report.md), [landing](../../../examples/landing/report.md) | | `legend` | Optional title and policy for the diagram legend; at most one per diagram. | [Fields and limits](catalog.md#legend) | See the exact API and composition reference for this supporting directive. | | `legend-item` | One legend entry: names a connection kind, a node emphasis, a node status, or a timeline event emphasis in the author's words, or hides a connection kind. | [Fields and limits](catalog.md#legend-item) | [document](../../../examples/document/report.md), [presentation](../../../examples/presentation/report.md), [architecture](../../../examples/architecture/report.md) | | `mark` | Words in running text marked by hand: underlined, circled or struck through in the accent colour, drawn when they come into view; the jitter comes from a seed, and a section holds at most two marks. | [Fields and limits](catalog.md#mark) | [capability-tour](../../../examples/capability-tour/report.md) | | `message` | One message or notification: sender, time, Markdown text and an optional status; alone it is a notification, inside conversation it is one turn. | [Fields and limits](catalog.md#message) | [run-report](../../../examples/run-report/report.md) | | `meta` | A short label in the mono face for identifiers and readings: :meta[run 96 · 01:17]. | [Fields and limits](catalog.md#meta) | [run-report](../../../examples/run-report/report.md) | | `modal` | Modal dialog opened by a package-owned control. | [Fields and limits](catalog.md#modal) | [architecture](../../../examples/architecture/report.md), [interactive-catalog](../../../examples/interactive-catalog/report.md), [vendor-decision](../../../examples/vendor-decision/report.md) | | `muted` | The quiet continuation of a paragraph in the muted text colour; the sentence before it reads bright: **The run passed.** :muted[Two retries, both on the network step.] | [Fields and limits](catalog.md#muted) | [run-report](../../../examples/run-report/report.md) | | `node` | One labelled node in a flow diagram. | [Fields and limits](catalog.md#node) | [presentation](../../../examples/presentation/report.md), [architecture](../../../examples/architecture/report.md), [layout-mixed](../../../examples/layout-mixed/report.md) | | `notes` | Speaker notes of a slide — a presentation section or a deck slide: never shown to the audience; on a presentation page the presenter view (?view=presenter) shows them under the slide. | [Fields and limits](catalog.md#notes) | [presentation](../../../examples/presentation/report.md), [capability-tour](../../../examples/capability-tour/report.md) | | `object` | Named Markdown object on a composition stage. | [Fields and limits](catalog.md#object) | [directed-first-edit](../../../examples/directed-first-edit/report.md), [directed-theme-color](../../../examples/directed-theme-color/report.md), [directed-change-event](../../../examples/directed-change-event/report.md) | | `option` | One selectable answer option. | [Fields and limits](catalog.md#option) | [answer](../../../examples/answer/report.md), [presentation](../../../examples/presentation/report.md), [response-workspace](../../../examples/response-workspace/report.md) | | `plural` | A number with its noun in the form the page language requires, settled when the page builds: :plural[5]{forms="file\|files"} → 5 files. | [Fields and limits](catalog.md#plural) | [run-report](../../../examples/run-report/report.md), [capability-tour](../../../examples/capability-tour/report.md) | | `point` | One labelled numeric value in a chart series. | [Fields and limits](catalog.md#point) | [research](../../../examples/research/report.md), [dashboard](../../../examples/dashboard/report.md), [visualization-catalog](../../../examples/visualization-catalog/report.md) | | `popover` | Non-modal contextual panel opened by a package-owned control. | [Fields and limits](catalog.md#popover) | [landing](../../../examples/landing/report.md), [interactive-catalog](../../../examples/interactive-catalog/report.md), [vendor-decision](../../../examples/vendor-decision/report.md) | | `process` | A mini process in a line of text or a card: its steps, separated by ">" in the label, drawn as dots in order with arcs for the returns and their «×N»; the step names and returns are said in words for assistive technology. | [Fields and limits](catalog.md#process) | [capability-tour](../../../examples/capability-tour/report.md) | | `question` | One typed question inside a response workspace. | [Fields and limits](catalog.md#question) | [answer](../../../examples/answer/report.md), [presentation](../../../examples/presentation/report.md), [response-workspace](../../../examples/response-workspace/report.md) | | `response` | Local structured reader-response workspace with deterministic export. | [Fields and limits](catalog.md#response) | [answer](../../../examples/answer/report.md), [presentation](../../../examples/presentation/report.md), [response-workspace](../../../examples/response-workspace/report.md) | | `scene-group` | A meaningful group of scene objects with a responsive package-owned arrangement. | [Fields and limits](catalog.md#scene-group) | [directed-stable-map](../../../examples/directed-stable-map/report.md), [directed-code-execution](../../../examples/directed-code-execution/report.md) | | `section` | Labelled top-level page section containing Markdown. | [Fields and limits](catalog.md#section) | [document](../../../examples/document/report.md), [answer](../../../examples/answer/report.md), [presentation](../../../examples/presentation/report.md) | | `series` | One named chart series containing data points. | [Fields and limits](catalog.md#series) | [research](../../../examples/research/report.md), [dashboard](../../../examples/dashboard/report.md), [visualization-catalog](../../../examples/visualization-catalog/report.md) | | `slide` | One slide of a deck: Markdown with optional appear steps and speaker notes. | [Fields and limits](catalog.md#slide) | [capability-tour](../../../examples/capability-tour/report.md) | | `slot` | Named changing value inside a stable object; content is independent of its owner. | [Fields and limits](catalog.md#slot) | [directed-stable-map](../../../examples/directed-stable-map/report.md) | | `source-line` | The source line under the block before it — which data or footage, how many records, taken when: ::source-line[Moira export of run 96, 212 records]{date="2026-09-25"}. | [Fields and limits](catalog.md#source-line) | [run-report](../../../examples/run-report/report.md), [capability-tour](../../../examples/capability-tour/report.md) | | `source-link` | Source location opened through an explicit IPv4 loopback editor helper without replacing the report page. | [Fields and limits](catalog.md#source-link) | See the exact API and composition reference for this supporting directive. | | `spotlight` | One screenshot with a loupe over one detail: the detail enlarged in place, the rest of the picture dimmed, and the explanation beside it. | [Fields and limits](catalog.md#spotlight) | [layout-mixed](../../../examples/layout-mixed/report.md), [capability-tour](../../../examples/capability-tour/report.md) | | `steps` | Process or tutorial sequence containing Markdown, normally an ordered list. | [Fields and limits](catalog.md#steps) | [document](../../../examples/document/report.md), [research](../../../examples/research/report.md), [architecture](../../../examples/architecture/report.md) | | `swap` | A word in running text that swaps on a beat to up to three other words and returns to the written one within five seconds; the widest word reserves the width, so the line never moves. | [Fields and limits](catalog.md#swap) | [capability-tour](../../../examples/capability-tour/report.md) | | `tab` | One labelled panel inside tabs. | [Fields and limits](catalog.md#tab) | [research](../../../examples/research/report.md), [architecture](../../../examples/architecture/report.md), [tutorial](../../../examples/tutorial/report.md) | | `table` | One Markdown table with a chosen narrow-track layout; a table without the directive uses layout auto. | [Fields and limits](catalog.md#table) | [vendor-decision](../../../examples/vendor-decision/report.md), [capability-tour](../../../examples/capability-tour/report.md) | | `tabs` | Keyboard-operable group of tab panels. | [Fields and limits](catalog.md#tabs) | [research](../../../examples/research/report.md), [architecture](../../../examples/architecture/report.md), [tutorial](../../../examples/tutorial/report.md) | | `term` | Inline or standalone reference that opens a registered glossary explanation. Prose must carry one for the first occurrence of a registered term in each section; later occurrences of that term in the same section stay ordinary prose. | [Fields and limits](catalog.md#term) | [landing](../../../examples/landing/report.md), [interactive-catalog](../../../examples/interactive-catalog/report.md), [vendor-decision](../../../examples/vendor-decision/report.md) | | `time` | A date or a moment written in the page language and, for a time, in a declared time zone, settled when the page builds: :time[2026-09-25T01:17]{zone="Europe/Moscow"}. | [Fields and limits](catalog.md#time) | [run-report](../../../examples/run-report/report.md), [capability-tour](../../../examples/capability-tour/report.md) | | `timeline` | Semantic chronological sequence with bounded events. | [Fields and limits](catalog.md#timeline) | [document](../../../examples/document/report.md), [landing](../../../examples/landing/report.md), [visualization-catalog](../../../examples/visualization-catalog/report.md) | | `toggle` | Switch controlling visibility of declarative content. | [Fields and limits](catalog.md#toggle) | [dashboard](../../../examples/dashboard/report.md), [interactive-catalog](../../../examples/interactive-catalog/report.md), [launch-readiness](../../../examples/launch-readiness/report.md) | | `typing` | A short line in running text typed in place, character by character, when it comes into view; the whole line is in the page from the start and holds its width, so nothing moves. | [Fields and limits](catalog.md#typing) | [capability-tour](../../../examples/capability-tour/report.md) | | `video` | Embedded local video (webm, mp4, m4v, or ogv), or an agentic-screencast film named by from, as a looping muted clip, a background with a pause control, or a manually started video with sound (the default for a recording that carries sound); directory output ships every source for the browser to choose from, one file ships the most compatible; each source is typed with the codecs read from its file. | [Fields and limits](catalog.md#video) | [presentation](../../../examples/presentation/report.md), [capability-tour](../../../examples/capability-tour/report.md) | | `zoom` | The inside of one node of a flow diagram, written as its own small flow: while the diagram is pinned on screen the camera flies into that node and the nested flow grows readable in its place. | [Fields and limits](catalog.md#zoom) | [capability-tour](../../../examples/capability-tour/report.md) | ## Every packaged example | Example | Purpose and category | Source | Localizations | Parsed vocabulary | | ----------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------- | ---------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | document | Decision-ready report with findings, evidence, a local asset, a timeline, and bounded interaction. · document/report | [report.md](../../../examples/document/report.md) | [ru](../../../examples/document/report.ru.md) | `asset`, `callout`, `card`, `cards`, `decision`, `demo`, `disclosure`, `event`, `legend-item`, `section`, `steps`, `timeline` | | answer | A question with options and their trade-offs, followed by a response form that exports one structured answer. · answer/choice | [report.md](../../../examples/answer/report.md) | [ru](../../../examples/answer/report.ru.md) | `card`, `cards`, `disclosure`, `lead`, `option`, `question`, `response`, `section` | | presentation | A short product demo as slides: a title slide, steps that appear on click, a diagram, a figure, code and a question for the room, with speaker notes. · presentation/demo | [report.md](../../../examples/presentation/report.md) | [ru](../../../examples/presentation/report.ru.md) | `appear`, `diagram`, `edge`, `legend-item`, `node`, `notes`, `option`, `question`, `response`, `section`, `video` | | research | Research synthesis with a method partial, evidence map, comparison chart, tabs, and recommendation. · document/research | [report.md](../../../examples/research/report.md) | [ru](../../../examples/research/report.ru.md) | `callout`, `chart`, `decision`, `disclosure`, `point`, `section`, `series`, `steps`, `tab`, `tabs` | | architecture | Architecture decision packet with a local system map, alternatives, flow diagram, and rollout. · document/architecture | [report.md](../../../examples/architecture/report.md) | [ru](../../../examples/architecture/report.ru.md) | `card`, `cards`, `decision`, `diagram`, `edge`, `legend-item`, `modal`, `node`, `section`, `steps`, `tab`, `tabs` | | code-review | Review of one change with a verdict, findings by severity, the unified diff, and the steps to merge. · document/code-review | [report.md](../../../examples/code-review/report.md) | [ru](../../../examples/code-review/report.ru.md) | `diff`, `finding`, `findings`, `lead`, `section` | | tutorial | Step-by-step learning page with tabs, progressive detail, code, and a bounded practice control. · document/guide | [report.md](../../../examples/tutorial/report.md) | [ru](../../../examples/tutorial/report.ru.md) | `callout`, `card`, `cards`, `decision`, `demo`, `disclosure`, `section`, `steps`, `tab`, `tabs` | | dashboard | Operational dashboard with scan-friendly cards, charts, filtering, and optional detail. · dashboard/metrics | [report.md](../../../examples/dashboard/report.md) | [ru](../../../examples/dashboard/report.ru.md) | `callout`, `card`, `cards`, `chart`, `filter`, `point`, `section`, `series`, `toggle` | | landing | Focused product narrative with benefits, proof, delivery milestones, and contextual detail. · landing/product | [report.md](../../../examples/landing/report.md) | [ru](../../../examples/landing/report.ru.md) | `action`, `actions`, `callout`, `card`, `cards`, `contents`, `decision`, `disclosure`, `event`, `glossary`, `lead`, `legend-item`, `popover`, `section`, `term`, `timeline` | | layout-document | Long-form report with persistent contents, decisions, table, code, and local media. · document/architecture | [report.md](../../../examples/layout-document/report.md) | [ru](../../../examples/layout-document/report.ru.md) | `callout`, `decision`, `section`, `steps` | | layout-dashboard | Wide operational summary using dense cards, callouts, a table, and compact navigation. · dashboard/statuses | [report.md](../../../examples/layout-dashboard/report.md) | [ru](../../../examples/layout-dashboard/report.ru.md) | `callout`, `card`, `cards`, `section`, `steps` | | layout-landing | Focused product narrative with a spacious hero, benefits, proof, and next steps. · landing/product | [report.md](../../../examples/layout-landing/report.md) | [ru](../../../examples/layout-landing/report.ru.md) | `callout`, `card`, `cards`, `decision`, `section` | | layout-mixed | Bilingual catalog covering the complete composition, media, surface, motion, and responsive vocabulary. · landing/showcase | [report.md](../../../examples/layout-mixed/report.md) | [ru](../../../examples/layout-mixed/report.ru.md) | `action`, `actions`, `beat`, `callout`, `card`, `cards`, `compare`, `count`, `decision`, `diagram`, `edge`, `lead`, `legend-item`, `node`, `section`, `spotlight` | | interactive-catalog | Declarative glossary, disclosure, tabs, overlays, filtering, toggles, and a bounded demo. · document/guide | [report.md](../../../examples/interactive-catalog/report.md) | [ru](../../../examples/interactive-catalog/report.ru.md) | `copyable`, `demo`, `disclosure`, `filter`, `glossary`, `modal`, `popover`, `section`, `tab`, `tabs`, `term`, `toggle` | | review-workspace | Offline report with repeated evidence blocks for fragment threads, user/agent messages, resolution, and deterministic review export. · document/report | [report.md](../../../examples/review-workspace/report.md) | [ru](../../../examples/review-workspace/report.ru.md) | `check-item`, `checklist`, `decision`, `decision-option`, `section` | | response-workspace | Offline response form covering bucket, per-item choices, ordering, scoring, text, comments, import, and deterministic export. · answer/survey | [report.md](../../../examples/response-workspace/report.md) | [ru](../../../examples/response-workspace/report.ru.md) | `bucket`, `item`, `option`, `question`, `response`, `section` | | question-review | Three open decisions, each with its context and options, and one form that collects the answers for the team that asked. · answer/questions | [report.md](../../../examples/question-review/report.md) | [ru](../../../examples/question-review/report.ru.md) | `lead`, `option`, `question`, `response`, `section` | | visualization-catalog | Validated bar, line, and pie charts, a directed flow diagram, and a semantic timeline. · dashboard/charts | [report.md](../../../examples/visualization-catalog/report.md) | [ru](../../../examples/visualization-catalog/report.ru.md) | `chart`, `diagram`, `edge`, `event`, `group`, `legend-item`, `node`, `point`, `section`, `series`, `timeline` | | incident-review | Fictional P1 incident review with impact metrics, causal evidence, recovery timeline, and accountable follow-up. · document/incident | [report.md](../../../examples/incident-review/report.md) | [ru](../../../examples/incident-review/report.ru.md) | `callout`, `card`, `cards`, `chart`, `decision`, `diagram`, `disclosure`, `edge`, `event`, `filter`, `legend-item`, `node`, `point`, `section`, `series`, `steps`, `tab`, `tabs`, `timeline` | | vendor-decision | Fictional procurement decision separating hard security gates, weighted evidence, and conditional adoption. · answer/choice | [report.md](../../../examples/vendor-decision/report.md) | [ru](../../../examples/vendor-decision/report.ru.md) | `callout`, `card`, `cards`, `chart`, `decision`, `disclosure`, `event`, `glossary`, `legend-item`, `modal`, `point`, `popover`, `section`, `series`, `steps`, `tab`, `table`, `tabs`, `term`, `timeline` | | launch-readiness | Fictional launch brief combining audience value, funnel evidence, operational gates, and a reversible rollout. · landing/launch | [report.md](../../../examples/launch-readiness/report.md) | [ru](../../../examples/launch-readiness/report.ru.md) | `callout`, `card`, `cards`, `chart`, `decision`, `disclosure`, `event`, `legend-item`, `point`, `popover`, `section`, `series`, `steps`, `tab`, `tabs`, `timeline`, `toggle` | | executive-brief | Decision narrative with a staged opening, evidence field, operating path, and finished handoff. · document/report | [report.md](../../../examples/executive-brief/report.md) | [ru](../../../examples/executive-brief/report.ru.md) | `action`, `actions`, `card`, `cards`, `chart`, `decision`, `diagram`, `edge`, `event`, `lead`, `legend-item`, `node`, `point`, `section`, `series`, `timeline` | | motion-showcase | Motion demonstration of scroll scenes, reveal, choreography, depth, tilt, and reduced-motion fallback. · landing/showcase | [report.md](../../../examples/motion-showcase/report.md) | [ru](../../../examples/motion-showcase/report.ru.md) | `action`, `actions`, `beat`, `callout`, `card`, `cards`, `count`, `decision`, `diagram`, `edge`, `lead`, `legend-item`, `node`, `popover`, `section` | | terminal-portfolio | Console-led systems portfolio with prompt rhythm, linked work, an operating log, and a reproducible handoff. · landing/portfolio | [report.md](../../../examples/terminal-portfolio/report.md) | [ru](../../../examples/terminal-portfolio/report.ru.md) | `action`, `actions`, `card`, `cards`, `decision`, `event`, `lead`, `legend-item`, `section`, `timeline` | | cinematic-story | Local-media visual essay with a staged hero, scroll narrative, image rail, and measured summary. · landing/showcase | [report.md](../../../examples/cinematic-story/report.md) | [ru](../../../examples/cinematic-story/report.ru.md) | `action`, `actions`, `card`, `cards`, `event`, `lead`, `legend-item`, `section`, `timeline` | | run-report | Bilingual run report whose numbers, stage cards, chart points and table rows come from one JSON file, with control values, number agreement, a dated source line and an illustrative notification. · document/report | [report.md](../../../examples/run-report/report.md) | [ru](../../../examples/run-report/report.ru.md) | `card`, `cards`, `chart`, `conversation`, `each`, `expect`, `eyebrow`, `message`, `meta`, `muted`, `plural`, `point`, `section`, `series`, `source-line`, `time` | | capability-tour | Bilingual guide that follows a fictional weather-station network through a season, one technique per chapter with its Markdown under the result: data from JSON, tables as cards, full-screen viewer, statuses and returns, zoom, a played scene, a scroll scene, a loupe, a film, a brand theme, a companion page in layout screens and an edition pair built with --since. · document/guide | [report.md](../../../examples/capability-tour/report.md) | [ru](../../../examples/capability-tour/report.ru.md) | `appear`, `beat`, `card`, `cards`, `chart`, `contents`, `deck`, `demo`, `diagram`, `disclosure`, `each`, `edge`, `event`, `expect`, `glossary`, `lead`, `legend-item`, `mark`, `node`, `notes`, `plural`, `point`, `process`, `section`, `series`, `slide`, `source-line`, `spotlight`, `swap`, `tab`, `table`, `tabs`, `term`, `time`, `timeline`, `typing`, `video`, `zoom` | | directed-first-edit | A directed explanation with named objects and speech-ready cues; illustrative values and pseudocode. · document/guide | [report.md](../../../examples/directed-first-edit/report.md) | [ru](../../../examples/directed-first-edit/report.ru.md) | `composition`, `cue`, `object` | | directed-theme-color | A directed explanation with named objects and speech-ready cues; illustrative values and pseudocode. · document/guide | [report.md](../../../examples/directed-theme-color/report.md) | [ru](../../../examples/directed-theme-color/report.ru.md) | `composition`, `cue`, `object` | | directed-change-event | A directed explanation with named objects and speech-ready cues; illustrative values and pseudocode. · document/guide | [report.md](../../../examples/directed-change-event/report.md) | [ru](../../../examples/directed-change-event/report.ru.md) | `composition`, `cue`, `object` | | directed-stable-map | Grouped independent owners retain their map while named values copy and change; a real address helper is shown beside illustrative data. · document/guide | [report.md](../../../examples/directed-stable-map/report.md) | | `composition`, `cue`, `object`, `scene-group`, `slot` | | directed-attention | Stable producer, queue and receiver illustrate transient beam/packet passes and additive attention with explicit release. · document/guide | [report.md](../../../examples/directed-attention/report.md) | | `composition`, `cue`, `object` | | directed-code-execution | Complete real functions, actual returned values, original line locators, timed annotations and an attention handoff to the matching result. · document/guide | [report.md](../../../examples/directed-code-execution/report.md) | | `composition`, `cue`, `object`, `scene-group` | ### Companion sources Companion pages and edition pairs belong to their parent example; translations remain linked from their source. - [capability-tour/edition-1.md](../../../examples/capability-tour/edition-1.md) - [capability-tour/edition-1.ru.md](../../../examples/capability-tour/edition-1.ru.md) - [capability-tour/edition-2.md](../../../examples/capability-tour/edition-2.md) - [capability-tour/edition-2.ru.md](../../../examples/capability-tour/edition-2.ru.md) - [capability-tour/screens.md](../../../examples/capability-tour/screens.md) - [capability-tour/screens.ru.md](../../../examples/capability-tour/screens.ru.md) ## Reference extensions and all their examples | Extension | Level and purpose | Documentation and source examples | | --------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | key-figure | block: One figure the page rests on, always with the date of its slice and where it was read. | [README](../../../extensions/key-figure/README.md), [example-quarterly.md](../../../extensions/key-figure/example-quarterly.md), [example-benchmark.md](../../../extensions/key-figure/example-benchmark.md) | | product-theatre | block: A product run replayed second by second as the reader scrolls, with the whole run as a table after it. | [README](../../../extensions/product-theatre/README.md), [example-cli.md](../../../extensions/product-theatre/example-cli.md), [example-dashboard.md](../../../extensions/product-theatre/example-dashboard.md) | | theatre-script | provider: Writes the diagram and the steps of a product run, or its table, from a scenario in the page's data at build time. | [README](../../../extensions/product-theatre/README.md), [example-cli.md](../../../extensions/product-theatre/example-cli.md), [example-dashboard.md](../../../extensions/product-theatre/example-dashboard.md) | | focus-frame | effect: A narrow frame follows the first image of a section; trace draws its perimeter as the section is read, corners grows four short corner marks. | [README](../../../extensions/focus-frame/README.md), [example-field.md](../../../extensions/focus-frame/example-field.md), [example-workshop.md](../../../extensions/focus-frame/example-workshop.md) | | loom | effect: A strip of cloth woven beside a section while the reader goes through it — warp strung in the margin from the start, weft rows added as the section passes, finished when it has been read. | [README](../../../extensions/loom/README.md), [example-craft.md](../../../extensions/loom/example-craft.md), [example-release.md](../../../extensions/loom/example-release.md) | | slo-budget | island: An error-budget calculator the reader fills in, showing how much of the budget is spent and when it runs out at the current pace. | [README](../../../extensions/slo-budget/README.md), [example-incident.md](../../../extensions/slo-budget/example-incident.md), [example-guide.md](../../../extensions/slo-budget/example-guide.md) | ## Complete source files Original example and extension files, including companions, partials, data and media. These are implementation sources, not prescribed film structures. - [examples/answer/brief.md](../../../examples/answer/brief.md) - [examples/answer/report.md](../../../examples/answer/report.md) - [examples/answer/report.ru.md](../../../examples/answer/report.ru.md) - [examples/architecture/assets/system-map-dark.ru.svg](../../../examples/architecture/assets/system-map-dark.ru.svg) - [examples/architecture/assets/system-map-dark.svg](../../../examples/architecture/assets/system-map-dark.svg) - [examples/architecture/assets/system-map.ru.svg](../../../examples/architecture/assets/system-map.ru.svg) - [examples/architecture/assets/system-map.svg](../../../examples/architecture/assets/system-map.svg) - [examples/architecture/brief.md](../../../examples/architecture/brief.md) - [examples/architecture/partials/decision.md](../../../examples/architecture/partials/decision.md) - [examples/architecture/partials/decision.ru.md](../../../examples/architecture/partials/decision.ru.md) - [examples/architecture/report.md](../../../examples/architecture/report.md) - [examples/architecture/report.ru.md](../../../examples/architecture/report.ru.md) - [examples/capability-tour/assets/coast-dark.svg](../../../examples/capability-tour/assets/coast-dark.svg) - [examples/capability-tour/assets/coast.svg](../../../examples/capability-tour/assets/coast.svg) - [examples/capability-tour/assets/film-ru/season.av1.mp4](../../../examples/capability-tour/assets/film-ru/season.av1.mp4) - [examples/capability-tour/assets/film-ru/season.h264.mp4](../../../examples/capability-tour/assets/film-ru/season.h264.mp4) - [examples/capability-tour/assets/film-ru/season.poster.jpg](../../../examples/capability-tour/assets/film-ru/season.poster.jpg) - [examples/capability-tour/assets/film-ru/season.poster.webp](../../../examples/capability-tour/assets/film-ru/season.poster.webp) - [examples/capability-tour/assets/film-ru/season.thumbs.jpg](../../../examples/capability-tour/assets/film-ru/season.thumbs.jpg) - [examples/capability-tour/assets/film-ru/season.thumbs.vtt](../../../examples/capability-tour/assets/film-ru/season.thumbs.vtt) - [examples/capability-tour/assets/film-ru/season.vp9.webm](../../../examples/capability-tour/assets/film-ru/season.vp9.webm) - [examples/capability-tour/assets/film-ru/season.web.json](../../../examples/capability-tour/assets/film-ru/season.web.json) - [examples/capability-tour/assets/film/season.av1.mp4](../../../examples/capability-tour/assets/film/season.av1.mp4) - [examples/capability-tour/assets/film/season.h264.mp4](../../../examples/capability-tour/assets/film/season.h264.mp4) - [examples/capability-tour/assets/film/season.poster.jpg](../../../examples/capability-tour/assets/film/season.poster.jpg) - [examples/capability-tour/assets/film/season.poster.webp](../../../examples/capability-tour/assets/film/season.poster.webp) - [examples/capability-tour/assets/film/season.thumbs.jpg](../../../examples/capability-tour/assets/film/season.thumbs.jpg) - [examples/capability-tour/assets/film/season.thumbs.vtt](../../../examples/capability-tour/assets/film/season.thumbs.vtt) - [examples/capability-tour/assets/film/season.vp9.webm](../../../examples/capability-tour/assets/film/season.vp9.webm) - [examples/capability-tour/assets/film/season.web.json](../../../examples/capability-tour/assets/film/season.web.json) - [examples/capability-tour/assets/season-poster-dark.ru.webp](../../../examples/capability-tour/assets/season-poster-dark.ru.webp) - [examples/capability-tour/assets/season-poster-dark.webp](../../../examples/capability-tour/assets/season-poster-dark.webp) - [examples/capability-tour/brief.md](../../../examples/capability-tour/brief.md) - [examples/capability-tour/data/network.json](../../../examples/capability-tour/data/network.json) - [examples/capability-tour/edition-1.md](../../../examples/capability-tour/edition-1.md) - [examples/capability-tour/edition-1.ru.md](../../../examples/capability-tour/edition-1.ru.md) - [examples/capability-tour/edition-2.md](../../../examples/capability-tour/edition-2.md) - [examples/capability-tour/edition-2.ru.md](../../../examples/capability-tour/edition-2.ru.md) - [examples/capability-tour/kestrel-theme.yaml](../../../examples/capability-tour/kestrel-theme.yaml) - [examples/capability-tour/report.md](../../../examples/capability-tour/report.md) - [examples/capability-tour/report.ru.md](../../../examples/capability-tour/report.ru.md) - [examples/capability-tour/screens.md](../../../examples/capability-tour/screens.md) - [examples/capability-tour/screens.ru.md](../../../examples/capability-tour/screens.ru.md) - [examples/cinematic-story/assets/aurora-australis.jpg](../../../examples/cinematic-story/assets/aurora-australis.jpg) - [examples/cinematic-story/assets/aurora-station.jpg](../../../examples/cinematic-story/assets/aurora-station.jpg) - [examples/cinematic-story/assets/night-moscow.jpg](../../../examples/cinematic-story/assets/night-moscow.jpg) - [examples/cinematic-story/assets/richat.jpg](../../../examples/cinematic-story/assets/richat.jpg) - [examples/cinematic-story/assets/sand-sea.jpg](../../../examples/cinematic-story/assets/sand-sea.jpg) - [examples/cinematic-story/brief.md](../../../examples/cinematic-story/brief.md) - [examples/cinematic-story/report.md](../../../examples/cinematic-story/report.md) - [examples/cinematic-story/report.ru.md](../../../examples/cinematic-story/report.ru.md) - [examples/code-review/brief.md](../../../examples/code-review/brief.md) - [examples/code-review/report.md](../../../examples/code-review/report.md) - [examples/code-review/report.ru.md](../../../examples/code-review/report.ru.md) - [examples/dashboard/brief.md](../../../examples/dashboard/brief.md) - [examples/dashboard/report.md](../../../examples/dashboard/report.md) - [examples/dashboard/report.ru.md](../../../examples/dashboard/report.ru.md) - [examples/directed-attention/brief.md](../../../examples/directed-attention/brief.md) - [examples/directed-attention/report.md](../../../examples/directed-attention/report.md) - [examples/directed-change-event/SOURCE-MAP.md](../../../examples/directed-change-event/SOURCE-MAP.md) - [examples/directed-change-event/architecture-walkthrough.md](../../../examples/directed-change-event/architecture-walkthrough.md) - [examples/directed-change-event/brief.md](../../../examples/directed-change-event/brief.md) - [examples/directed-change-event/report.md](../../../examples/directed-change-event/report.md) - [examples/directed-change-event/report.ru.md](../../../examples/directed-change-event/report.ru.md) - [examples/directed-code-execution/brief.md](../../../examples/directed-code-execution/brief.md) - [examples/directed-code-execution/prepare.mjs](../../../examples/directed-code-execution/prepare.mjs) - [examples/directed-code-execution/report.md](../../../examples/directed-code-execution/report.md) - [examples/directed-first-edit/brief.md](../../../examples/directed-first-edit/brief.md) - [examples/directed-first-edit/report.md](../../../examples/directed-first-edit/report.md) - [examples/directed-first-edit/report.ru.md](../../../examples/directed-first-edit/report.ru.md) - [examples/directed-stable-map/brief.md](../../../examples/directed-stable-map/brief.md) - [examples/directed-stable-map/report.md](../../../examples/directed-stable-map/report.md) - [examples/directed-theme-color/brief.md](../../../examples/directed-theme-color/brief.md) - [examples/directed-theme-color/report.md](../../../examples/directed-theme-color/report.md) - [examples/directed-theme-color/report.ru.md](../../../examples/directed-theme-color/report.ru.md) - [examples/document/assets/architecture-dark.ru.svg](../../../examples/document/assets/architecture-dark.ru.svg) - [examples/document/assets/architecture-dark.svg](../../../examples/document/assets/architecture-dark.svg) - [examples/document/assets/architecture.ru.svg](../../../examples/document/assets/architecture.ru.svg) - [examples/document/assets/architecture.svg](../../../examples/document/assets/architecture.svg) - [examples/document/brief.md](../../../examples/document/brief.md) - [examples/document/partials/findings.md](../../../examples/document/partials/findings.md) - [examples/document/partials/findings.ru.md](../../../examples/document/partials/findings.ru.md) - [examples/document/report.md](../../../examples/document/report.md) - [examples/document/report.ru.md](../../../examples/document/report.ru.md) - [examples/executive-brief/brief.md](../../../examples/executive-brief/brief.md) - [examples/executive-brief/report.md](../../../examples/executive-brief/report.md) - [examples/executive-brief/report.ru.md](../../../examples/executive-brief/report.ru.md) - [examples/incident-review/assets/service-topology-dark.ru.svg](../../../examples/incident-review/assets/service-topology-dark.ru.svg) - [examples/incident-review/assets/service-topology-dark.svg](../../../examples/incident-review/assets/service-topology-dark.svg) - [examples/incident-review/assets/service-topology.ru.svg](../../../examples/incident-review/assets/service-topology.ru.svg) - [examples/incident-review/assets/service-topology.svg](../../../examples/incident-review/assets/service-topology.svg) - [examples/incident-review/brief.md](../../../examples/incident-review/brief.md) - [examples/incident-review/partials/actions.md](../../../examples/incident-review/partials/actions.md) - [examples/incident-review/partials/actions.ru.md](../../../examples/incident-review/partials/actions.ru.md) - [examples/incident-review/report.md](../../../examples/incident-review/report.md) - [examples/incident-review/report.ru.md](../../../examples/incident-review/report.ru.md) - [examples/interactive-catalog/brief.md](../../../examples/interactive-catalog/brief.md) - [examples/interactive-catalog/report.md](../../../examples/interactive-catalog/report.md) - [examples/interactive-catalog/report.ru.md](../../../examples/interactive-catalog/report.ru.md) - [examples/landing/brief.md](../../../examples/landing/brief.md) - [examples/landing/report.md](../../../examples/landing/report.md) - [examples/landing/report.ru.md](../../../examples/landing/report.ru.md) - [examples/launch-readiness/assets/beta-learning-loop-dark.ru.svg](../../../examples/launch-readiness/assets/beta-learning-loop-dark.ru.svg) - [examples/launch-readiness/assets/beta-learning-loop-dark.svg](../../../examples/launch-readiness/assets/beta-learning-loop-dark.svg) - [examples/launch-readiness/assets/beta-learning-loop.ru.svg](../../../examples/launch-readiness/assets/beta-learning-loop.ru.svg) - [examples/launch-readiness/assets/beta-learning-loop.svg](../../../examples/launch-readiness/assets/beta-learning-loop.svg) - [examples/launch-readiness/brief.md](../../../examples/launch-readiness/brief.md) - [examples/launch-readiness/partials/readiness-register.md](../../../examples/launch-readiness/partials/readiness-register.md) - [examples/launch-readiness/partials/readiness-register.ru.md](../../../examples/launch-readiness/partials/readiness-register.ru.md) - [examples/launch-readiness/report.md](../../../examples/launch-readiness/report.md) - [examples/launch-readiness/report.ru.md](../../../examples/launch-readiness/report.ru.md) - [examples/layout-dashboard/brief.md](../../../examples/layout-dashboard/brief.md) - [examples/layout-dashboard/report.md](../../../examples/layout-dashboard/report.md) - [examples/layout-dashboard/report.ru.md](../../../examples/layout-dashboard/report.ru.md) - [examples/layout-document/brief.md](../../../examples/layout-document/brief.md) - [examples/layout-document/page-model-dark.ru.svg](../../../examples/layout-document/page-model-dark.ru.svg) - [examples/layout-document/page-model-dark.svg](../../../examples/layout-document/page-model-dark.svg) - [examples/layout-document/page-model.ru.svg](../../../examples/layout-document/page-model.ru.svg) - [examples/layout-document/page-model.svg](../../../examples/layout-document/page-model.svg) - [examples/layout-document/report.md](../../../examples/layout-document/report.md) - [examples/layout-document/report.ru.md](../../../examples/layout-document/report.ru.md) - [examples/layout-landing/brief.md](../../../examples/layout-landing/brief.md) - [examples/layout-landing/report.md](../../../examples/layout-landing/report.md) - [examples/layout-landing/report.ru.md](../../../examples/layout-landing/report.ru.md) - [examples/layout-mixed/brief.md](../../../examples/layout-mixed/brief.md) - [examples/layout-mixed/compare-after-dark.svg](../../../examples/layout-mixed/compare-after-dark.svg) - [examples/layout-mixed/compare-after.svg](../../../examples/layout-mixed/compare-after.svg) - [examples/layout-mixed/compare-before-dark.svg](../../../examples/layout-mixed/compare-before-dark.svg) - [examples/layout-mixed/compare-before.svg](../../../examples/layout-mixed/compare-before.svg) - [examples/layout-mixed/layout-map-dark.ru.svg](../../../examples/layout-mixed/layout-map-dark.ru.svg) - [examples/layout-mixed/layout-map-dark.svg](../../../examples/layout-mixed/layout-map-dark.svg) - [examples/layout-mixed/layout-map.ru.svg](../../../examples/layout-mixed/layout-map.ru.svg) - [examples/layout-mixed/layout-map.svg](../../../examples/layout-mixed/layout-map.svg) - [examples/layout-mixed/report.md](../../../examples/layout-mixed/report.md) - [examples/layout-mixed/report.ru.md](../../../examples/layout-mixed/report.ru.md) - [examples/manifest.json](../../../examples/manifest.json) - [examples/motion-showcase/assets/aurora-station.jpg](../../../examples/motion-showcase/assets/aurora-station.jpg) - [examples/motion-showcase/assets/night-moscow.jpg](../../../examples/motion-showcase/assets/night-moscow.jpg) - [examples/motion-showcase/assets/richat.jpg](../../../examples/motion-showcase/assets/richat.jpg) - [examples/motion-showcase/assets/sand-sea.jpg](../../../examples/motion-showcase/assets/sand-sea.jpg) - [examples/motion-showcase/brief.md](../../../examples/motion-showcase/brief.md) - [examples/motion-showcase/report.md](../../../examples/motion-showcase/report.md) - [examples/motion-showcase/report.ru.md](../../../examples/motion-showcase/report.ru.md) - [examples/presentation/assets/demo.av1.mp4](../../../examples/presentation/assets/demo.av1.mp4) - [examples/presentation/assets/demo.chapters.vtt](../../../examples/presentation/assets/demo.chapters.vtt) - [examples/presentation/assets/demo.h264.mp4](../../../examples/presentation/assets/demo.h264.mp4) - [examples/presentation/assets/demo.poster.jpg](../../../examples/presentation/assets/demo.poster.jpg) - [examples/presentation/assets/demo.vp9.webm](../../../examples/presentation/assets/demo.vp9.webm) - [examples/presentation/brief.md](../../../examples/presentation/brief.md) - [examples/presentation/report.md](../../../examples/presentation/report.md) - [examples/presentation/report.ru.md](../../../examples/presentation/report.ru.md) - [examples/question-review/brief.md](../../../examples/question-review/brief.md) - [examples/question-review/report.md](../../../examples/question-review/report.md) - [examples/question-review/report.ru.md](../../../examples/question-review/report.ru.md) - [examples/research/assets/evidence-map-dark.ru.svg](../../../examples/research/assets/evidence-map-dark.ru.svg) - [examples/research/assets/evidence-map-dark.svg](../../../examples/research/assets/evidence-map-dark.svg) - [examples/research/assets/evidence-map.ru.svg](../../../examples/research/assets/evidence-map.ru.svg) - [examples/research/assets/evidence-map.svg](../../../examples/research/assets/evidence-map.svg) - [examples/research/brief.md](../../../examples/research/brief.md) - [examples/research/partials/method.md](../../../examples/research/partials/method.md) - [examples/research/partials/method.ru.md](../../../examples/research/partials/method.ru.md) - [examples/research/report.md](../../../examples/research/report.md) - [examples/research/report.ru.md](../../../examples/research/report.ru.md) - [examples/response-workspace/brief.md](../../../examples/response-workspace/brief.md) - [examples/response-workspace/report.md](../../../examples/response-workspace/report.md) - [examples/response-workspace/report.ru.md](../../../examples/response-workspace/report.ru.md) - [examples/review-workspace/brief.md](../../../examples/review-workspace/brief.md) - [examples/review-workspace/prior-review.json](../../../examples/review-workspace/prior-review.json) - [examples/review-workspace/report.md](../../../examples/review-workspace/report.md) - [examples/review-workspace/report.ru.md](../../../examples/review-workspace/report.ru.md) - [examples/run-report/brief.md](../../../examples/run-report/brief.md) - [examples/run-report/data/run.json](../../../examples/run-report/data/run.json) - [examples/run-report/report.md](../../../examples/run-report/report.md) - [examples/run-report/report.ru.md](../../../examples/run-report/report.ru.md) - [examples/showcase-contract.json](../../../examples/showcase-contract.json) - [examples/terminal-portfolio/assets/review-diff-dark.jpg](../../../examples/terminal-portfolio/assets/review-diff-dark.jpg) - [examples/terminal-portfolio/assets/review-diff.jpg](../../../examples/terminal-portfolio/assets/review-diff.jpg) - [examples/terminal-portfolio/brief.md](../../../examples/terminal-portfolio/brief.md) - [examples/terminal-portfolio/report.md](../../../examples/terminal-portfolio/report.md) - [examples/terminal-portfolio/report.ru.md](../../../examples/terminal-portfolio/report.ru.md) - [examples/tutorial/brief.md](../../../examples/tutorial/brief.md) - [examples/tutorial/report.md](../../../examples/tutorial/report.md) - [examples/tutorial/report.ru.md](../../../examples/tutorial/report.ru.md) - [examples/vendor-decision/assets/evidence-map-dark.ru.svg](../../../examples/vendor-decision/assets/evidence-map-dark.ru.svg) - [examples/vendor-decision/assets/evidence-map-dark.svg](../../../examples/vendor-decision/assets/evidence-map-dark.svg) - [examples/vendor-decision/assets/evidence-map.ru.svg](../../../examples/vendor-decision/assets/evidence-map.ru.svg) - [examples/vendor-decision/assets/evidence-map.svg](../../../examples/vendor-decision/assets/evidence-map.svg) - [examples/vendor-decision/brief.md](../../../examples/vendor-decision/brief.md) - [examples/vendor-decision/partials/gates.md](../../../examples/vendor-decision/partials/gates.md) - [examples/vendor-decision/partials/gates.ru.md](../../../examples/vendor-decision/partials/gates.ru.md) - [examples/vendor-decision/report.md](../../../examples/vendor-decision/report.md) - [examples/vendor-decision/report.ru.md](../../../examples/vendor-decision/report.ru.md) - [examples/visualization-catalog/brief.md](../../../examples/visualization-catalog/brief.md) - [examples/visualization-catalog/report.md](../../../examples/visualization-catalog/report.md) - [examples/visualization-catalog/report.ru.md](../../../examples/visualization-catalog/report.ru.md) - [extensions/focus-frame/README.md](../../../extensions/focus-frame/README.md) - [extensions/focus-frame/assets/bench.svg](../../../extensions/focus-frame/assets/bench.svg) - [extensions/focus-frame/assets/shoreline.svg](../../../extensions/focus-frame/assets/shoreline.svg) - [extensions/focus-frame/effect.mjs](../../../extensions/focus-frame/effect.mjs) - [extensions/focus-frame/example-field.md](../../../extensions/focus-frame/example-field.md) - [extensions/focus-frame/example-workshop.md](../../../extensions/focus-frame/example-workshop.md) - [extensions/focus-frame/extension.yaml](../../../extensions/focus-frame/extension.yaml) - [extensions/key-figure/README.md](../../../extensions/key-figure/README.md) - [extensions/key-figure/block.css](../../../extensions/key-figure/block.css) - [extensions/key-figure/example-benchmark.md](../../../extensions/key-figure/example-benchmark.md) - [extensions/key-figure/example-quarterly.md](../../../extensions/key-figure/example-quarterly.md) - [extensions/key-figure/extension.yaml](../../../extensions/key-figure/extension.yaml) - [extensions/key-figure/template.md](../../../extensions/key-figure/template.md) - [extensions/loom/README.md](../../../extensions/loom/README.md) - [extensions/loom/effect.mjs](../../../extensions/loom/effect.mjs) - [extensions/loom/example-craft.md](../../../extensions/loom/example-craft.md) - [extensions/loom/example-release.md](../../../extensions/loom/example-release.md) - [extensions/loom/extension.yaml](../../../extensions/loom/extension.yaml) - [extensions/product-theatre/README.md](../../../extensions/product-theatre/README.md) - [extensions/product-theatre/example-cli.md](../../../extensions/product-theatre/example-cli.md) - [extensions/product-theatre/example-dashboard.md](../../../extensions/product-theatre/example-dashboard.md) - [extensions/product-theatre/extension.yaml](../../../extensions/product-theatre/extension.yaml) - [extensions/product-theatre/scenario-cli.json](../../../extensions/product-theatre/scenario-cli.json) - [extensions/product-theatre/scenario-dashboard.json](../../../extensions/product-theatre/scenario-dashboard.json) - [extensions/product-theatre/script.mjs](../../../extensions/product-theatre/script.mjs) - [extensions/product-theatre/script.yaml](../../../extensions/product-theatre/script.yaml) - [extensions/product-theatre/template.md](../../../extensions/product-theatre/template.md) - [extensions/slo-budget/README.md](../../../extensions/slo-budget/README.md) - [extensions/slo-budget/app.js](../../../extensions/slo-budget/app.js) - [extensions/slo-budget/example-guide.md](../../../extensions/slo-budget/example-guide.md) - [extensions/slo-budget/example-incident.md](../../../extensions/slo-budget/example-incident.md) - [extensions/slo-budget/extension.yaml](../../../extensions/slo-budget/extension.yaml) - [extensions/slo-budget/index.html](../../../extensions/slo-budget/index.html) - [extensions/slo-budget/style.css](../../../extensions/slo-budget/style.css) ## Compatibility and limits Read [the catalog](catalog.md) for all page/theme fields, directive attributes, numeric limits and commands. A directive supports only its declared parents, forms and combinations. Print, script-free and reduced-motion equivalents remain available. A scroll scene needs scroll input; pointer depth and tilt need a fine pointer; a filmed composition needs the compatible narration clock. Browser frames need a real address or an illustration label. Sample facts in examples are not product evidence. The capability tour, motion showcase and catalogs demonstrate a wide vocabulary deliberately. Their dense combinations are demonstrations rather than recommended default films. Compare them with the document, incident, architecture, launch, research and answer examples to see quieter alternatives. An example source and its built interactive page are the evidence of its implementation; an old brief may describe its motion more narrowly.