Prerequisites

• I searched open issues and discussions and did not find an existing report of this bug.
• This is not a security vulnerability. (Vulnerabilities go to GitHub Security Advisories — see SECURITY.md.)
• I am running the latest code from the dev branch (the default branch you get on clone, where fixes land first) and the bug still reproduces there. Please git pull the latest dev before filing.

Install Method

Docker (docker compose up)

Operating System

Linux

Steps to Reproduce

1. docker compose up -d --build and open the chat in a browser.

2. Get the assistant to reply with a Mermaid diagram. A reliable prompt is "Reply with exactly this and nothing else:" followed by a fenced mermaid block:

   ```mermaid
   flowchart TD
     Start([Start]) --> Process[Process]
     Process --> Decision{Decision}
     Decision -->|Yes| End([End])
     Decision -->|No| Process
   ```
   

3. Open the theme picker and switch to a light preset (for example light or paper), then look at the diagram. Also try switching the theme after the diagram has already rendered.

The renderer is renderMermaid / initMermaid in static/js/markdown.js; the behaviour is independent of which model/backend produced the diagram text.

Expected Behaviour

The diagram follows the active palette: the page background, panel-coloured node fills, accent-coloured node borders, and foreground-coloured text, in the app's monospace font. Switching to a different theme re-renders any on-screen diagram so it matches the new palette.

Actual Behaviour

• Every diagram is drawn with Mermaid's built-in dark theme regardless of the active palette. On any light theme the diagram is dark-filled with light text sitting on a light page — low contrast and clearly clashing with the rest of the UI.
• Switching the theme at runtime does not update a diagram that is already on screen; it keeps whatever theme was active when it was first drawn.

Root cause: initMermaid() in static/js/markdown.js calls window.mermaid.initialize({ startOnLoad: false, theme: 'dark', securityLevel: 'loose' }) — a hard-coded theme: 'dark', initialised exactly once (guarded by window.__odysseusMermaidReady). Mermaid bakes colours into the SVG at render time, so the diagram never tracks the app's CSS variables, and there is no re-initialise/re-render when the palette changes.

Logs / Screenshots

Before/after screenshots (desktop and mobile) are attached to the PR that fixes this.

Model / Backend (if relevant)

Not relevant — client-side rendering.

Are you willing to submit a fix?

Yes — I can open a PR.

Additional Information

The fix drives Mermaid's themeable base theme from the app's existing CSS variables (--bg, --panel, --fg, --border, --accent / --red, --font-family) via themeVariables, re-initialises Mermaid when the palette signature changes, and adds a debounced listener that re-renders on-screen diagrams on a theme switch. It stays on the CDN-loaded Mermaid and only changes the theming — no new colours, fonts, or components. PR to follow, targeting dev.