Add the Translate transcript panel with its own exports

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/index.css

@@ -1006,3 +1006,122 @@ code {
   align-items: center;
   gap: 0.5rem;
 }
+
+/* --------------------------------------------------------------------------
+   Transcript translation (D-WS4b): a secondary disclosure under the
+   transcript, same panel language as .storage-manager.
+   -------------------------------------------------------------------------- */
+
+.translate-panel {
+  background: var(--panel);
+  border: 1px solid var(--border);
+  border-radius: 12px;
+  padding: 0.75rem 1rem;
+}
+
+.translate-panel summary {
+  cursor: pointer;
+  font-weight: 600;
+}
+
+.translate-controls {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 0.5rem 0.75rem;
+  margin-top: 0.75rem;
+}
+
+.translate-direction {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  font-size: 0.85rem;
+  color: var(--muted);
+  min-width: 0;
+}
+
+.translate-direction select {
+  min-width: 0;
+  max-width: 100%;
+  background: var(--surface-raised);
+  color: var(--fg);
+  border: 1px solid var(--border);
+  border-radius: 8px;
+  padding: 0.3rem 0.5rem;
+  font-size: 0.85rem;
+}
+
+.translate-button,
+.translate-cancel {
+  border: 1px solid var(--border);
+  background: transparent;
+  color: inherit;
+  border-radius: 8px;
+  padding: 0.3rem 0.9rem;
+  font-size: 0.85rem;
+  cursor: pointer;
+  white-space: nowrap;
+  transition: border-color 0.15s, color 0.15s;
+}
+
+/* The panel's one action reads as the action: accent outline, like a
+   focused copy button, without competing with the transcript above. */
+.translate-button {
+  border-color: var(--accent);
+  color: var(--accent);
+}
+
+.translate-button:hover:enabled {
+  background: var(--accent);
+  color: var(--on-accent);
+}
+
+.translate-button:disabled {
+  opacity: 0.5;
+  cursor: default;
+}
+
+.translate-cancel:hover {
+  border-color: var(--danger-border);
+  color: var(--danger);
+}
+
+.translate-hint {
+  margin: 0.6rem 0 0;
+  max-width: 65ch;
+  color: var(--muted);
+  font-size: 0.85rem;
+}
+
+.translate-model-id {
+  margin-top: 0.25rem;
+  font-size: 0.75rem;
+}
+
+.translate-model-id code {
+  overflow-wrap: anywhere;
+}
+
+.translate-progress {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 0.4rem 0.75rem;
+  margin-top: 0.75rem;
+  font-size: 0.85rem;
+}
+
+.translate-status {
+  font-variant-numeric: tabular-nums;
+}
+
+.translate-progress progress {
+  flex: 1 1 10rem;
+  height: 6px;
+  accent-color: var(--accent);
+}
+
+.translate-error {
+  margin-top: 0.75rem;
+}