Add a note for the transcript (optional, saved with this step):

</div>

<div class="fr-runner-transcript">
                            <strong>Transcript so far</strong>
                            <div t-out="markup(state.data.transcript_html || '')"/>
                        </div>
                    </div>
                </t>

<t t-if="state.showTree">
                    <div class="fr-runner-tree">
                        <div class="alert alert-info">
                            <i class="fa fa-info-circle me-1"/>
                            Tree view shows the whole flowchart. The yellow-highlighted
                            node is the current step. Visited nodes are green. Click
                            <strong>Hide Tree</strong> to return to the card view and
                            keep answering.
                        </div>
                        <div t-ref="treeCanvas"
                             class="drawflow"
                             style="height: calc(100vh - 220px); background: #f3f4f6; border: 1px solid #d8dadd; border-radius: 6px;"/>
                    </div>
                </t>

</div>
        </div>
    </t>

</templates>