Navigate to snapshots from the transcript

web/style.css

@@ -709,6 +709,34 @@ button.compact.danger {
   color: var(--danger);
 }
 
+.snap-mark {
+  float: right;
+  margin-left: 12px;
+  padding: 0 6px;
+  border-radius: 4px;
+  font-size: 11px;
+  color: var(--accent);
+  background: transparent;
+}
+
+.turn-end:not(.error):has(.snap-mark) {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.turn-end:not(.error):has(.snap-mark)::before {
+  content: "";
+  flex: 1;
+  height: 1px;
+  background: var(--border);
+}
+
+.turn-end:not(.error) .snap-mark {
+  float: none;
+  margin-left: 0;
+}
+
 .note.ask {
   color: var(--accent);
 }
@@ -862,6 +890,23 @@ details.note .md {
   color: var(--muted);
 }
 
+.changes-where {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  min-width: 0;
+}
+
+.snap-where {
+  font-size: 12px;
+}
+
+.snap-step {
+  padding: 0 6px;
+  border-radius: 4px;
+  font-size: 11px;
+}
+
 .adds {
   color: var(--ok);
 }