fix(compare): lift z-index of model-picker-wrap when picker is open

[CodeRulerNo1]

Summary

When the Compare setup modal (#compare-model-overlay) is open, clicking the main model picker button in the chat box opens the model picker dropdown menu (#model-picker-menu) behind/underneath the Compare setup modal.

This happens because the .chat-input-bar container uses container-type: inline-size; (for container queries), which creates a locked stacking context under CSS containment rules. This traps any z-index of the model picker inside the input bar.

This PR fixes the issue by dynamically elevating the entire .chat-input-bar's z-index and position (position: relative; z-index: topPortalZ()) when the model picker is opened and restoring it when closed, allowing the menu to correctly render on top of the modal.

Target branch

• This PR targets dev, not main. All PRs land in dev; main is curated by the maintainer at each release. If your PR is on main by accident, click "Edit" on this PR and change the base.

Linked Issue

Fixes #5542

Type of Change

• Bug fix (non-breaking — fixes a confirmed issue)
• New feature (non-breaking — adds new behaviour)
• Breaking change (changes or removes existing behaviour)
• Refactor / cleanup (behaviour unchanged)
• Documentation only
• CI / tooling / configuration

Checklist

• I searched open issues and open PRs — this is not a duplicate.
• This PR targets dev
• My changes are limited to the scope described above — no unrelated refactors or whitespace changes mixed in.
• I actually ran the app (docker compose up or uvicorn app:app) and verified the change works end-to-end. Type-checks and unit tests are not enough.

How to Test

1. Open the app and click the "Compare" button in the sidebar. This opens the "Model Comparison" setup modal.
2. In the background chat bar, click the "Select model" dropdown button (the main model picker).
3. Verify that the model picker dropdown menu opens on top of the Compare setup modal, rather than behind/underneath it.
4. Close the model picker and verify that .chat-input-bar's position and z-index return to normal.

Visual / UI changes — REQUIRED if you touched anything that renders

Anything that changes what the UI looks like — buttons, icons, padding, colors, fonts, spacing, layout, CSS, HTML, SVG, or any static/js/ module that draws to the DOM — needs all of the following. PRs that change rendering without these WILL be closed.

• Screenshot or short clip of the change in the running app, attached below. Mobile screenshot too if the change affects mobile.
• Style match: the change uses Odysseus's existing visual language. Specifically:
  • Reuse existing CSS variables (--red, --fg, --bg, --card, --border, etc.) — do not introduce new color values, font sizes, or spacing units.
  • Reuse existing button/input/card/border classes. Don't invent parallel styling.
  • No Unicode emoji in UI or code. Use inline SVG (matching the monochrome icon style already in static/index.html) or plain text.
  • Monospaced font (Fira Code) for primary UI text. Don't override.
  • Dark theme is the default; any light-mode work must be wired through the existing theme system, not hard-coded.
• No new component patterns. If a similar widget already exists in the app, extend it instead of writing a parallel one.
• I am not an LLM agent submitting a bulk PR. If you are, please open an issue describing the problem first — bulk auto-generated PRs that don't match the project's visual style are closed on sight, even when the underlying fix is correct.

Screenshots / clips

None (pure stacking-context layer issue fix, layout structure and visual styles remain identical).