dsh-model-think-level 1.0.1 → 1.0.2

package/README.md

@@ -1,181 +1,12 @@
 # DSH Model Think Level
 
-<p align="center">
-  <picture>
-    <source media="(prefers-color-scheme: dark)" srcset="docs/banner-dark.svg">
-    <img src="docs/banner.svg" alt="DSH Model Think Level" width="720">
-  </picture>
-</p>
+DSH 的第三方模型补齐思考等级：在官方 Models 页每个模型行注入 Thinking 开关和强度/模态编辑器，在输入框模型菜单加供应商→模型选择器、视觉徽章与等级行，并带搜索、拖拽排序、供应商启用开关；以及按路由接管请求头与 user-agent。
 
-[![License](https://img.shields.io/badge/License-MIT-yellow.svg)](LICENSE)
-[![npm version](https://img.shields.io/npm/v/dsh-model-think-level)](https://www.npmjs.com/package/dsh-model-think-level)
-[![npm downloads](https://img.shields.io/npm/dw/dsh-model-think-level)](https://www.npmjs.com/package/dsh-model-think-level)
-![DeepSeek Harness](https://img.shields.io/badge/DeepSeek%20Harness-plugin-4d6bfe)
-[![Awesome DSH Plugin](https://awesome-dsh-plugin.com/badge.svg)](https://awesome-dsh-plugin.com)
+模型选择器
+![alt text](./docs/image.png)
+![alt text](./docs/image2.png)
 
-**English** | [中文](README.zh.md)
-
-Thinking levels, vision badges and request headers for **third-party models** in DeepSeek Harness — a provider → model picker with capability icons inside the official composer menu, a one-switch thinking gate plus auto-adapted levels inside the official Models page card, and per-route request headers. A renamed derivative of [dsh-better-reasoning-effort](https://github.com/HaoyueQin/dsh-better-reasoning-effort) — see [Acknowledgements](#acknowledgements).
-
-<p align="center">
-  <img src="docs/demo.svg" alt="demo" width="640">
-</p>
-
-<p align="center">
-  <img src="assets/models-page-effort-editor.png" alt="The thinking-effort editor injected into a model row on the official Models page" width="720">
-</p>
-
-## Why
-
-The `llm-pi-ai` adapter natively supports per-model `reasoningEfforts` and `input` declarations, but the official Models page editor deliberately keeps both fields out of reach. As a result, third-party models get **no thinking-level picker** in the composer, only the official DeepSeek API can set reasoning effort, hand-declared models are treated as **text-only**, and configuring any of this meant hand-writing `settings.yaml` blocks. This plugin brings both configuration surfaces back into the UI: edit inside the official model editor card, plus one-click auto-adapt.
-
-## Features
-
-- **In-page editor** — a **Thinking** switch plus a reasoning-effort block appears under each model row's disclosure on the official Models page (levels, default effort, input modalities, endpoint compatibility), committing with the card's own **Save**; changes stay pending until then, and **Cancel** discards them with the card's fields. The switch sits **outside** that block and gates it: switched off, the model is written as not reasoning and the whole block is not rendered — one row is all an un-thinking model shows.
-- **Auto-adapt** — one click fills recommended levels, wire spellings and modalities from a built-in knowledge base (65 entries across 15 vendors — see [Supported models](docs/supported-models.md)), wire-protocol inference, and a same-origin probe of the provider's raw `/models` listing, every suggestion labeled by confidence; reference capacities show as read-only hints you copy yourself. Beside the official **Get available models** link at the head of a provider's model list sits the plugin's own **Auto-detect thinking levels** (自动获取思考等级): one click runs that same adaptation over **every model of that provider at once**, so a newly added gateway does not need one click per row. It is deliberately the per-model action repeated, not a second write path — each mounted row runs its own auto-adapt and commits through the card's own pending state — so the result is byte-identical to clicking each row in turn, a read-only row or a save already in flight is skipped rather than raced, and the passes are queued one after another because each one reads the provider's own model list.
-- **Auto-fill** — models without a declaration are filled at boot and when added mid-session (opt out via `autofill: false` / `modalityAutofill: false`); explicit declarations, `false` and deliberately-unset markers are never touched.
-- **Three intents** — all levels off = unset (back to inheritance); only `off` = disable reasoning; levels armed = write the declaration.
-- **Composer model & reasoning rows** — the official model menu's body renders a **Model** row and a **Reasoning level** row. The model row opens a provider column with that provider's models beside it, every entry carrying vision / thinking badges and the current pick marked in accent colour (no tick, so it cannot be mistaken for a badge); the reasoning row opens the model's own level list. The official trigger stays untouched, picks are optimistic and roll back on refusal, the popover stays open after a model switch so the level can be chosen next, and model switches keep your level through a per-session memory chain (issue #4's per-model default effort outranks it across sessions).
-- **Composer model search** — a filter box above the official model list (provider / model / id tokens), always on.
-- **Per-model default effort** — a "Default effort" picker on each model row, stored in the settings document; every new session starts the model there.
-- **Request headers & `user-agent`** — a provider-card section edits the official `headers` field (masked, path-merged, Save-gated), and the plugin performs the `user-agent` override at the fetch layer per **provider route**, because the official adapter reserves that name. Routes that share one endpoint are told apart by their `baseURL` path and by the `model` carried in the request body, so each provider keeps its own identity; a request that identifies no single route falls back to the first declarer and the overlap is reported rather than guessed. Same-origin `/models` probes are covered.
-- **Tabbed provider editor** — the provider card's one long column (identity fields, model list, request headers) is re-presented as three tabs — **Provider / Models / Advanced** (供应商配置 / 模型配置 / 高级配置) — with a segmented control that the plugin renders inside its own request-header section, above the panes. The official fields never move: each region is tagged and the visibility is decided in CSS, so the card's own Save/Cancel row stays put and an official redesign degrades back to the single-column editor untouched. The official "Customized" disclosure that folds the identity fields and the model list together is sorted into its panes and stays expanded for as long as the tabs are in charge. The editor's own header — the provider name and route tag printed at the top of the pane — repeats the card row sitting directly above it, so it is hidden on every tab; and the Models pane drops both of its hairlines — the "Customized" group's separator and the catalogue's own — together with every top padding that held content off them. Neither has anything to divide here: the identity fields the group's rule separated it from are not in this pane, and the tab bar above already ends the pane. What is left runs from the tab bar into the catalogue with only the editor's own 14px gap between blocks — no doubled line, and no blank space where a line used to be. The tags land in the same frame the official editor is committed in, so opening a card shows the tabbed editor directly — never the single column first, re-sorting itself a moment later. The same visit dresses the API-key field with a trailing **eye**: one click unmasks what is being typed or pasted just now, and on a saved provider it **fetches the stored key and puts it back into the field**. The eye belongs to that input, so both step aside on the cards the key manager takes over: the list below is where a key gets written there, and two ways to write one key on one card read as a conflict. The official page is write-only by design — the settings document carries only the profile's `apiKeyEnv` reference and the credential service never returns a value — so the plugin's own host route (`GET /dsh-model-think-level/provider-key?route=<route>`, the same trust fence as the raw-models probe) resolves it for the page, uncached and never logged. The read happens only on that click and only while the field is empty: a draft you typed is never overwritten, hiding gives a borrowed key back (an empty field is exactly what the official form reads as "keep the stored key"), and a resolve that comes back empty leaves the field masked with the reason in the button's tooltip. The mask and the button both go when the takeover withdraws. The **Advanced** tab is never collapsible: it holds the request-header section alone now, so folding it would leave the pane empty — the section keeps its disclosure header only while other regions still share the pane, and renders as a plain heading on its own tab.
-- **Per-provider key manager** — the API-key field grows the provider's whole key list **inline, directly beneath the field**: one bordered list whose rows are every key configured for that provider route, closed by a full-width **Add another key** row. There is no icon chip, no `+` button and no floating panel — no key glyph sitting beside the official "API key" label printing the same word twice, and no layer to position against the dialog's opaque mask. Each row is the key's name — the alias — followed by its **masked** value, or the masked value alone when the row was never named (the mask is composed host-side, because only the host can resolve a stored credential), and closes on the **enable** radio: one circle per row, one enabled key per provider, so picking a row is what puts that key in use. Hovering a row — or focusing into it — reveals exactly three actions and nothing else: **Delete** (asks twice), **Alias** (renames only) and **Change key** (replaces that row's stored value). All three, plus adding, use the one form that opens **below the affected row** — name on the left, `Paste API key` on the right, then **Cancel** and the confirm button — never a dialog, and the value never leaves the host except as a mask. Exactly one key per route is in use, and enabling one writes the profile's `apiKeyEnv` — the single reference the adapter resolves — so the key in use is the same one the official page, the composer and every other consumer of that profile use, not a plugin-local notion. Labels are plugin state: the credential store has no enumeration and no labels, so the list lives in `<harness home>/dsh-model-think-level/key-index.json` — references and labels only, never a value — kept beside the harness home rather than inside the pi-ai profile, because the official add-provider card writes the whole profile at `providers.<route>`. Adding a key mints the next free reference server-side in one write (`ROUTE_API_KEY`, then `_2`, `_3`, …), stores the value **first** and lists it only once the store accepted it; removing the key in use hands the seat to the next listed key **before** the value is forgotten, and removing the last key clears the reference. A key whose value the store no longer holds stays listed and is flagged, so it can be re-added or removed. The list and its form are plugin-owned DOM in a host div appended as the key field's **next sibling** — the same anchored leaf the reveal eye is measured against — so they sit inside the dialog's own layout and need no z-index of their own; the form closes on **Cancel** or on a successful commit, and the host is swept on teardown, on a route change and when the pane leaves the provider tab.
-- **Provider-list rows** — the official list of provider cards is dressed from the plugin side: each row carries an enable **switch** (switching a provider off greys its name and identity) and can be reordered by dragging its grip — the insertion line that says which side the row would land on is drawn above the settings dialog, so it is not swallowed by the overlay's opaque mask. Its action column also stays aligned, because the host renders a delete button only for a provider it allows removing — a built-in such as DeepSeek rendered none at all, so that row's remaining actions started further right than its neighbours'. The plugin fills that hole with a disabled **Delete** placeholder wearing the official row metrics (28px tall, the row's 12px label) at the host's own 40% disabled opacity, labelled with the host's own word for the action and tooltipped "a built-in provider cannot be deleted". The placeholder is handed back the moment the host renders its own button, and swept on teardown.
-- **Defensive injection** — everything keys off the official page's DOM; if an official upgrade changes the structure, injection simply pauses and the official page is unaffected.
-- Bilingual copy (中文 / English).
-
-## Supported models
-
-The auto-adapt knowledge base carries **65 curated entries across 15 vendors** (DeepSeek, OpenAI, Anthropic Claude, Gemini, Grok, Qwen, GLM, Kimi, Mistral, MiniMax, MiMo, Doubao, Hunyuan, Step, ERNIE — re-verified against official docs 2026-08/09, including vision-capable variants and no-effort-control families). The full table — match patterns, level → wire-spelling ladders, defaults, modalities, reference capacities — lives in **[docs/supported-models.md](docs/supported-models.md)** (generated from [`src/knowledge.ts`](src/knowledge.ts), the authoritative source). Unlisted models fall back to protocol inference + generic levels, adjustable by hand.
-
-## Install
-
-Requires DeepSeek Harness **`0.1.5-alpha.1` or later** (per-line peer ranges; the `0.1.2-rc` / `0.1.3-alpha` lines are no longer supported — use plugin `0.3.7` there). Compiled and gated against `0.2.0-rc.1`. The per-kernel seam re-checks behind this live in [docs/compatibility-notes.md](docs/compatibility-notes.md).
-
-```bash
-# from npm, under the dsh web profile
-dsh plugin --profile web add dsh-model-think-level
-
-# or from GitHub (source install; `lib/` builds via the prepare hook — the
-# installer prints the `allowBuilds` key it needs, follow that and re-add)
-dsh plugin --profile web add github:GaoHu1997/dsh-model-think-level
-
-# or link a local checkout for development
-npm install && npm run build
-dsh plugin --profile web add link:D:/Project/dsh-model-think-level
-```
-
-Restart `dsh web` and hard-refresh the browser.
-
-## Usage
-
-1. Configure a third-party provider (API key etc.) on the official Models page.
-2. Expand a model row: the **Thinking** switch sits above the effort block, and the block sits under the official capacity fields.
-   - Leave **Thinking** on to configure levels. Switch it **off** and the model is saved as not reasoning — the whole effort block disappears with it, leaving just the switch row.
-   - Check levels (off / minimal / low / medium / high / xhigh / max) and fill the wire values (e.g. give `high` the spelling `ultra`, and the gateway receives `ultra` when you pick High in the composer);
-   - Toggle **Image input** under *Input modalities* to declare what the model accepts;
-   - Click **Auto-adapt** to fill recommended levels and modalities — reference capacities show up as read-only hints you copy into the official fields yourself;
-   - Any change is **pending** and lands when you press the card's own **Save**; **Cancel** (or a reload) discards it with the card's fields.
-3. Above the model list, beside the official **Get available models** link, **Auto-detect thinking levels** runs that same adaptation over **every model of the provider at once** — one click instead of one per row. Each mounted row still runs its own auto-adapt and commits through the card's own pending state, so the outcome is what clicking **Auto-adapt** on every row in turn would produce; the passes are queued, because each one reads the provider's own model list.
-4. On a compatible protocol, the *Endpoint compatibility* section appears at the bottom — thinking budget field / vLLM priority on `openai-completions`, `max_output_tokens` handling on `openai-responses`.
-5. All levels off + Save = unset the declaration; only `off` checked + Save = disable reasoning (`false`); *Clear declaration* + Save = back to inheriting the provider default.
-6. In the composer, open the model menu: the **Model** row lists providers on the left and that provider's models on the right — each model carries an eye badge when it accepts images and a sparkle badge when it reasons — and the **Reasoning level** row lists the levels of the current model. Picking a model closes its list but keeps the menu open, so the level can be picked right after.
-
-7. The API-key field carries that provider's key list **inline**: the radio marks the key in use (the one the profile's `apiKeyEnv` points at), **Add another key** opens the form beneath the list, and hovering a row offers **Delete**, **Alias** and **Change key**.
-
-Declared models are immediately selectable for reasoning effort in the composer, and image-declared models accept attachments end to end.
-
-## Configuration
-
-Optional on the plugin's profile row (values shown are the defaults):
-
-```yaml
-- insert:
-    - id: dsh-model-think-level
-      name: dsh-model-think-level
-      config:
-        autofill: true          # auto-fill undeclared models at boot
-        modalityAutofill: true  # whether the boot fill also covers modalities
-        probeTimeoutMs: 15000   # /models probe fetch timeout
-        bootRetryDelaysMs: [1000, 2000, 4000, 8000, 16000, 30000]
-        defaultGuard: true      # map effort-less calls on forced-thinking
-                                # ladders to the vendor default
-```
-
-## How it works
-
-```
-Browser (lib/client.js)                  Host (lib/index.js)
-├─ DOM injector                          └─ Auto-fill
-│   MutationObserver on the models page      settings/document-updated →
-│   → mounts EffortEditor in each            invalidates the host cache;
-│     model row's disclosure                 browser idle pass fills models
-├─ Composer injection
-│   MutationObserver on the document
-│   → ComposerSlider (root pane)
-│   → model search box (model-list pane)
-├─ EffortEditor (React component)             (knowledge base + inference)
-│   level checkboxes / wire values /
-│   input-modality toggle /
-│   auto-adapt (zoned suggestions) / committed with the card's Save
-│   └─ writes settings.mutate (llm-pi-ai)
-├─ Key manager (provider card)
-│   inline key list under the key field; add / alias / change-value
-│   forms open under the affected row (one key in use per route)
-│   └─ host route: key index + credentials (enable = apiKeyEnv write)
-├─ Auto-detect thinking levels (catalogue head)
-│   a seat beside the official "Get available models" link → one
-│   event → every mounted row of that provider runs its own auto-adapt
-```
-
-- `suggestEfforts()` in `src/knowledge.ts` is the knowledge base + inference engine — a pure function shared by host and browser.
-- `reconcile()` in `src/client/injection/models-page-editor.ts` locates model rows and mounts the editor; `src/client/index.ts` assembles the browser half, one module per seam in `src/client/injection/`.
-- `reconcileEditorTabs()` in `src/client/injection/editor-tabs.ts` re-presents the open editor card as three tabs (Provider / Models / Advanced) — it tags each region and stamps the card with the active tab; the visibility is decided in the stylesheet, so no official node ever moves. The bar is React-rendered by `src/client/injection/editor-tab-bar.ts` inside the plugin's own request-header mount, so it is plugin-owned DOM rather than a foreign node in the official child list; the pass only classifies, tags and labels it. The same visit calls `revealKeyField()` in `src/client/injection/key-reveal.ts`, which gives the API-key field its reveal eye — the one node this plugin appends to official DOM, a positioned leaf removed again on teardown. It unmasks a draft in place, and for a saved provider it asks the host for the stored credential through `PROVIDER_KEY_PATH` in `src/constants.ts` (registered in `src/index.ts` beside the raw-models probe, under the same trust fence and explicitly uncached), writing the answer into the official input through the prototype value setter plus a bubbling `input` event so the official component adopts it; a reveal is always borrowed, so hiding empties the field again — which is what the official form reads as "keep the stored key". The compare-before-write helpers shared by the tab pass and the key reveal live in `src/client/injection/dom.ts`.
-- `enhanceKeyManagerField()` in `src/client/injection/key-manager.ts` owns the inline key list under the API-key field (the eye stays in `key-reveal.ts`) and the host div the list and its form mount into; while the list is mounted the field's own input is hidden by the stylesheet, because the list says the same thing once per key and both in one card read as a conflict — the input stays in the DOM, so the official form still owns it and unmanaging the field brings it back; the list itself is the React component in `src/client/KeyManager.tsx`, which talks to the host through `src/client/key-manager-client.ts` (`KEY_INDEX_PATH`) — `list`, `add`, `enable`, `rename`, `replace` and `remove`. The host route in `src/index.ts` reads and writes the plugin's index through `src/key-index.ts` and moves the "in use" seat with `settings.mutate(llm-pi-ai, { op: 'set' | 'unset', path: ['providers', route, 'apiKeyEnv'] })`, retrying once on a revision conflict; reference minting, validation and alias normalisation are shared with the browser half through `src/key-refs.ts`, which also composes the mask (`first4…last4`, or a fixed dot run below twelve characters) so no unmasked value ever crosses the host boundary. The injected leaf is compared against the field's next sibling before it is appended, so a settled pass emits no mutation and cannot retrigger the page observer.
-- `reconcileAutoEffortSeats()` in `src/client/injection/auto-effort-seat.ts` renders the provider-wide seat into the open card's catalogue head — one raw-DOM button after the official **Get available models** link, matched by position because that link's own label swaps to a fetching state mid-request, and identified by `data-bre-auto-effort`, which carries the route. The click publishes `AUTO_EFFORT_EVENT` (`src/client/auto-effort.ts`) instead of writing anything: the seat holds no write path of its own, so `EffortEditor` listens, checks the route against its own, and queues its own `autoAdapt()` — the queue is a single promise chain, so passes run one at a time in arrival order and a failure never stops the next. The seat reconciles on every pass (idempotently — a settled pass emits no mutation), re-reads the route at click time so a retyped Provider ID is followed, and is swept both in the pass's own early-exit branches and on teardown.
-- `createEditorApi()` in `src/client/ops.ts` writes the declarations via `settings.mutate`, preserving every other row field and retrying once on a revision conflict.
-
-## Development
-
-```bash
-npm run typecheck   # tsc strict check on src
-npm test            # vitest: knowledge / inference / autofill / DOM injection / writing
-npm run build       # lib/*.js + lib/client.js (module-loader bundle)
-```
-
-Compiled and gated against the `0.2.0-rc.1` official packages; see [docs/compatibility-notes.md](docs/compatibility-notes.md) for the per-kernel records.
-
-## Known limitations
-
-- Injection depends on the official Models page's DOM (aria-label/class); an official upgrade may pause injection until adapted — the official page is unaffected meanwhile.
-- The auto-adapt probe route answers **loopback and IP-literal hosts only** (the core `/api` Host-allowlist discipline without `trustedHosts`), and **never follows redirects** — a gateway listing its models only behind a 30x simply yields no endpoint evidence; Auto-adapt falls back to the knowledge base and protocol inference.
-- `reasoningEfforts` declarations are suggestions — what an endpoint actually accepts is up to its docs; tweak in the UI. The knowledge base is not exhaustive; families without an effort ladder carry no entry at all.
-- Endpoint-compatibility switches are never auto-filled by design: they describe a gateway, not a model.
-- The modality vocabulary follows pi-ai's core (`text` / `image` today); wider gateway support (PDF, audio, video) is recorded per family until the core vocabulary grows.
-- Name-heuristic modality advice (vision-flavored ids) is deliberately low-confidence and labeled as such.
-- Self-hosted relays: auto-fill pins `supportsDeveloperRole: false` on routes no official host claims (some upstreams reject the `developer` role); explicit values are never overwritten.
-- Forced-thinking models (ladders without `off`, e.g. GLM-5.3): effort-less calls map to the vendor default instead of sending `thinking: disabled` — set `defaultGuard: false` to restore raw behavior.
-- **Credentials inside `headers` are not redacted on disk**: the read-only view masks them, but the settings document still holds them in clear text — treat it like an API key.
-- **The request-header section's edit-state detection reads an unofficial signal** (the official row exposes no data attribute for its editor state); if an official build renames that class root, the section stops appearing — never breaking the page.
-- **Only one `user-agent` rewrite should be active**: sibling header plugins land on the same layer; the plugin detects and reports known ones, but the last writer on the wire wins.
-- The request-layer takeover relies on the official adapter creating a fresh SDK client per request — guarded by an end-to-end test that fails loudly if that changes.
-- **The per-provider key list is plugin state** (`<harness home>/dsh-model-think-level/key-index.json`): references and labels only, never a value, but removing a key forgets its value from the credential store, and uninstalling the plugin leaves the file behind. If a key is renamed or enabled from another window while the card is open, reload it (the list reads when the card opens, not live).
-
-## Acknowledgements
-
-This plugin is a renamed derivative of **[dsh-better-reasoning-effort](https://github.com/HaoyueQin/dsh-better-reasoning-effort) by [HaoyueQin](https://github.com/HaoyueQin)** (MIT). The request-header layer, the model knowledge base, the auto-adapt / auto-fill pipeline and the Models-page editor all come from that project — thank you for the original work. What changed here: the composer's effort slider was replaced by a provider → model picker plus a reasoning-level list, model entries gained vision / thinking badges, the selection tick was dropped in favour of an accent colour, and the per-model editor gained the master **Thinking** switch that gates it.
-
-That project's own composer slider was **adapted from [dsh-reasoning-effort](https://github.com/HanaAyane/dsh-reasoning-effort) by [HanaAyane](https://github.com/HanaAyane)** (MIT); it is no longer shipped here, but the credit stands for the lineage. If you used the upstream plugin, remove it to avoid two effort controls on the same seat:
-
-```bash
-dsh plugin --profile web remove dsh-reasoning-effort
-```
-
-## Activity
-
-[![GaoHu1997/dsh-model-think-level GitStock K-Line Chart](https://gitstock.org/GaoHu1997/dsh-model-think-level/stock.svg)](https://gitstock.org/GaoHu1997/dsh-model-think-level/stock.svg)
-
-## License
-
-MIT
+供应商配置
+![alt text](./docs/image3.png)
+![alt text](./docs/image4.png)
+![alt text](./docs/image5.png)

package/lib/client/injection/model-menu.d.ts

@@ -1,26 +1,50 @@
 /**
- * Locating the official composer model menu — the seat root's open popover.
+ * Locating the official composer model seat — the ONE surface this plugin may
+ * decorate with a provider prefix.
+ *
+ * Everything in this module is scoped to the composer card
+ * (`[data-composer-card]`, owned by InputBar) and, inside it, to the model
+ * seat's own slot anchor. That scope is not a convenience: the shell renders
+ * several `button[aria-haspopup="menu"]` elements (the settings sidebar's
+ * account button, the composer's permission selector, …), so a document-wide
+ * search hands back a button this plugin does not own and paints the provider
+ * prefix on a host surface's label. When the seat cannot be identified the
+ * finders return undefined — the prefix is simply not shown, never stamped on
+ * someone else's control.
  *
  * @module dsh-model-think-level/client/injection/model-menu
  */
 /**
  * The official composer model menu: the seat root's open popover.
  *
- * Shape-tolerant across kernels: 0.1.5 portals the menu to document.body
- * and links it from the seat trigger via aria-controls, while older kernels
- * render it inline right after the trigger. Both shapes keep
+ * Shape-tolerant across kernels: newer kernels portal the menu to
+ * document.body and link it from the seat trigger via aria-controls, while
+ * older kernels render it inline right after the trigger. Both shapes keep
  * aria-haspopup="menu" on the trigger and role="menu" on the menu, so the
- * controls link is the primary route and the sibling check stays as the
- * fallback. Trigger search stays scoped to the composer card, so other
- * seats' menus never match; no copy text is read, so every locale matches.
+ * controls link is the primary route and the sibling check stays the fallback.
+ *
+ * The search NEVER leaves the composer card. When no card is mounted there is
+ * no model seat, and answering with some other surface's menu is exactly the
+ * cross-surface confusion this scoping exists to prevent.
+ *
+ * @param doc - the document to search.
+ * @returns the open model menu, or undefined while it is closed.
  */
 export declare function findModelMenu(doc?: Document): HTMLElement | undefined;
 /**
  * The official composer model trigger.
  *
- * The trigger remains in the composer card while its menu is closed, so this
- * finder keeps the menu lookup's linked and inline checks for an open menu but
- * falls back to the card's model-menu trigger when the popover is absent.
+ * The trigger stays in the card while its menu is closed, so this finder keeps
+ * the menu lookup's linked and inline checks and then falls back to the seat
+ * the closed card still renders:
+ *
+ *   - inside the seat's anchor, every candidate IS the seat;
+ *   - without an anchor, the seat is the LAST menu trigger of the card, since
+ *     the shell renders it at the end of the composer's trailing control row
+ *     (after the tools row that hosts the permission selector).
+ *
+ * @param doc - the document to search.
+ * @returns the composer's model trigger, or undefined while no composer exists.
  */
 export declare function findModelTrigger(doc?: Document): HTMLButtonElement | undefined;
 /** The official composer model menu: the seat root's open popover. */

package/lib/client/styles.d.ts

@@ -5,4 +5,4 @@
  * `bre-`. Uses CSS variables for theme awareness where the host provides them.
  */
 /** The stylesheet text, inserted once into <head> by the client apply(). */
-export declare const STYLES = "\n/* The injector's mount wrapper. It \u2014 not the editor inside it \u2014 is the item\n   placed into the official row disclosure's repeat(auto-fit, minmax(160px,1fr))\n   grid (context window and max tokens take two cells), so the span belongs\n   here: on the editor itself it would target the wrapper's block box and be\n   ignored, squeezing the block into one cell. */\n.bre-effort-slot {\n  grid-column: 1 / -1;\n}\n/* The slot wrapper is a plain column: the master thinking switch sits in it,\n   directly above the card it gates. */\n.bre-effort-editor {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  margin: 8px 0 4px;\n}\n/* The \u601D\u8003\u5F3A\u5EA6 card proper \u2014 rendered only while the master switch is on. */\n.bre-effort-card {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 10px 12px;\n  border: 0.5px solid var(--dsw-alias-border-l2);\n  border-radius: 8px;\n  background: var(--dsw-alias-bg-layer-2);\n  box-sizing: border-box;\n}\n.bre-effort-head {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 8px;\n}\n.bre-effort-title {\n  font-size: 12px;\n  font-weight: 600;\n  color: var(--dsw-alias-label-secondary);\n}\n.bre-link-button {\n  background: none;\n  border: none;\n  padding: 2px 6px;\n  font-size: 12px;\n  color: var(--dsw-alias-link);\n  cursor: pointer;\n  border-radius: 4px;\n}\n.bre-link-button:hover { text-decoration: underline; }\n.bre-link-button:disabled { opacity: 0.5; cursor: default; text-decoration: none; }\n.bre-auto-effort {\n  /* Seated in the OFFICIAL catalogue head, beside the host's own fetch link:\n     it borrows the plugin's link metrics and only adds the gap the head's own\n     controls are spaced by, so it reads as one more control of that row. */\n  margin-left: 4px;\n  flex: none;\n}\n.bre-effort-grid {\n  /* Exactly two equal columns mirroring the official capacity pair the editor\n     sits under; an odd row count leaves the last cell in the left column,\n     so the left side carries the extra level. */\n  display: grid;\n  grid-template-columns: repeat(2, minmax(0, 1fr));\n  gap: 4px 16px;\n}\n.bre-effort-row {\n  display: grid;\n  grid-template-columns: 20px 76px minmax(0, 1fr);\n  align-items: center;\n  gap: 6px;\n  font-size: 12px;\n}\n.bre-effort-row input[type='checkbox'] {\n  /* Bigger than the browser default (~13px): a tap/point target that does\n     not require precision, in the theme accent when checked. */\n  width: 18px;\n  height: 18px;\n  margin: 0;\n  accent-color: var(--dsw-alias-brand-primary);\n  cursor: pointer;\n}\n.bre-effort-level { color: var(--dsw-alias-label-tertiary); }\n.bre-effort-wire {\n  box-sizing: border-box;\n  min-width: 0;\n  height: 24px;\n  padding: 0 6px;\n  border: 0.5px solid var(--dsw-alias-border-l4);\n  border-radius: 4px;\n  background: var(--dsw-alias-bg-layer-1);\n  color: var(--dsw-alias-label-primary);\n  font: inherit;\n  font-size: 12px;\n}\n.bre-effort-wire:focus {\n  outline: none;\n  border-color: var(--dsw-alias-brand-primary);\n}\n.bre-effort-empty { min-height: 24px; }\n.bre-effort-actions {\n  display: flex;\n  gap: 8px;\n  justify-content: flex-end;\n}\n.bre-secondary-button {\n  height: 26px;\n  padding: 0 12px;\n  border-radius: 6px;\n  font-size: 12px;\n  cursor: pointer;\n  border: 0.5px solid var(--dsw-alias-border-l3);\n}\n.bre-secondary-button:disabled { opacity: 0.5; cursor: default; }\n.bre-secondary-button { background: transparent; color: inherit; }\n.bre-effort-message { font-size: 12px; margin: 0; }\n.bre-effort-message.bre-error { color: #c62828; }\n.bre-effort-message.bre-info { color: var(--dsw-alias-link); }\n.bre-effort-note { font-size: 11px; margin: 0; color: var(--dsw-alias-label-tertiary); }\n/* ---- Input-modality section ---- */\n.bre-modality {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n.bre-modality-row {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 12px;\n}\n.bre-modality-row input[type='checkbox'] {\n  width: 18px;\n  height: 18px;\n  margin: 0;\n  accent-color: var(--dsw-alias-brand-primary);\n  cursor: pointer;\n}\n.bre-modality-clear { margin-left: auto; }\n.bre-modality-note { font-size: 11px; margin: 0; color: var(--dsw-alias-label-tertiary); }\n/* The master thinking switch, which lives OUTSIDE the card it gates: with it\n   off that card is not rendered at all, so nothing here has to be hidden. */\n.bre-thinking-switch { margin: 0; }\n/* ---- Endpoint-compatibility controls ----\n   Same shape as the official capacity fields the editor sits under: a caption\n   above the control, the control capped at the official enum width (a field\n   width dropdown reads as a text field the user is expected to fill), and a\n   hint line beneath. Tokens are the official ones \u2014 the plugin's own --dsh-*\n   names are defined nowhere in this app, so their light-mode literals used to\n   render in both themes. */\n.bre-compat {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n.bre-compat-row {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  min-width: 0;\n}\n.bre-compat-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }\n.bre-compat-label {\n  font-size: 12px;\n  line-height: 18px;\n  color: var(--dsw-alias-label-tertiary);\n}\n.bre-compat-hint {\n  font-size: 11px;\n  line-height: 16px;\n  color: var(--dsw-alias-label-tertiary);\n}\n.bre-select, .bre-text-input {\n  box-sizing: border-box;\n  width: 100%;\n  max-width: 240px;\n  height: 32px;\n  padding: 0 10px;\n  border: 0.5px solid var(--dsw-alias-border-l4);\n  border-radius: 8px;\n  background: var(--dsw-alias-bg-layer-1);\n  color: var(--dsw-alias-label-primary);\n  font: inherit;\n  font-size: 14px;\n  line-height: 22px;\n}\n.bre-text-input::placeholder { color: var(--dsw-alias-label-dimmed); }\n.bre-select:focus, .bre-text-input:focus {\n  outline: none;\n  border-color: var(--dsw-alias-brand-primary);\n}\n.bre-select:disabled, .bre-text-input:disabled { opacity: 0.6; cursor: default; }\n.bre-select {\n  cursor: pointer;\n  /* The OS arrow sits flush against the right edge; the official select swaps\n     it for the shared 12px chevron inset on the same right pad. Data-URI SVGs\n     cannot resolve CSS variables, so the stroke is the caption gray both\n     themes share. */\n  appearance: none;\n  padding-right: 32px;\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M3 4.5L6 7.5L9 4.5' stroke='%2381858C' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E\");\n  background-repeat: no-repeat;\n  background-position: right 12px center;\n  background-size: 12px 12px;\n}\n.bre-error { color: var(--dsw-alias-state-error-primary); }\n/* ---- Zoned suggestion display ---- */\n.bre-suggestion {\n  display: flex;\n  flex-direction: column;\n  gap: 3px;\n}\n.bre-reference {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: baseline;\n  gap: 4px 14px;\n  padding: 6px 8px;\n  border: 1px dashed var(--dsw-alias-border-l3);\n  border-radius: 6px;\n  font-size: 11px;\n  color: var(--dsw-alias-label-tertiary);\n}\n.bre-reference-title { font-weight: 600; }\n.bre-reference-values { display: inline-flex; gap: 14px; }\n/* ---- Composer model-menu slider (mounted inside the OFFICIAL menu) ----\n   Visuals ported VERBATIM from HanaAyane's dsh-reasoning-effort (MIT) \u2014 the\n   only deliberate difference is the chibi-runner \"big fish\" knob, which is\n   dropped so the knob is always the white circle. Class names are re-\n   prefixed bre- (the upstream's re- prefix would clash while both plugins\n   are installed); every color/size/animation value stays upstream's. */\n.bre-slider-body {\n  /* The replicated popover body. The official menu shell carries padding: 4px\n     (ModelSelect.module.css), so pull the replica flush to the box. overflow\n     stays VISIBLE: an open list is laid out inside the body, so nothing ever\n     has to escape it, and the rows' own hover radius needs no clipping. */\n  overflow: visible;\n  margin: -4px;\n  padding: 8px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n/* The official menu is content-sized; while the replicated popover body is\n   live, its box takes the upstream .re-model-menu width. The class is added\n   by the mount and removed when the slider is switched off. */\n.bre-model-menu-host {\n  width: min(340px, calc(100vw - 32px));\n  min-width: 0;\n}\n/* The official trigger keeps ownership of its model/effort children. The\n   provider prefix is a pseudo-element so host React updates, focus handling and\n   the click target remain untouched. */\nbutton[data-bre-provider]::before {\n  content: attr(data-bre-provider) \" \u00B7 \";\n  flex: none;\n  color: var(--dsw-alias-label-secondary);\n  font-weight: 400;\n  white-space: nowrap;\n}\n\n/* ---- Model / reasoning-level rows ----\n   Presentation follows dsh-tauri-model-config's settings rows\n   (src/client/models/styles.ts: .zGbnIq_rowCard / .zGbnIq_rowHead /\n   .zGbnIq_iconButton): hairline separators between rows and a list opening\n   under the row it belongs to. Re-prefixed bre- and routed through the tokens\n   this file already uses. */\n/* Layout only \u2014 it deliberately paints NO background, border, radius or\n   overflow clip. The replica is mounted inside the OFFICIAL menu, and that\n   shell already draws its own surface (MenuSurface: a [data-menu-material]\n   panel whose .material child paints --dsw-menu-surface-fill, i.e.\n   --dsw-specific-menu, under backdrop-filter: var(--dsw-menu-backdrop-filter),\n   rounded by --dsw-radius-lg and outlined by --dsw-elevation-prominent).\n   A second opaque card in here shows that official surface as a grey frame\n   around it \u2014 two stacked surfaces where every other menu in the app has one. */\n.bre-card {\n  display: flex;\n  flex-direction: column;\n}\n.bre-row-control {\n  appearance: none;\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  width: 100%;\n  min-height: 38px;\n  padding: 0 10px;\n  border: 0;\n  /* Matches the official menu cells (.u91W7W_cell / .u91W7W_option use\n     --dsw-radius-md, 8px here) and the .bre-option rows below, now that the\n     surface behind the rows is the menu's own and hover is no longer clipped\n     by a card. */\n  border-radius: 8px;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  text-align: left;\n  cursor: pointer;\n  transition: background 120ms ease;\n}\n.bre-row-control:hover:not(:disabled) {\n  background: var(--dsw-alias-interactive-bg-hover, rgba(120, 125, 140, .09));\n}\n.bre-row-control.is-open { background: var(--dsw-alias-fill-tertiary, rgba(120, 125, 140, .09)); }\n.bre-row-control:disabled { cursor: default; opacity: .6; }\n.bre-row-control:focus-visible {\n  outline: none;\n  box-shadow: inset 0 0 0 2px var(--dsw-alias-border-l3);\n}\n.bre-row-label {\n  flex: none;\n  font-size: 13px;\n  line-height: 20px;\n  color: var(--dsw-alias-label-secondary);\n}\n.bre-row-value {\n  flex: 1 1 auto;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  text-align: right;\n  font-size: 13px;\n  line-height: 20px;\n  font-weight: 500;\n  color: var(--dsw-alias-label-primary);\n}\n.bre-row-value.is-muted { font-weight: 400; color: var(--dsw-alias-label-tertiary); }\n.bre-divider { height: 1px; margin: 0 10px; background: var(--dsw-alias-border-l4); }\n.bre-panel {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  max-height: 220px;\n  overflow-y: auto;\n  padding: 2px 6px 8px;\n}\n/* Provider column + model column of the model list, side by side. The height is\n   FIXED: switching provider must not resize the card, or every click would need\n   another same-frame re-place and any missed one shows as a jump. */\n.bre-panel-models {\n  flex-direction: row;\n  align-items: stretch;\n  gap: 0;\n  height: 240px;\n  max-height: none;\n  overflow: hidden;\n  padding: 4px 6px 8px;\n}\n.bre-providers {\n  flex: none;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  width: 112px;\n  overflow-y: auto;\n  padding-right: 2px;\n}\n.bre-provider-models {\n  flex: 1 1 auto;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  overflow-y: auto;\n  margin-left: 6px;\n  padding-left: 6px;\n  border-left: 1px solid var(--dsw-alias-border-l4);\n}\n.bre-option,\n.bre-provider {\n  appearance: none;\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  width: 100%;\n  min-height: 30px;\n  padding: 0 8px;\n  border: 0;\n  border-radius: 8px;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  font-size: 13px;\n  line-height: 20px;\n  text-align: left;\n  cursor: pointer;\n  transition: background 120ms ease, color 120ms ease;\n}\n/* The provider cell carries its chevron hard against the right edge. */\n.bre-provider { gap: 4px; padding: 0 4px 0 8px; }\n.bre-option:hover:not(:disabled),\n.bre-provider:hover:not(:disabled) {\n  background: var(--dsw-alias-interactive-bg-hover, rgba(120, 125, 140, .09));\n}\n.bre-option:disabled,\n.bre-provider:disabled { cursor: default; opacity: .6; }\n.bre-option:focus-visible,\n.bre-provider:focus-visible {\n  outline: none;\n  box-shadow: inset 0 0 0 2px var(--dsw-alias-border-l3);\n}\n.bre-option-name {\n  flex: 1 1 auto;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.bre-option.is-active {\n  color: var(--dsw-static-deepseek-500, #4d70ff);\n  font-weight: 500;\n  background: var(--dsw-alias-fill-tertiary, rgba(120, 125, 140, .09));\n}\n/* The open provider is the highlighted one; the provider of the CURRENT model\n   keeps the accent so the column says where the selection lives. */\n.bre-provider.is-open { background: var(--dsw-alias-fill-tertiary, rgba(120, 125, 140, .09)); }\n.bre-provider.is-current .bre-option-name {\n  color: var(--dsw-static-deepseek-500, #4d70ff);\n  font-weight: 500;\n}\n.bre-provider .bre-row-chevron { width: 14px; height: 14px; font-size: 14px; }\n/* Capability badges on a model row (image input / thinking). Muted so the name\n   stays the brightest thing in the row; the badge's own title carries the copy. */\n.bre-option-tags {\n  flex: none;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  color: var(--dsw-alias-label-tertiary);\n}\n.bre-option.is-active .bre-option-tags { color: var(--dsw-static-deepseek-500, #4d70ff); }\n.bre-tag { display: inline-flex; align-items: center; }\n.bre-tag-icon { display: block; width: 13px; height: 13px; }\n.bre-option-check { flex: none; width: 14px; height: 14px; }\n.bre-empty { padding: 6px 8px; font-size: 12px; color: var(--dsw-alias-label-tertiary); }\n.bre-slider-advanced {\n  /* upstream .re-advanced: the padded area that hosts the slider */\n  padding: 14px;\n}\n.bre-effort {\n  display: flex;\n  align-items: center;\n  width: 100%;\n  min-width: 0;\n  height: 32px;\n  color: var(--dsw-alias-label-secondary);\n  user-select: none;\n  box-sizing: border-box;\n}\n.bre-effort-slider {\n  --bre-progress: 50%;\n  position: relative;\n  width: 100%;\n  height: 30px;\n  flex: 1 1 auto;\n  border-radius: 999px;\n  isolation: isolate;\n  transition: filter 180ms ease;\n}\n.bre-effort-track {\n  position: absolute;\n  inset: 0;\n  overflow: hidden;\n  border-radius: inherit;\n  background: linear-gradient(100deg, #03040a 0%, #071126 22%, #101d4c 45%, #302262 70%, #5d35a0 100%);\n  box-shadow:\n    inset 0 1px 0 rgba(189, 199, 255, .15),\n    inset 0 -1px 0 rgba(0, 0, 0, .55),\n    0 3px 10px rgba(12, 17, 55, .34);\n}\n.bre-effort-track::after {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  background:\n    radial-gradient(circle at 18% 45%, rgba(82, 130, 255, .12), transparent 24%),\n    linear-gradient(90deg, rgba(0, 0, 0, .28), transparent 42%, rgba(168, 113, 255, .12));\n  pointer-events: none;\n}\n.bre-effort-fx {\n  position: absolute;\n  z-index: 1;\n  inset: 0;\n  overflow: hidden;\n  border-radius: inherit;\n  pointer-events: none;\n}\n.bre-effort-canvas {\n  position: absolute;\n  z-index: 2;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  opacity: 1;\n  image-rendering: pixelated;\n  mix-blend-mode: screen;\n  transition: filter 140ms ease;\n}\n.bre-effort-flare {\n  position: absolute;\n  z-index: 3;\n  top: 50%;\n  left: var(--bre-progress);\n  width: 78px;\n  height: 46px;\n  border-radius: 50%;\n  background: radial-gradient(ellipse at 100% 50%, rgba(255,255,255,.96) 0 4%, rgba(188,189,255,.8) 11%, rgba(106,87,255,.5) 28%, rgba(105,31,255,.2) 49%, transparent 74%);\n  filter: blur(2px) saturate(1.25);\n  mix-blend-mode: screen;\n  transform: translate(-100%, -50%);\n  transition: left 70ms linear, filter 140ms ease;\n  pointer-events: none;\n}\n.bre-effort-flare::before,\n.bre-effort-flare::after {\n  content: \"\";\n  position: absolute;\n  inset: 50% auto auto 100%;\n  border-radius: 999px;\n  transform: translate(-50%, -50%);\n}\n.bre-effort-flare::before {\n  width: 52px;\n  height: 1px;\n  background: linear-gradient(90deg, transparent, rgba(100,160,255,.42), #f1ecff, rgba(193,82,255,.65), transparent);\n  box-shadow: 0 0 7px #9b7cff, 0 0 13px rgba(72,132,255,.64);\n}\n.bre-effort-flare::after {\n  width: 1px;\n  height: 20px;\n  background: linear-gradient(180deg, transparent, rgba(196,190,255,.84), transparent);\n  box-shadow: 0 0 7px #9c7cff;\n}\n.bre-effort-knob {\n  position: absolute;\n  z-index: 4;\n  top: 50%;\n  left: clamp(14px, var(--bre-progress), calc(100% - 14px));\n  width: 28px;\n  height: 28px;\n  border: 1px solid rgba(255,255,255,.94);\n  border-radius: 50%;\n  background: #fff;\n  box-shadow:\n    0 0 0 2px rgba(92,105,255,.12),\n    0 0 14px rgba(121,82,255,.48),\n    0 2px 7px rgba(0,0,0,.3);\n  transform: translate(-50%, -50%);\n  transition: left 190ms cubic-bezier(.22,1,.36,1), transform 160ms ease, box-shadow 180ms ease;\n  pointer-events: none;\n}\n.bre-effort-input {\n  position: absolute;\n  z-index: 5;\n  inset: -5px 0;\n  width: 100%;\n  height: calc(100% + 10px);\n  margin: 0;\n  opacity: 0;\n  cursor: grab;\n  touch-action: none;\n}\n.bre-effort-input:active { cursor: grabbing; }\n.bre-effort-input:focus-visible + .bre-effort-knob {\n  outline: 2px solid var(--dsw-static-blue-400);\n  outline-offset: 2px;\n}\n.bre-effort.is-dragging .bre-effort-canvas {\n  filter: saturate(1.45) brightness(1.28) contrast(1.06);\n}\n.bre-effort.is-dragging .bre-effort-flare {\n  filter: blur(1.5px) saturate(1.6) brightness(1.42);\n  transition: none;\n}\n.bre-effort.is-dragging .bre-effort-knob {\n  transform: translate(-50%, -50%) scale(1.07);\n  transition: none;\n  box-shadow:\n    0 0 0 3px rgba(113,115,255,.25),\n    0 0 20px rgba(74,145,255,.86),\n    0 0 31px rgba(171,53,255,.66),\n    0 3px 8px rgba(0,0,0,.32);\n}\n.bre-effort-slider[data-top] .bre-effort-track {\n  animation: bre-effort-dark-breathe 1.9s ease-in-out infinite;\n}\n.bre-effort-slider[data-top] .bre-effort-knob {\n  box-shadow:\n    0 0 0 3px rgba(119,99,255,.18),\n    0 0 22px rgba(135,78,255,.76),\n    0 0 34px rgba(53,121,255,.34),\n    0 3px 8px rgba(0,0,0,.3);\n}\n.bre-effort.is-error .bre-effort-slider {\n  outline: 1px solid var(--dsw-alias-state-error-secondary);\n  outline-offset: 2px;\n}\n.bre-effort.is-busy { opacity: .72; }\n.bre-effort-sr {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border: 0;\n}\nbody:not([data-ds-dark-theme]) .bre-effort-slider {\n  filter: none;\n}\nbody:not([data-ds-dark-theme]) .bre-effort-track {\n  background: var(--dsw-static-blue-75, #e5f0ff);\n  box-shadow:\n    inset 0 1px 0 rgba(255,255,255,.9),\n    inset 0 0 0 1px rgba(80,133,194,.14),\n    0 3px 10px rgba(48,101,165,.13);\n}\nbody:not([data-ds-dark-theme]) .bre-effort-track::before {\n  content: \"\";\n  position: absolute;\n  z-index: 0;\n  inset: 0 auto 0 0;\n  width: var(--bre-progress);\n  border-radius: inherit;\n  background: linear-gradient(90deg, #fff 0%, #e2f0ff 20%, #a8d0fb 57%, #438fdf 100%);\n  transition: width 190ms cubic-bezier(.22,1,.36,1);\n}\nbody:not([data-ds-dark-theme]) .bre-effort-slider[data-top] .bre-effort-track::before {\n  background: linear-gradient(90deg, #fff 0%, #d7eaff 18%, #75afea 54%, #0751ad 100%);\n}\nbody:not([data-ds-dark-theme]) .bre-effort.is-dragging .bre-effort-track::before {\n  transition: none;\n}\nbody:not([data-ds-dark-theme]) .bre-effort-track::after {\n  z-index: 1;\n  background: linear-gradient(90deg, rgba(255,255,255,.48), transparent 34%, rgba(23,101,201,.07));\n}\nbody:not([data-ds-dark-theme]) .bre-effort-canvas {\n  opacity: .78;\n  mix-blend-mode: multiply;\n}\nbody:not([data-ds-dark-theme]) .bre-effort-flare {\n  background: radial-gradient(ellipse at 100% 50%, rgba(255,255,255,.98) 0 5%, rgba(204,231,255,.88) 13%, rgba(91,162,241,.48) 31%, rgba(37,111,207,.16) 53%, transparent 75%);\n  filter: blur(2px) saturate(1.12);\n}\nbody:not([data-ds-dark-theme]) .bre-effort-flare::before {\n  background: linear-gradient(90deg, transparent, rgba(116,177,244,.34), #fff, rgba(66,139,225,.58), transparent);\n  box-shadow: 0 0 7px rgba(58,133,222,.5), 0 0 13px rgba(104,176,255,.38);\n}\nbody:not([data-ds-dark-theme]) .bre-effort-flare::after {\n  background: linear-gradient(180deg, transparent, rgba(255,255,255,.94), transparent);\n  box-shadow: 0 0 7px rgba(64,137,224,.44);\n}\nbody:not([data-ds-dark-theme]) .bre-effort-knob {\n  border-color: rgba(126,160,197,.32);\n  box-shadow:\n    0 0 0 2px rgba(58,124,207,.09),\n    0 0 13px rgba(48,118,207,.3),\n    0 3px 8px rgba(39,77,119,.18);\n}\nbody:not([data-ds-dark-theme]) .bre-effort-slider[data-top] .bre-effort-track {\n  animation-name: bre-effort-light-breathe;\n}\nbody:not([data-ds-dark-theme]) .bre-effort-slider[data-top] .bre-effort-knob,\nbody:not([data-ds-dark-theme]) .bre-effort.is-dragging .bre-effort-knob {\n  box-shadow:\n    0 0 0 3px rgba(36,105,192,.15),\n    0 0 20px rgba(25,100,201,.45),\n    0 3px 8px rgba(39,77,119,.18);\n}\n@keyframes bre-effort-dark-breathe {\n  0%, 100% { box-shadow: inset 0 1px 0 rgba(196,204,255,.16), 0 3px 10px rgba(18,25,72,.4); }\n  50% { box-shadow: inset 0 1px 0 rgba(220,214,255,.24), 0 0 21px rgba(111,66,255,.5); }\n}\n@keyframes bre-effort-light-breathe {\n  0%, 100% { box-shadow: inset 0 1px 0 rgba(255,255,255,.9), inset 0 0 0 1px rgba(67,124,193,.16), 0 3px 10px rgba(48,101,165,.13); }\n  50% { box-shadow: inset 0 1px 0 rgba(255,255,255,.96), inset 0 0 0 1px rgba(31,102,190,.22), 0 0 19px rgba(31,105,201,.24); }\n}\n.bre-slider-hint {\n  /* upstream re-model-status */\n  display: block;\n  padding: 14px;\n  color: var(--dsw-alias-label-tertiary, #9296a0);\n  font-size: 12px;\n  text-align: center;\n}\n/* upstream re-model-error: the directory/store error line under the row */\n.bre-model-error {\n  margin: 8px;\n  padding: 8px 10px;\n  border-radius: 8px;\n  color: var(--dsw-alias-state-error-primary, #c83e4d);\n  background: var(--dsw-alias-state-error-tertiary, rgba(220,55,70,.08));\n  font-size: 11px;\n}\n/* upstream .re-menu-separator */\n.bre-menu-separator {\n  height: 1px;\n  background: var(--dsw-alias-stroke-secondary, rgba(121,126,145,.16));\n}\n/* upstream .re-model-row: name \u00B7 current effort \u203A (click \u2192 official model list) */\n.bre-model-row {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) auto auto;\n  align-items: center;\n  gap: 8px;\n  min-height: 45px;\n  padding: 0 14px;\n  width: 100%;\n  border: 0;\n  color: inherit;\n  background: transparent;\n  font: inherit;\n  text-align: left;\n  cursor: pointer;\n}\n.bre-model-row:hover { background: var(--dsw-alias-fill-tertiary, rgba(120,125,140,.09)); }\n.bre-model-row-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }\n.bre-model-row-effort { color: var(--dsw-static-deepseek-500, #4d70ff); font-size: 12px; }\n.bre-row-chevron {\n  flex: none;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  font-size: 18px;\n  line-height: 1;\n  color: var(--dsw-alias-label-tertiary);\n  transform: rotate(0deg);\n  transition: transform 120ms ease;\n}\n.bre-row-chevron.is-open { transform: rotate(90deg); }\n@media (prefers-reduced-motion: reduce) {\n  .bre-effort-slider[data-top] .bre-effort-track { animation: none; }\n  .bre-effort-knob,\n  .bre-effort-flare,\n  body:not([data-ds-dark-theme]) .bre-effort-track::before { transition: none; }\n}\n/* ---- Models-page slider toggle (boxed setting item) ----\n   Item form ported VERBATIM from upstream .re-setting-row; the surrounding\n   box is the requested container (border only, transparent background). */\n.bre-slider-setting {\n  margin-top: 12px;\n  padding: 0 14px;\n  border: 1px solid var(--dsw-alias-stroke-secondary, rgba(121,126,145,.2));\n  border-radius: 12px;\n  background: transparent;\n}\n.bre-slider-setting-row {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 24px;\n  padding: 16px 0;\n  /* Upstream .re-setting-row carries a list bottom border because the general\n     settings list held TWO rows (the slider + the big-fish toggle). This box\n     holds exactly one, so no divider: the box itself is the container. */\n}\n.bre-slider-setting-copy { min-width: 0; }\n.bre-slider-setting-title {\n  color: var(--dsw-alias-label-primary, #15171b);\n  font-size: 14px;\n  font-weight: 400;\n  line-height: 22px;\n}\n.bre-slider-setting-description {\n  margin-top: 3px;\n  color: var(--dsw-alias-label-tertiary, #9296a0);\n  font-size: 12px;\n  line-height: 18px;\n}\n.bre-slider-setting-control { display: inline-flex; align-items: center; gap: 10px; flex: none; }\n.bre-slider-setting-state { color: var(--dsw-alias-label-secondary, #686c75); font-size: 13px; }\n.bre-slider-setting-switch {\n  position: relative;\n  width: 38px;\n  height: 22px;\n  padding: 0;\n  border: 0;\n  border-radius: 999px;\n  background: var(--dsw-alias-fill-quaternary, #c7cbd3);\n  cursor: pointer;\n  transition: background 150ms ease;\n}\n.bre-slider-setting-switch:hover { filter: brightness(.97); }\n.bre-slider-setting-switch:disabled { cursor: not-allowed; opacity: .45; }\n.bre-slider-setting-switch:focus-visible {\n  outline: 2px solid var(--dsw-static-blue-400, #5d83ff);\n  outline-offset: 2px;\n}\n.bre-slider-setting-switch.is-on { background: var(--dsw-alias-state-business-primary, #4f73ff); }\n.bre-slider-setting-switch-knob {\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 18px;\n  height: 18px;\n  border-radius: 50%;\n  background: #fff;\n  box-shadow: 0 1px 4px rgba(0,0,0,.2);\n  transition: transform 170ms cubic-bezier(.22,1,.36,1);\n}\n.bre-slider-setting-switch.is-on .bre-slider-setting-switch-knob { transform: translateX(16px); }\n\n/* Model selection search box */\n.bre-model-search-box {\n  display: flex;\n  flex-direction: column;\n  padding: 6px 8px 4px;\n  position: sticky;\n  top: 0;\n  z-index: 2;\n  background: var(--dsw-specific-menu, var(--dsw-alias-bg-layer-1, #1e1f22));\n}\n.bre-model-search-box:has(.bre-search-empty),\n.bre-model-search-box.has-empty {\n  flex: 1 1 auto;\n}\n.bre-search-input-wrapper {\n  display: flex;\n  align-items: center;\n  position: relative;\n  width: 100%;\n  height: 32px;\n  padding: 0 8px;\n  box-sizing: border-box;\n  border-radius: 8px;\n  background: var(--dsw-alias-bg-layer-2, rgba(255, 255, 255, 0.06));\n  border: 0.5px solid var(--dsw-alias-border-l4, rgba(255, 255, 255, 0.12));\n  color: var(--dsw-alias-label-primary);\n  transition: border-color 150ms ease, box-shadow 150ms ease;\n}\n.bre-search-input-wrapper:focus-within {\n  border-color: var(--dsw-static-deepseek-500, #4d70ff);\n  box-shadow: 0 0 0 2px rgba(77, 112, 255, 0.2);\n}\n.bre-search-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: 0 0 16px;\n  width: 16px;\n  height: 16px;\n  margin-right: 6px;\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  pointer-events: none;\n}\n.bre-search-icon svg {\n  width: 14px;\n  height: 14px;\n}\n.bre-search-input {\n  flex: 1 1 auto;\n  min-width: 0;\n  height: 100%;\n  padding: 0;\n  border: none;\n  outline: none;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  font-size: 13px;\n  line-height: 20px;\n}\n.bre-search-input::placeholder {\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  opacity: 0.85;\n}\n.bre-search-clear {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: 0 0 18px;\n  width: 18px;\n  height: 18px;\n  margin-left: 4px;\n  padding: 0;\n  border: none;\n  border-radius: 4px;\n  background: transparent;\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  cursor: pointer;\n  transition: background 120ms ease, color 120ms ease;\n}\n.bre-search-clear:hover {\n  background: var(--dsw-alias-interactive-bg-hover, rgba(255, 255, 255, 0.1));\n  color: var(--dsw-alias-label-primary);\n}\n.bre-search-clear svg {\n  width: 12px;\n  height: 12px;\n}\n.bre-search-empty {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: 1 1 auto;\n  min-height: 180px;\n  padding: 24px 16px;\n  text-align: center;\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  font-size: 13px;\n  line-height: 20px;\n  user-select: none;\n}\n\n/* ---- Request-header section (issue #12). Mounted through the official\n   settings.models.provider-card seat, so it sits in the card's own layout\n   rather than a disclosure grid.\n\n   Every value below was MEASURED off the official Models page's own controls\n   in DSH 0.1.7-rc.2 rather than guessed, and each is expressed through the same\n   --dsw-alias-* token the host paints with, so a theme switch (light/dark)\n   repaints this section along with the page:\n\n     provider card   radius 20px, 1px var(--dsw-alias-settings-card-stroke)\n     editor action   save = filled var(--dsw-alias-button-primary-fill), h36,\n                     radius 12px, 0 14px, 14px; cancel = 1px border, same box\n     row action      h28, radius 8px, 0 10px, 12px, 1px border\n     text link       h21, radius 4px, 2px 6px, 12px, link-blue label\n     text input      radius 12px, 0 10px, 1px var(--dsw-alias-border-l3)  ---- */\n/* The provider-card slot's wrapper.\n   The official slot mounts us inside a display:contents container, so our own\n   root IS a flex item of the card row \u2014 and the row lays its children out with\n   a 12px gap. A wrapper that stays in the flow while empty therefore adds one\n   phantom gap to EVERY card in the list, which is exactly the height regression\n   this rule exists to prevent. Collapsed, the wrapper leaves the flow entirely:\n   the card renders as it did before the plugin.\n   (Deliberately NOT display:contents here \u2014 that keeps it a gap-participating\n   item, which is the bug this rule fixes.)\n   Open, it becomes an ordinary block so the section below can lay itself out.\n   data-edit lives HERE \u2014 the occurrence component publishes the card's state\n   onto its own root, so keying the rule on .bre-headers[data-edit] instead\n   would silently never match. */\n.bre-headers-host {\n  display: none;\n}\n.bre-headers-host[data-edit=\"1\"] {\n  display: block;\n}\n.bre-headers {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  /* The card lays its own children out with a 12px gap and no dividers; this\n     section is an addition to that column, so it separates itself the same way\n     the host separates card sections \u2014 a hairline on the card's own stroke. */\n  border-top: 1px solid var(--dsw-alias-border-l2, #0000001a);\n  padding-top: 12px;\n\n  /* Present ONLY while the provider card is being edited.\n     The provider list is a list of providers: a request-header row parked in\n     every card, collapsed or not, is noise on a surface the user did not ask\n     to configure. The card reveals its editor when the user presses its own\n     Edit action, and that is the moment this section belongs on screen \u2014 the\n     same gesture that opens the model list opens this.\n\n     The visibility is decided by the component (which watches the card and\n     sets data-edit on the wrapper), not by a selector: the official editor is\n     NOT a sibling of this element \u2014 its container sits in the card row's own\n     children, after the row head and this section's own wrapper \u2014 so no\n     relative selector can reach it. The wrapper's data-edit is the one fact\n     CSS can act on.\n\n     Degradation is safe by construction: with no observer (no card ancestor to\n     watch) data-edit stays \"0\", the section is never revealed, and the\n     official page stays clean rather than leaking a row into every card. */\n  display: none;\n}\n.bre-headers-host[data-edit=\"1\"] .bre-headers {\n  display: flex;\n}\n/* The collapsed heading is the section's identity while the card is being\n   edited: title, configured count, and the \u203A that opens the details. */\n.bre-headers-disclosure {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  width: 100%;\n  padding: 0;\n  border: none;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  text-align: left;\n  cursor: pointer;\n}\n.bre-headers-disclosure:hover .bre-effort-title {\n  color: var(--dsw-alias-label-secondary, #61666b);\n}\n.bre-headers-chevron {\n  margin-left: auto;\n  padding-right: 2px;\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  font-size: 14px;\n  line-height: 1;\n  transition: transform 150ms ease;\n}\n.bre-headers[data-open=\"1\"] .bre-headers-chevron { transform: rotate(90deg); }\n/* How many entries are configured \u2014 the one fact worth showing while closed. */\n.bre-headers-count {\n  min-width: 16px;\n  padding: 0 5px;\n  border-radius: 8px;\n  background: var(--dsw-alias-interactive-bg-hover, #2631480f);\n  color: var(--dsw-alias-label-secondary, #61666b);\n  font-size: 11px;\n  line-height: 16px;\n  text-align: center;\n}\n.bre-headers-head {\n  display: flex;\n  align-items: center;\n  min-height: 32px;\n  padding: 0 8px;\n  border-radius: var(--dsw-radius-sm, 8px);\n  background: var(--dsw-alias-interactive-bg-hover, #2631480f);\n}\n.bre-headers-head .bre-effort-title {\n  color: var(--dsw-alias-label-primary, #0f1115);\n  font-weight: 600;\n}\n.bre-headers-edit, .bre-headers-rows {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n.bre-headers-columns,\n.bre-headers-row {\n  display: grid;\n  grid-template-columns: minmax(120px, 0.9fr) minmax(180px, 1.5fr) 32px;\n  align-items: center;\n  gap: 8px;\n}\n.bre-headers-columns {\n  padding: 0 10px;\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  font-size: 11px;\n  line-height: 16px;\n}\n.bre-headers-row {\n  min-height: 40px;\n  padding: 4px 6px;\n  border: 1px solid var(--dsw-alias-border-l2, #0000001a);\n  border-radius: var(--dsw-radius-sm, 8px);\n  background: var(--dsw-alias-bg-layer-1, #fff);\n}\n.bre-headers-add {\n  align-self: flex-start;\n  min-height: 30px;\n  padding: 0 10px;\n  border: 1px solid var(--dsw-alias-border-l2, #0000001a);\n  border-radius: var(--dsw-radius-sm, 8px);\n  color: var(--dsw-alias-label-primary, #0f1115);\n}\n.bre-headers-add:hover:not(:disabled) {\n  background: var(--dsw-alias-interactive-bg-hover, #2631480f);\n}\n.bre-headers-remove {\n  width: 32px;\n  padding: 0;\n  justify-self: center;\n}\n.bre-headers-rows .bre-headers-name {\n  color: var(--dsw-alias-label-secondary, #61666b);\n  font-size: 12px;\n  word-break: break-all;\n}\n.bre-headers-masked {\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n  letter-spacing: 0;\n}\n\n/* The section's commit/dismiss pair, matching the official editor's own\n   actions: a filled commit and a bordered dismiss, 36px tall at 14px. */\n.bre-headers-edit .bre-primary-button {\n  height: 36px;\n  padding: 0 14px;\n  border: none;\n  border-radius: var(--dsw-radius-md, 12px);\n  background: var(--dsw-alias-button-primary-fill, #0f1115);\n  color: var(--dsw-alias-label-primary-foreground, #fff);\n  font-size: 14px;\n  font-weight: 400;\n  line-height: 1;\n  cursor: pointer;\n}\n.bre-headers-edit .bre-primary-button:hover:not(:disabled) {\n  background: var(--dsw-alias-button-primary-hover, #43454a);\n}\n.bre-headers-edit .bre-primary-button:disabled { opacity: 0.5; cursor: default; }\n.bre-headers-edit .bre-secondary-button {\n  height: 36px;\n  padding: 0 14px;\n  border: 1px solid var(--dsw-alias-border-l3, #0000001f);\n  border-radius: var(--dsw-radius-md, 12px);\n  background: transparent;\n  color: var(--dsw-alias-label-primary, #0f1115);\n  font-size: 14px;\n}\n.bre-headers-edit .bre-secondary-button:hover:not(:disabled) {\n  background: var(--dsw-alias-interactive-bg-hover, #2631480f);\n}\n\n/* The row actions and the section's Edit affordance: the official 28px\n   bordered small button, and the 21px blue text link the model rows use. */\n.bre-headers-row .bre-link-button {\n  height: 28px;\n  padding: 2px 8px;\n  border: none;\n  border-radius: var(--dsw-radius-sm, 8px);\n  background: transparent;\n  color: var(--dsw-alias-label-secondary, #61666b);\n  font-size: 12px;\n  line-height: 1;\n}\n.bre-headers-row .bre-link-button:hover:not(:disabled) {\n  background: var(--dsw-alias-interactive-bg-hover, #2631480f);\n}\n.bre-headers .bre-effort-head > .bre-link-button {\n  height: 28px;\n  padding: 0 10px;\n  border: 1px solid var(--dsw-alias-border-l2, #0000001a);\n  border-radius: var(--dsw-radius-sm, 8px);\n  color: var(--dsw-alias-label-primary, #0f1115);\n  font-size: 12px;\n  text-decoration: none;\n}\n.bre-headers .bre-effort-head > .bre-link-button:hover:not(:disabled) {\n  background: var(--dsw-alias-interactive-bg-hover, #2631480f);\n  text-decoration: none;\n}\n.bre-headers-edit .bre-link-button {\n  color: var(--dsw-alias-label-secondary, #61666b);\n  font-size: 12px;\n}\n\n/* The section's own fields, on the official input box. */\n.bre-headers-edit input.bre-text-input {\n  height: 32px;\n  padding: 0 10px;\n  border: 1px solid var(--dsw-alias-border-l3, #0000001f);\n  border-radius: var(--dsw-radius-md, 12px);\n  background: var(--dsw-alias-bg-layer-1, #fff);\n  color: var(--dsw-alias-label-primary, #0f1115);\n  font-size: 13px;\n  box-sizing: border-box;\n}\n.bre-headers-edit input.bre-text-input:focus {\n  border-color: var(--dsw-alias-label-tertiary, #81858c);\n  outline: none;\n}\n.bre-headers-edit input.bre-text-input:disabled { opacity: 0.6; cursor: default; }\n\n/* Status copy and the coexistence warnings, on the host's own state colours. */\n.bre-headers .bre-effort-note.bre-warn { color: var(--dsw-alias-state-warn-label, #dd8629); }\n.bre-headers .bre-effort-message.bre-success { color: var(--dsw-alias-state-success-primary, #22c55e); }\n.bre-headers .bre-effort-message.bre-error { color: var(--dsw-alias-state-error-primary, #ec1313); }\n\n@media (max-width: 520px) {\n  .bre-headers-columns { display: none; }\n  .bre-headers-row {\n    grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) 32px;\n    gap: 6px;\n    padding: 4px;\n  }\n  .bre-headers-edit input.bre-text-input {\n    padding: 0 8px;\n    font-size: 12px;\n  }\n}\n\n/* ---- Provider row reordering (Models page) ---- */\n\n/* The whole row header is the drag handle: an 18px grip is a poor thing to\n   have to hit, so a drag may start anywhere on the header that is not one of\n   the card's own controls (those keep their own cursor, declared below). */\nli[data-bre-row-head='1'] { cursor: grab; }\nli[data-bre-row-head='1']:active { cursor: grabbing; }\nli[data-bre-row-head='1'] button,\nli[data-bre-row-head='1'] a,\nli[data-bre-row-head='1'] input { cursor: pointer; }\n\n/* The grip is mounted as the first child of that header, so it reads as part\n   of the row rather than as a control bolted beside it. It is also the button\n   that reorders by keyboard. */\n.bre-drag-grip {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex: 0 0 auto;\n  width: 14px;\n  height: 20px;\n  margin-right: 2px;\n  border-radius: 4px;\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  cursor: grab;\n  touch-action: none;\n}\n\n.bre-drag-grip:hover {\n  color: var(--dsw-alias-label-secondary, #61666b);\n  background: var(--dsw-alias-interactive-bg-hover, #2631480f);\n}\n\n.bre-drag-grip:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary);\n  outline-offset: 1px;\n}\n\n.bre-drag-grip:active { cursor: grabbing; }\n\n/* What the pointer carries: the browser's own drag image would be a screenshot\n   of a whole card, so we hand it this chip with the provider name instead. */\n.bre-drag-ghost {\n  position: fixed;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  max-width: 260px;\n  padding: 5px 10px 5px 7px;\n  border: 1px solid var(--dsw-alias-border-secondary, #e6e8eb);\n  border-radius: 8px;\n  background: var(--dsw-alias-bg-elevated, #ffffff);\n  box-shadow: 0 6px 18px #0000002e;\n  color: var(--dsw-alias-label-primary, #17181a);\n  font-size: 13px;\n  line-height: 18px;\n  pointer-events: none;\n  transform: translate(-50%, -50%);\n  z-index: 60;\n}\n\n.bre-drag-ghost-name {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.bre-drag-ghost svg { color: var(--dsw-alias-label-tertiary, #81858c); }\n\n/* The row the drag is carrying: still in place, visibly the one in hand. */\nli.bre-row-dragging { opacity: .5; }\n\n/* The row the pointer would drop it on \u2014 a secondary cue; the insertion line\n   below is the one that says which side. */\nli.bre-row-drop-target { border-color: var(--dsw-alias-brand-primary); }\n\n/* The insertion line. A fixed overlay on the body, never a child of the list\n   React owns, so writing it cannot trigger anything in the official section.\n   The layer stack matters more than it looks: the provider list lives inside the\n   settings dialog, whose overlay is fixed and opaque with z-index 1000, so a\n   line in the shell's own range would be drawn behind the dialog and never\n   seen. It clears the dialog, and stays under the header's controls. */\n.bre-drop-line {\n  position: fixed;\n  display: none;\n  height: 2px;\n  border-radius: 2px;\n  background: var(--dsw-alias-brand-primary, #4d6bfe);\n  box-shadow: 0 0 0 1px #ffffffb3, 0 1px 4px var(--dsw-alias-brand-primary, #4d6bfe);\n  pointer-events: none;\n  z-index: 1200;\n}\n\n/* The row slide (a FLIP pass driven from the script) is motion; drop it for a\n   reader who asked for less. */\n@media (prefers-reduced-motion: reduce) {\n  li[data-bre-row-provider] { transition: none !important; }\n}\n\n@media (max-width: 520px) {\n  .bre-drag-grip { width: 18px; height: 24px; }\n  .bre-drag-ghost { max-width: 180px; font-size: 12px; }\n}\n\n/* ---- Model rows inside one provider's editor (Models page) ---- */\n\n/* The official model row is a four-column grid (id, display name, two icon\n   buttons). Our grip is a fifth child, so the grid needs a leading track to\n   hold it \u2014 declared by our own class, because the official rule is a single\n   class selector and ours has to win on specificity, not on load order.\n   The name must NOT be \"bre-model-row\": that one is this plugin's own composer\n   row (see the \".bre-model-row\" block above), and lending it to the host's grid\n   would hand that grid our padding, gap, min-height, pointer cursor and hover\n   fill along with it. */\n.bre-model-grid[class*=\"modelRow\"] {\n  grid-template-columns: auto minmax(0, 1.4fr) minmax(0, 1fr) auto auto;\n}\n\n/* A model row is a grid of inputs, so only the grip drags: the row keeps its\n   text cursor and its own click behaviour. The grip takes the height of the\n   row's controls, so the pointer has a real target inside a 6px-gap grid. */\n.bre-model-grid > .bre-drag-grip {\n  width: 18px;\n  height: 24px;\n  margin-right: 0;\n}\n\n/* The engine paints the carried row and the row under the pointer with the same\n   classes it uses on a provider card; the official model entry carries the\n   border, so the drop cue has to land there rather than on the list item. */\ndiv.bre-row-dragging { opacity: .5; }\n[class*=\"modelEntry\"].bre-row-drop-target { border-color: var(--dsw-alias-brand-primary); }\n\n/* The row slide (a FLIP pass driven from the script) is motion; drop it for a\n   reader who asked for less. */\n@media (prefers-reduced-motion: reduce) {\n  [data-bre-row-model] { transition: none !important; }\n}\n\n/* ---- Provider enable switch (Models page) ---- */\n\n/* Leads the row's own action group (which is pushed right by margin-left:auto),\n   in front of the card's buttons, so the destructive one stays last. The knob is\n   a pseudo element: no extra node for the official section's tree to trip over. */\n.bre-provider-switch {\n  position: relative;\n  flex: 0 0 auto;\n  width: 30px;\n  height: 18px;\n  padding: 0;\n  border: none;\n  border-radius: 9px;\n  background: var(--dsw-alias-bg-tertiary, #d7dae0);\n  cursor: pointer;\n  transition: background 140ms ease;\n}\n\n.bre-provider-switch::after {\n  content: '';\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 14px;\n  height: 14px;\n  border-radius: 50%;\n  background: var(--dsw-alias-bg-elevated, #ffffff);\n  box-shadow: 0 1px 2px #00000026;\n  transition: transform 140ms ease;\n}\n\n.bre-provider-switch:not([aria-checked='true']):hover { background: var(--dsw-alias-bg-quaternary, #c9ccd2); }\n\n.bre-provider-switch[aria-checked='true'] { background: var(--dsw-alias-brand-primary, #4d6bfe); }\n\n.bre-provider-switch[aria-checked='true']:hover { background: var(--dsw-alias-brand-primary-hover, #3f5ce8); }\n\n.bre-provider-switch[aria-checked='true']::after { transform: translateX(12px); }\n\n.bre-provider-switch:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary, #4d6bfe);\n  outline-offset: 2px;\n}\n\n/* A provider that is switched off stays on the page \u2014 this is the only place it\n   can be switched back on \u2014 but it is visibly out of play. The switch itself is\n   left at full strength: it is the way back. */\nli.bre-row-disabled [class*=\"rowIdentity\"],\nli.bre-row-disabled [class*=\"rowName\"] { opacity: .5; }\n\n@media (prefers-reduced-motion: reduce) {\n  .bre-provider-switch,\n  .bre-provider-switch::after { transition: none; }\n}\n\n/* ---- The reserved delete seat (Models page) ---- */\n\n/* A provider the host will not let the user remove renders no delete button, so\n   that row's action group \u2014 pushed right by margin-left:auto \u2014 starts further\n   right than its neighbours' and the column of buttons lines up raggedly. This\n   seat holds the place: it borrows the metrics the official button takes inside\n   an action group (.rowActions button is 28px tall / 12px / 0 10px) and the\n   dimmed treatment the host gives its own disabled buttons (opacity .4 with a\n   default cursor). It is always disabled \u2014 it is the alignment, not an action. */\n.bre-provider-delete {\n  box-sizing: border-box;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  height: 28px;\n  padding: 0 10px;\n  border: none;\n  border-radius: var(--dsw-radius-sm, 6px);\n  background: 0 0;\n  color: var(--dsw-alias-state-error-primary, #e5484d);\n  font: inherit;\n  font-size: 12px;\n  line-height: 18px;\n  opacity: .4;\n  cursor: default;\n}\n\n/* -----------------------------------------------------------------------\n   The provider editor's three tabs.\n\n   The official editor lays a provider out as one long column \u2014 identity\n   fields, then the model list, then this plugin's request-header section\n   one slot up the card. The tab pass (injection/editor-tabs.ts) tags each\n   region and stamps the card with the active tab; EVERY visibility decision\n   lives here, so the official React tree never moves and a pass failure\n   degrades to the untouched one-column editor.\n   ----------------------------------------------------------------------- */\n\n/* The segmented control. The plugin's tab-bar component renders it inside the\n   request-header mount, which already holds the card's 12px gap slot \u2014 so the\n   bar reaches the panes in the card's own rhythm WITHOUT this plugin ever\n   inserting a node into the official child list. It stays hidden until the pass\n   marks the card: a card the pass could not take over (the DeepSeek account\n   editor) keeps that mount visible for its request-header section, and must not\n   grow a bar that switches nothing. */\n.bre-editor-tabs {\n  display: none;\n  gap: 2px;\n  padding: 2px;\n  border-radius: 10px;\n  background: var(--dsw-alias-fill-tertiary, rgba(120, 125, 140, .09));\n}\n\n/* Only a taken-over card shows the bar. */\n.bre-tabbed .bre-editor-tabs { display: flex; }\n\n/* ...and while the takeover is on, the mount holding that bar MUST be visible.\n   This is the one place the takeover does not delegate its reveal to the\n   official-edit state: the bar lives in here, and gating it on the _editor\n   class probe would make the tabs depend on a probe an official redesign can\n   break \u2014 with data-edit stuck at 0 the bar would be inside a display:none\n   parent and no rule of ours could reach it. The taken-over class is written by\n   the pass itself, in the same frame, so it is the trustworthy half of the\n   pair. The section's own visibility stays a pane decision (below). */\n.bre-tabbed .bre-headers-host { display: block; }\n\n.bre-editor-tab {\n  flex: 1 1 0;\n  min-width: 0;\n  height: 28px;\n  padding: 0 10px;\n  border: none;\n  border-radius: 8px;\n  background: transparent;\n  color: var(--dsw-alias-label-secondary, #61666b);\n  font: inherit;\n  font-size: 12px;\n  font-weight: 500;\n  line-height: 1;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  cursor: pointer;\n  transition: background 140ms ease, color 140ms ease, box-shadow 140ms ease;\n}\n\n.bre-editor-tab:hover { color: var(--dsw-alias-label-primary, #0f1115); }\n\n/* The selected segment lifts out of the track: the page's own surface colour\n   plus the card's own hairline, the same elevation the host uses for raised\n   controls. Hover on a selected tab stays put \u2014 it is already where you are. */\n.bre-editor-tab[aria-selected='true'],\n.bre-editor-tab[aria-selected='true']:hover {\n  background: var(--dsw-alias-bg-layer-1, #fff);\n  color: var(--dsw-alias-label-primary, #0f1115);\n  box-shadow: 0 1px 2px #0000001a, 0 0 0 1px var(--dsw-alias-border-l2, #0000001a);\n}\n\n.bre-editor-tab:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary, #4d6bfe);\n  outline-offset: 1px;\n}\n\n/* An advanced section with no headers mount (pre-first-render, feature off)\n   offers an empty pane \u2014 the button steps aside until the mount exists. */\n.bre-editor-tab[hidden] { display: none; }\n\n/* Pane visibility, keyed on the card's active tab. Only the HIDING has to win\n   a specificity fight (against the official sheet and the headers host's own\n   reveal rule); the active pane keeps whatever display the official layout\n   gave it, so showing must not declare a display at all. */\n.bre-tabbed:not([data-bre-tab='provider']) [data-bre-region='provider'],\n.bre-tabbed:not([data-bre-tab='models']) [data-bre-region='models'],\n.bre-tabbed:not([data-bre-tab='advanced']) [data-bre-region='advanced'] {\n  display: none !important;\n}\n\n/* The advanced tab: the official body \u2014 fields, model list, action row and the\n   editor's own header \u2014 steps aside for the request-header section, which is a\n   complete form with its own save/cancel and becomes the pane under the very\n   same bar. */\n.bre-tabbed[data-bre-tab='advanced'] [data-bre-editor-body] {\n  display: none !important;\n}\n\n/* The advanced pane shows the section for the same reason the mount is shown:\n   a pane that is already the active one has no business depending on the\n   official-edit probe. The rule above still wins for every other tab, and the\n   base bre-headers rule keeps a collapsed card's section hidden \u2014 a card only\n   carries the taken-over class while its editor is open. */\n.bre-tabbed[data-bre-tab='advanced'] .bre-headers { display: flex; }\n\n/* The pane is a card, and the section draws it. On the advanced tab the section\n   is not an appendage to the fields above it any more \u2014 it is the whole surface\n   \u2014 so it takes the inset fill the official module cards use (the add and setup\n   cards): the one fill in this system that stays visible on the content card's\n   own white in the light theme and reads as raised in the dark one, where every\n   theme layer token collapses onto the same value. The hairline goes with it: it\n   divided this section from those fields, and here the bar above ends the pane.\n   The 12px top margin sets the card off the tab bar above it \u2014 the same gap the\n   provider and models panes put between the bar and their own cards \u2014 and the\n   12px padding is the card's inner inset, not the separator. */\n.bre-tabbed[data-bre-tab='advanced'] .bre-headers {\n  margin-top: 12px;\n  padding: 12px;\n  border-top: none;\n  border-radius: var(--dsw-radius-lg, 16px);\n  background: var(--dsw-alias-bg-module-platform, #f5f6f7);\n}\n\n/* The live editor folds its identity fields and model list into one\n   \"Customized\" disclosure. Under the tabs the grouping is the panes' job: the\n   group stays expanded (the pass forces it open) and its summary row \u2014 now a\n   toggle with nothing left to toggle \u2014 steps aside. */\n.bre-tabbed [data-bre-editor-body] details > summary {\n  display: none !important;\n}\n\n/* A region that is NOT a pane. The editor's own header repeats the card row's\n   provider name and route tag, and that row is already on screen directly above\n   it, so the header is hidden on every tab. No pane rule above can select this\n   id, which is what keeps it hidden whichever tab is active. */\n.bre-tabbed [data-bre-region='none'] {\n  display: none !important;\n}\n\n/* The Models pane shows the custom model list and the catalogue, and two\n   hairlines used to divide it: the \"Customized\" group's separator from the key\n   field (which this pane hides) and the catalogue's own, drawn directly above\n   its \"Model catalogue\" heading. Neither has anything to divide here \u2014 the tab\n   bar already ends the pane above, and the divider between the two lists above\n   the catalogue is the group's boundary, not a rule. Both go, with every top\n   padding that held content off them (the group's 10px, its body's 12px, the\n   catalogue's 12px), so the pane runs from the tab bar into the catalogue with\n   only the official editor's own 14px gap between blocks. */\n.bre-tabbed[data-bre-tab='models'] [data-bre-editor-body] details[class*='customized'] {\n  border-top: none;\n  padding-top: 0;\n}\n\n.bre-tabbed[data-bre-tab='models'] [data-bre-editor-body] details[class*='customized'] > [class*='customizedBody'] {\n  padding-top: 0;\n}\n\n/* The catalogue is a section (its heading, title and meta are the divs inside\n   it), so this probe hits the ruled box and nothing else. */\n.bre-tabbed[data-bre-tab='models'] [data-bre-editor-body] section[class*='modelCatalog'] {\n  border-top: none;\n  padding-top: 0;\n}\n\n/* The API-key eye. The official key field is a plain flex column whose input is\n   its last in-flow child, so the button hangs on the field's own box and is\n   measured against the input's 32px row \u2014 the official markup offers no\n   wrapper, and introducing one would mean moving DOM the host owns. The input\n   keeps the room the button needs. */\n.bre-key-field { position: relative; }\n\n.bre-key-field > input { padding-right: 34px; }\n\n/* A field the plugin's key list manages hands its input over: the list below\n   says the same thing once per key and keeps the pick, the alias and the value\n   in one place, so an official box that writes the provider's single key would\n   be a second, conflicting way to do it. The input stays in the DOM \u2014 the\n   host's form still owns it and the reveal pass still finds it \u2014 so unmanaging\n   the field brings the official box back. The marker is what the reveal pass\n   stamps on that input; the direct-child form covers the pass that has not run\n   yet, and the eye is the button the same pass hangs on the field. */\n.bre-key-managed [data-bre-key-input],\n.bre-key-managed > input,\n.bre-key-managed .bre-key-eye { display: none; }\n\n/* A field that failed validation grows a message line under the input; the eye\n   rides above it so it stays on the input it belongs to (18px line + 6px gap). */\n.bre-key-field:has(> p) .bre-key-eye { bottom: 24px; }\n\n.bre-key-eye {\n  position: absolute;\n  right: 4px;\n  bottom: 0;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 32px;\n  padding: 0;\n  border: 0;\n  border-radius: 8px;\n  background: transparent;\n  color: var(--dsw-alias-label-secondary, #6b7280);\n  cursor: pointer;\n  -webkit-appearance: none;\n  appearance: none;\n  transition: background 140ms ease, color 140ms ease;\n}\n\n.bre-key-eye:hover {\n  color: var(--dsw-alias-label-primary, #0f1115);\n  background: var(--dsw-alias-interactive-bg-hover);\n}\n\n.bre-key-eye:focus-visible {\n  outline: none;\n  box-shadow: inset 0 0 0 2px var(--dsw-alias-border-l3);\n}\n\n/* Resolving a stored key is a same-origin round trip, so the button can be\n   busy: it stays in place and dims rather than changing size or disappearing. */\n.bre-key-eye[aria-busy='true'] {\n  opacity: 0.55;\n  cursor: progress;\n}\n\n.bre-key-eye[hidden] { display: none; }\n\n/* One glyph at a time. The state lives on the button's own attribute, so a\n   click swaps the icon without the host re-rendering anything. */\n.bre-key-eye svg[data-bre-icon] { display: none; }\n\n.bre-key-eye[aria-pressed='false'] svg[data-bre-icon='eye'],\n.bre-key-eye[aria-pressed='true'] svg[data-bre-icon='eye-off'] { display: block; }\n\n/* The key list. The plugin mounts it into its own host, a sibling placed right\n   after the official key field, so the list sits under the input without\n   changing the field's own box: the reveal eye is measured against that box\n   (bottom: 0), and a list inside the field would drag the eye down onto the\n   list's last row. The margin only covers the case where the card spaces its\n   fields with margins instead of a gap. */\n.bre-keys-host {\n  display: block;\n  min-width: 0;\n  margin-top: 4px;\n}\n\n.bre-keys { display: flex; flex-direction: column; gap: 8px; }\n\n/* While the key list is still reading, the panel renders NOTHING (the component\n   returns an empty .bre-keys). An empty ruled box \u2014 or a placeholder line that\n   then swaps to the list \u2014 would paint one frame of a panel that then visibly\n   changes: the \"the key section flashes when you press Edit\" report. :empty\n   takes the panel out of the layout until the first answer lands, so the list\n   is the first thing the key area ever paints, and nothing under it moves. */\n.bre-keys:empty { display: none; }\n\n/* One ruled container holding the keys and the add entry, the way a settings\n   list reads: a single hairline box, and hairlines between rows only. */\n.bre-keys-list {\n  display: flex;\n  flex-direction: column;\n  margin: 0;\n  padding: 0;\n  border: 0.5px solid var(--dsw-alias-border-l2, #d5d7dd);\n  border-radius: 8px;\n  list-style: none;\n  overflow: hidden;\n}\n\n.bre-keys-list > li + li { border-top: 0.5px solid var(--dsw-alias-border-l2, #d5d7dd); }\n\n.bre-keys-row {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  min-width: 0;\n  padding: 9px 10px;\n}\n\n/* The enable choice closes the row. The radio stays the real input \u2014 so the\n   keys of one provider are one group, choosing one clears the rest, and the\n   pick is keyboard-reachable \u2014 and the circle is its face; the word beside it\n   names the action instead of a state to hunt for. */\n.bre-keys-enable {\n  display: inline-flex;\n  flex: 0 0 auto;\n  align-items: center;\n  gap: 6px;\n  cursor: pointer;\n}\n\n.bre-keys-enable-text {\n  font-size: 11px;\n  line-height: 1.5;\n  color: var(--dsw-alias-label-secondary, #6b7280);\n}\n\n.bre-keys-enable:has(.bre-keys-enabled:checked) .bre-keys-enable-text {\n  color: var(--dsw-alias-label-primary, #0f1115);\n}\n\n.bre-keys-enabled {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  margin: -1px;\n  padding: 0;\n  border: 0;\n  overflow: hidden;\n  white-space: nowrap;\n  clip-path: inset(50%);\n}\n\n.bre-keys-mark {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  box-sizing: border-box;\n  border: 1px solid var(--dsw-alias-border-l3, #9aa0aa);\n  border-radius: 50%;\n  color: var(--dsw-alias-bg-layer-1, #ffffff);\n  transition: background 120ms ease, border-color 120ms ease;\n}\n\n.bre-keys-mark > svg { width: 12px; height: 12px; }\n\n.bre-keys-enabled:checked + .bre-keys-mark {\n  border-color: var(--dsw-alias-label-primary, #0f1115);\n  background: var(--dsw-alias-label-primary, #0f1115);\n}\n\n.bre-keys-enabled:focus-visible + .bre-keys-mark {\n  outline: none;\n  box-shadow: 0 0 0 2px var(--dsw-alias-brand-primary, #3b82f6);\n}\n\n/* With an alias the alias is the row's name and the masked key follows it as a\n   quiet code pill; without one the masked key is the name and takes the row's\n   measure, so a key is always readable as itself. */\n.bre-keys-alias {\n  flex: 0 1 auto;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  font-size: 12px;\n  font-weight: 500;\n  color: var(--dsw-alias-label-primary, #0f1115);\n}\n\n.bre-keys-mask {\n  flex: 0 1 auto;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  padding: 1px 6px;\n  border-radius: 4px;\n  background: var(--dsw-alias-interactive-bg-hover, rgba(127, 127, 127, 0.08));\n  color: var(--dsw-alias-label-secondary, #6b7280);\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 11px;\n}\n\n.bre-keys-mask-plain {\n  flex: 1 1 auto;\n  padding: 0;\n  background: transparent;\n  color: var(--dsw-alias-label-primary, #0f1115);\n  font-family: inherit;\n  font-size: 12px;\n}\n\n/* The row's three actions, revealed on hover or keyboard focus rather than\n   removed, so the row keeps its width and nothing shifts under the pointer.\n   Revealing is opacity alone; a pointer that cannot hover simply always sees\n   them, because a hidden action there would be an unreachable one. */\n.bre-keys-actions {\n  display: inline-flex;\n  flex: 0 0 auto;\n  align-items: center;\n  gap: 10px;\n  margin-left: auto;\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity 120ms ease;\n}\n\n.bre-keys-row:hover .bre-keys-actions,\n.bre-keys-row:focus-within .bre-keys-actions {\n  opacity: 1;\n  pointer-events: auto;\n}\n\n@media (hover: none) {\n  .bre-keys-actions { opacity: 1; pointer-events: auto; }\n}\n\n.bre-keys-danger { color: var(--dsw-alias-state-error-primary, #c62828); }\n\n/* The one inline form. It opens under the row it edits, or \u2014 for a new key \u2014 as\n   the list's own last item, which is what keeps adding a key in place instead\n   of in a dialog that has to be found and dismissed. */\n.bre-keys-form-row { padding: 10px; }\n\n.bre-keys-form { display: flex; flex-direction: column; gap: 8px; }\n\n.bre-keys-form-fields {\n  display: grid;\n  grid-template-columns: repeat(2, minmax(0, 1fr));\n  gap: 8px;\n}\n\n/* One field means the whole row: the value form holds only the secret, and it\n   must not sit in half a row beside an empty half. */\n.bre-keys-form-fields > :only-child { grid-column: 1 / -1; }\n\n/* The shared input caps itself at 240px for the panels it was written for; here\n   the field is the measure. */\n.bre-keys-form-fields .bre-text-input { max-width: none; }\n\n.bre-keys-form-actions {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 8px;\n}\n\n/* The shared primary button is styled inside the headers editor, which is not\n   where this form lives, so the key list carries its own compact copy. */\n.bre-keys-form-actions .bre-primary-button {\n  height: 28px;\n  padding: 0 12px;\n  border: 0;\n  border-radius: var(--dsw-radius-md, 8px);\n  background: var(--dsw-alias-button-primary-fill, #0f1115);\n  color: var(--dsw-alias-label-primary-foreground, #ffffff);\n  font: inherit;\n  font-size: 12px;\n  cursor: pointer;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n.bre-keys-form-actions .bre-primary-button:hover {\n  background: var(--dsw-alias-button-primary-hover, #43454a);\n}\n\n.bre-keys-form-actions .bre-primary-button:disabled { opacity: 0.5; cursor: default; }\n\n.bre-keys-form-actions .bre-primary-button:focus-visible {\n  outline: none;\n  box-shadow: 0 0 0 2px var(--dsw-alias-brand-primary, #3b82f6);\n}\n\n/* The add entry is the list's own last row \u2014 full width, the same shape as the\n   keys it adds to \u2014 so the way in and the thing it makes read as one list. */\n.bre-keys-add-row { padding: 0; }\n\n.bre-keys-add {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  width: 100%;\n  padding: 9px 10px;\n  box-sizing: border-box;\n  border: 0;\n  background: transparent;\n  color: var(--dsw-alias-label-secondary, #6b7280);\n  font: inherit;\n  font-size: 12px;\n  text-align: left;\n  cursor: pointer;\n  -webkit-appearance: none;\n  appearance: none;\n  transition: background 120ms ease, color 120ms ease;\n}\n\n.bre-keys-add:hover {\n  background: var(--dsw-alias-interactive-bg-hover, rgba(127, 127, 127, 0.08));\n  color: var(--dsw-alias-label-primary, #0f1115);\n}\n\n.bre-keys-add:focus-visible {\n  outline: none;\n  box-shadow: inset 0 0 0 2px var(--dsw-alias-brand-primary, #3b82f6);\n}\n\n.bre-keys-add:disabled { opacity: 0.55; cursor: default; }\n\n.bre-keys-add-mark {\n  display: inline-flex;\n  flex: 0 0 auto;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n}\n\n.bre-keys .bre-effort-message { font-size: 11px; }\n\n@media (prefers-reduced-motion: reduce) {\n  .bre-editor-tab { transition: none; }\n  .bre-key-eye { transition: none; }\n  .bre-keys-mark, .bre-keys-actions, .bre-keys-add { transition: none; }\n}\n";
+export declare const STYLES = "\n/* The injector's mount wrapper. It \u2014 not the editor inside it \u2014 is the item\n   placed into the official row disclosure's repeat(auto-fit, minmax(160px,1fr))\n   grid (context window and max tokens take two cells), so the span belongs\n   here: on the editor itself it would target the wrapper's block box and be\n   ignored, squeezing the block into one cell. */\n.bre-effort-slot {\n  grid-column: 1 / -1;\n}\n/* The slot wrapper is a plain column: the master thinking switch sits in it,\n   directly above the card it gates. */\n.bre-effort-editor {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  margin: 8px 0 4px;\n}\n/* The \u601D\u8003\u5F3A\u5EA6 card proper \u2014 rendered only while the master switch is on. */\n.bre-effort-card {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 10px 12px;\n  border: 0.5px solid var(--dsw-alias-border-l2);\n  border-radius: 8px;\n  background: var(--dsw-alias-bg-layer-2);\n  box-sizing: border-box;\n}\n.bre-effort-head {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 8px;\n}\n.bre-effort-title {\n  font-size: 12px;\n  font-weight: 600;\n  color: var(--dsw-alias-label-secondary);\n}\n.bre-link-button {\n  background: none;\n  border: none;\n  padding: 2px 6px;\n  font-size: 12px;\n  color: var(--dsw-alias-link);\n  cursor: pointer;\n  border-radius: 4px;\n}\n.bre-link-button:hover { text-decoration: underline; }\n.bre-link-button:disabled { opacity: 0.5; cursor: default; text-decoration: none; }\n.bre-auto-effort {\n  /* Seated in the OFFICIAL catalogue head, beside the host's own fetch link:\n     it borrows the plugin's link metrics and only adds the gap the head's own\n     controls are spaced by, so it reads as one more control of that row. */\n  margin-left: 4px;\n  flex: none;\n}\n.bre-effort-grid {\n  /* Exactly two equal columns mirroring the official capacity pair the editor\n     sits under; an odd row count leaves the last cell in the left column,\n     so the left side carries the extra level. */\n  display: grid;\n  grid-template-columns: repeat(2, minmax(0, 1fr));\n  gap: 4px 16px;\n}\n.bre-effort-row {\n  display: grid;\n  grid-template-columns: 20px 76px minmax(0, 1fr);\n  align-items: center;\n  gap: 6px;\n  font-size: 12px;\n}\n.bre-effort-row input[type='checkbox'] {\n  /* Bigger than the browser default (~13px): a tap/point target that does\n     not require precision, in the theme accent when checked. */\n  width: 18px;\n  height: 18px;\n  margin: 0;\n  accent-color: var(--dsw-alias-brand-primary);\n  cursor: pointer;\n}\n.bre-effort-level { color: var(--dsw-alias-label-tertiary); }\n.bre-effort-wire {\n  box-sizing: border-box;\n  min-width: 0;\n  height: 24px;\n  padding: 0 6px;\n  border: 0.5px solid var(--dsw-alias-border-l4);\n  border-radius: 4px;\n  background: var(--dsw-alias-bg-layer-1);\n  color: var(--dsw-alias-label-primary);\n  font: inherit;\n  font-size: 12px;\n}\n.bre-effort-wire:focus {\n  outline: none;\n  border-color: var(--dsw-alias-brand-primary);\n}\n.bre-effort-empty { min-height: 24px; }\n.bre-effort-actions {\n  display: flex;\n  gap: 8px;\n  justify-content: flex-end;\n}\n.bre-secondary-button {\n  height: 26px;\n  padding: 0 12px;\n  border-radius: 6px;\n  font-size: 12px;\n  cursor: pointer;\n  border: 0.5px solid var(--dsw-alias-border-l3);\n}\n.bre-secondary-button:disabled { opacity: 0.5; cursor: default; }\n.bre-secondary-button { background: transparent; color: inherit; }\n.bre-effort-message { font-size: 12px; margin: 0; }\n.bre-effort-message.bre-error { color: #c62828; }\n.bre-effort-message.bre-info { color: var(--dsw-alias-link); }\n.bre-effort-note { font-size: 11px; margin: 0; color: var(--dsw-alias-label-tertiary); }\n/* ---- Input-modality section ---- */\n.bre-modality {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n.bre-modality-row {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 12px;\n}\n.bre-modality-row input[type='checkbox'] {\n  width: 18px;\n  height: 18px;\n  margin: 0;\n  accent-color: var(--dsw-alias-brand-primary);\n  cursor: pointer;\n}\n.bre-modality-clear { margin-left: auto; }\n.bre-modality-note { font-size: 11px; margin: 0; color: var(--dsw-alias-label-tertiary); }\n/* The master thinking switch, which lives OUTSIDE the card it gates: with it\n   off that card is not rendered at all, so nothing here has to be hidden. */\n.bre-thinking-switch { margin: 0; }\n/* ---- Endpoint-compatibility controls ----\n   Same shape as the official capacity fields the editor sits under: a caption\n   above the control, the control capped at the official enum width (a field\n   width dropdown reads as a text field the user is expected to fill), and a\n   hint line beneath. Tokens are the official ones \u2014 the plugin's own --dsh-*\n   names are defined nowhere in this app, so their light-mode literals used to\n   render in both themes. */\n.bre-compat {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n.bre-compat-row {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  min-width: 0;\n}\n.bre-compat-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }\n.bre-compat-label {\n  font-size: 12px;\n  line-height: 18px;\n  color: var(--dsw-alias-label-tertiary);\n}\n.bre-compat-hint {\n  font-size: 11px;\n  line-height: 16px;\n  color: var(--dsw-alias-label-tertiary);\n}\n.bre-select, .bre-text-input {\n  box-sizing: border-box;\n  width: 100%;\n  max-width: 240px;\n  height: 32px;\n  padding: 0 10px;\n  border: 0.5px solid var(--dsw-alias-border-l4);\n  border-radius: 8px;\n  background: var(--dsw-alias-bg-layer-1);\n  color: var(--dsw-alias-label-primary);\n  font: inherit;\n  font-size: 14px;\n  line-height: 22px;\n}\n.bre-text-input::placeholder { color: var(--dsw-alias-label-dimmed); }\n.bre-select:focus, .bre-text-input:focus {\n  outline: none;\n  border-color: var(--dsw-alias-brand-primary);\n}\n.bre-select:disabled, .bre-text-input:disabled { opacity: 0.6; cursor: default; }\n.bre-select {\n  cursor: pointer;\n  /* The OS arrow sits flush against the right edge; the official select swaps\n     it for the shared 12px chevron inset on the same right pad. Data-URI SVGs\n     cannot resolve CSS variables, so the stroke is the caption gray both\n     themes share. */\n  appearance: none;\n  padding-right: 32px;\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M3 4.5L6 7.5L9 4.5' stroke='%2381858C' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E\");\n  background-repeat: no-repeat;\n  background-position: right 12px center;\n  background-size: 12px 12px;\n}\n.bre-error { color: var(--dsw-alias-state-error-primary); }\n/* ---- Zoned suggestion display ---- */\n.bre-suggestion {\n  display: flex;\n  flex-direction: column;\n  gap: 3px;\n}\n.bre-reference {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: baseline;\n  gap: 4px 14px;\n  padding: 6px 8px;\n  border: 1px dashed var(--dsw-alias-border-l3);\n  border-radius: 6px;\n  font-size: 11px;\n  color: var(--dsw-alias-label-tertiary);\n}\n.bre-reference-title { font-weight: 600; }\n.bre-reference-values { display: inline-flex; gap: 14px; }\n/* ---- Composer model-menu slider (mounted inside the OFFICIAL menu) ----\n   Visuals ported VERBATIM from HanaAyane's dsh-reasoning-effort (MIT) \u2014 the\n   only deliberate difference is the chibi-runner \"big fish\" knob, which is\n   dropped so the knob is always the white circle. Class names are re-\n   prefixed bre- (the upstream's re- prefix would clash while both plugins\n   are installed); every color/size/animation value stays upstream's. */\n.bre-slider-body {\n  /* The replicated popover body. The official menu shell carries padding: 4px\n     (ModelSelect.module.css), so pull the replica flush to the box. overflow\n     stays VISIBLE: an open list is laid out inside the body, so nothing ever\n     has to escape it, and the rows' own hover radius needs no clipping. */\n  overflow: visible;\n  margin: -4px;\n  padding: 8px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n/* The official menu is content-sized; while the replicated popover body is\n   live, its box takes the upstream .re-model-menu width. The class is added\n   by the mount and removed when the slider is switched off. */\n.bre-model-menu-host {\n  width: min(340px, calc(100vw - 32px));\n  min-width: 0;\n}\n/* The official trigger keeps ownership of its model/effort children. The\n   provider prefix is a pseudo-element so host React updates, focus handling and\n   the click target remain untouched.\n\n   Scoped to the composer, which owns the only button that carries this stamp.\n   The settings sidebar's account button is ALSO an [aria-haspopup=\"menu\"]\n   button, so an unscoped rule paints the prefix onto the account row the\n   moment a stale stamp lands there \u2014 and a stamp that escaped the composer\n   must render nothing rather than relabel a host control. The seat anchor is\n   listed too, so a shell that renders the trigger outside the card body still\n   gets the prefix. */\n[data-composer-card] button[data-bre-provider]::before,\n[data-slot=\"conversation.input.model\"] button[data-bre-provider]::before {\n  content: attr(data-bre-provider) \" \u00B7 \";\n  flex: none;\n  color: var(--dsw-alias-label-secondary);\n  font-weight: 400;\n  white-space: nowrap;\n}\n\n/* ---- Model / reasoning-level rows ----\n   Presentation follows dsh-tauri-model-config's settings rows\n   (src/client/models/styles.ts: .zGbnIq_rowCard / .zGbnIq_rowHead /\n   .zGbnIq_iconButton): hairline separators between rows and a list opening\n   under the row it belongs to. Re-prefixed bre- and routed through the tokens\n   this file already uses. */\n/* Layout only \u2014 it deliberately paints NO background, border, radius or\n   overflow clip. The replica is mounted inside the OFFICIAL menu, and that\n   shell already draws its own surface (MenuSurface: a [data-menu-material]\n   panel whose .material child paints --dsw-menu-surface-fill, i.e.\n   --dsw-specific-menu, under backdrop-filter: var(--dsw-menu-backdrop-filter),\n   rounded by --dsw-radius-lg and outlined by --dsw-elevation-prominent).\n   A second opaque card in here shows that official surface as a grey frame\n   around it \u2014 two stacked surfaces where every other menu in the app has one. */\n.bre-card {\n  display: flex;\n  flex-direction: column;\n}\n.bre-row-control {\n  appearance: none;\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  width: 100%;\n  min-height: 38px;\n  padding: 0 10px;\n  border: 0;\n  /* Matches the official menu cells (.u91W7W_cell / .u91W7W_option use\n     --dsw-radius-md, 8px here) and the .bre-option rows below, now that the\n     surface behind the rows is the menu's own and hover is no longer clipped\n     by a card. */\n  border-radius: 8px;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  text-align: left;\n  cursor: pointer;\n  transition: background 120ms ease;\n}\n.bre-row-control:hover:not(:disabled) {\n  background: var(--dsw-alias-interactive-bg-hover, rgba(120, 125, 140, .09));\n}\n.bre-row-control.is-open { background: var(--dsw-alias-fill-tertiary, rgba(120, 125, 140, .09)); }\n.bre-row-control:disabled { cursor: default; opacity: .6; }\n.bre-row-control:focus-visible {\n  outline: none;\n  box-shadow: inset 0 0 0 2px var(--dsw-alias-border-l3);\n}\n.bre-row-label {\n  flex: none;\n  font-size: 13px;\n  line-height: 20px;\n  color: var(--dsw-alias-label-secondary);\n}\n.bre-row-value {\n  flex: 1 1 auto;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  text-align: right;\n  font-size: 13px;\n  line-height: 20px;\n  font-weight: 500;\n  color: var(--dsw-alias-label-primary);\n}\n.bre-row-value.is-muted { font-weight: 400; color: var(--dsw-alias-label-tertiary); }\n.bre-divider { height: 1px; margin: 0 10px; background: var(--dsw-alias-border-l4); }\n.bre-panel {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  max-height: 220px;\n  overflow-y: auto;\n  padding: 2px 6px 8px;\n}\n/* Provider column + model column of the model list, side by side. The height is\n   FIXED: switching provider must not resize the card, or every click would need\n   another same-frame re-place and any missed one shows as a jump. */\n.bre-panel-models {\n  flex-direction: row;\n  align-items: stretch;\n  gap: 0;\n  height: 240px;\n  max-height: none;\n  overflow: hidden;\n  padding: 4px 6px 8px;\n}\n.bre-providers {\n  flex: none;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  width: 112px;\n  overflow-y: auto;\n  padding-right: 2px;\n}\n.bre-provider-models {\n  flex: 1 1 auto;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  overflow-y: auto;\n  margin-left: 6px;\n  padding-left: 6px;\n  border-left: 1px solid var(--dsw-alias-border-l4);\n}\n.bre-option,\n.bre-provider {\n  appearance: none;\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  width: 100%;\n  min-height: 30px;\n  padding: 0 8px;\n  border: 0;\n  border-radius: 8px;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  font-size: 13px;\n  line-height: 20px;\n  text-align: left;\n  cursor: pointer;\n  transition: background 120ms ease, color 120ms ease;\n}\n/* The provider cell carries its chevron hard against the right edge. */\n.bre-provider { gap: 4px; padding: 0 4px 0 8px; }\n.bre-option:hover:not(:disabled),\n.bre-provider:hover:not(:disabled) {\n  background: var(--dsw-alias-interactive-bg-hover, rgba(120, 125, 140, .09));\n}\n.bre-option:disabled,\n.bre-provider:disabled { cursor: default; opacity: .6; }\n.bre-option:focus-visible,\n.bre-provider:focus-visible {\n  outline: none;\n  box-shadow: inset 0 0 0 2px var(--dsw-alias-border-l3);\n}\n.bre-option-name {\n  flex: 1 1 auto;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.bre-option.is-active {\n  color: var(--dsw-static-deepseek-500, #4d70ff);\n  font-weight: 500;\n  background: var(--dsw-alias-fill-tertiary, rgba(120, 125, 140, .09));\n}\n/* The open provider is the highlighted one; the provider of the CURRENT model\n   keeps the accent so the column says where the selection lives. */\n.bre-provider.is-open { background: var(--dsw-alias-fill-tertiary, rgba(120, 125, 140, .09)); }\n.bre-provider.is-current .bre-option-name {\n  color: var(--dsw-static-deepseek-500, #4d70ff);\n  font-weight: 500;\n}\n.bre-provider .bre-row-chevron { width: 14px; height: 14px; font-size: 14px; }\n/* Capability badges on a model row (image input / thinking). Muted so the name\n   stays the brightest thing in the row; the badge's own title carries the copy. */\n.bre-option-tags {\n  flex: none;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  color: var(--dsw-alias-label-tertiary);\n}\n.bre-option.is-active .bre-option-tags { color: var(--dsw-static-deepseek-500, #4d70ff); }\n.bre-tag { display: inline-flex; align-items: center; }\n.bre-tag-icon { display: block; width: 13px; height: 13px; }\n.bre-option-check { flex: none; width: 14px; height: 14px; }\n.bre-empty { padding: 6px 8px; font-size: 12px; color: var(--dsw-alias-label-tertiary); }\n.bre-slider-advanced {\n  /* upstream .re-advanced: the padded area that hosts the slider */\n  padding: 14px;\n}\n.bre-effort {\n  display: flex;\n  align-items: center;\n  width: 100%;\n  min-width: 0;\n  height: 32px;\n  color: var(--dsw-alias-label-secondary);\n  user-select: none;\n  box-sizing: border-box;\n}\n.bre-effort-slider {\n  --bre-progress: 50%;\n  position: relative;\n  width: 100%;\n  height: 30px;\n  flex: 1 1 auto;\n  border-radius: 999px;\n  isolation: isolate;\n  transition: filter 180ms ease;\n}\n.bre-effort-track {\n  position: absolute;\n  inset: 0;\n  overflow: hidden;\n  border-radius: inherit;\n  background: linear-gradient(100deg, #03040a 0%, #071126 22%, #101d4c 45%, #302262 70%, #5d35a0 100%);\n  box-shadow:\n    inset 0 1px 0 rgba(189, 199, 255, .15),\n    inset 0 -1px 0 rgba(0, 0, 0, .55),\n    0 3px 10px rgba(12, 17, 55, .34);\n}\n.bre-effort-track::after {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  background:\n    radial-gradient(circle at 18% 45%, rgba(82, 130, 255, .12), transparent 24%),\n    linear-gradient(90deg, rgba(0, 0, 0, .28), transparent 42%, rgba(168, 113, 255, .12));\n  pointer-events: none;\n}\n.bre-effort-fx {\n  position: absolute;\n  z-index: 1;\n  inset: 0;\n  overflow: hidden;\n  border-radius: inherit;\n  pointer-events: none;\n}\n.bre-effort-canvas {\n  position: absolute;\n  z-index: 2;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  opacity: 1;\n  image-rendering: pixelated;\n  mix-blend-mode: screen;\n  transition: filter 140ms ease;\n}\n.bre-effort-flare {\n  position: absolute;\n  z-index: 3;\n  top: 50%;\n  left: var(--bre-progress);\n  width: 78px;\n  height: 46px;\n  border-radius: 50%;\n  background: radial-gradient(ellipse at 100% 50%, rgba(255,255,255,.96) 0 4%, rgba(188,189,255,.8) 11%, rgba(106,87,255,.5) 28%, rgba(105,31,255,.2) 49%, transparent 74%);\n  filter: blur(2px) saturate(1.25);\n  mix-blend-mode: screen;\n  transform: translate(-100%, -50%);\n  transition: left 70ms linear, filter 140ms ease;\n  pointer-events: none;\n}\n.bre-effort-flare::before,\n.bre-effort-flare::after {\n  content: \"\";\n  position: absolute;\n  inset: 50% auto auto 100%;\n  border-radius: 999px;\n  transform: translate(-50%, -50%);\n}\n.bre-effort-flare::before {\n  width: 52px;\n  height: 1px;\n  background: linear-gradient(90deg, transparent, rgba(100,160,255,.42), #f1ecff, rgba(193,82,255,.65), transparent);\n  box-shadow: 0 0 7px #9b7cff, 0 0 13px rgba(72,132,255,.64);\n}\n.bre-effort-flare::after {\n  width: 1px;\n  height: 20px;\n  background: linear-gradient(180deg, transparent, rgba(196,190,255,.84), transparent);\n  box-shadow: 0 0 7px #9c7cff;\n}\n.bre-effort-knob {\n  position: absolute;\n  z-index: 4;\n  top: 50%;\n  left: clamp(14px, var(--bre-progress), calc(100% - 14px));\n  width: 28px;\n  height: 28px;\n  border: 1px solid rgba(255,255,255,.94);\n  border-radius: 50%;\n  background: #fff;\n  box-shadow:\n    0 0 0 2px rgba(92,105,255,.12),\n    0 0 14px rgba(121,82,255,.48),\n    0 2px 7px rgba(0,0,0,.3);\n  transform: translate(-50%, -50%);\n  transition: left 190ms cubic-bezier(.22,1,.36,1), transform 160ms ease, box-shadow 180ms ease;\n  pointer-events: none;\n}\n.bre-effort-input {\n  position: absolute;\n  z-index: 5;\n  inset: -5px 0;\n  width: 100%;\n  height: calc(100% + 10px);\n  margin: 0;\n  opacity: 0;\n  cursor: grab;\n  touch-action: none;\n}\n.bre-effort-input:active { cursor: grabbing; }\n.bre-effort-input:focus-visible + .bre-effort-knob {\n  outline: 2px solid var(--dsw-static-blue-400);\n  outline-offset: 2px;\n}\n.bre-effort.is-dragging .bre-effort-canvas {\n  filter: saturate(1.45) brightness(1.28) contrast(1.06);\n}\n.bre-effort.is-dragging .bre-effort-flare {\n  filter: blur(1.5px) saturate(1.6) brightness(1.42);\n  transition: none;\n}\n.bre-effort.is-dragging .bre-effort-knob {\n  transform: translate(-50%, -50%) scale(1.07);\n  transition: none;\n  box-shadow:\n    0 0 0 3px rgba(113,115,255,.25),\n    0 0 20px rgba(74,145,255,.86),\n    0 0 31px rgba(171,53,255,.66),\n    0 3px 8px rgba(0,0,0,.32);\n}\n.bre-effort-slider[data-top] .bre-effort-track {\n  animation: bre-effort-dark-breathe 1.9s ease-in-out infinite;\n}\n.bre-effort-slider[data-top] .bre-effort-knob {\n  box-shadow:\n    0 0 0 3px rgba(119,99,255,.18),\n    0 0 22px rgba(135,78,255,.76),\n    0 0 34px rgba(53,121,255,.34),\n    0 3px 8px rgba(0,0,0,.3);\n}\n.bre-effort.is-error .bre-effort-slider {\n  outline: 1px solid var(--dsw-alias-state-error-secondary);\n  outline-offset: 2px;\n}\n.bre-effort.is-busy { opacity: .72; }\n.bre-effort-sr {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border: 0;\n}\nbody:not([data-ds-dark-theme]) .bre-effort-slider {\n  filter: none;\n}\nbody:not([data-ds-dark-theme]) .bre-effort-track {\n  background: var(--dsw-static-blue-75, #e5f0ff);\n  box-shadow:\n    inset 0 1px 0 rgba(255,255,255,.9),\n    inset 0 0 0 1px rgba(80,133,194,.14),\n    0 3px 10px rgba(48,101,165,.13);\n}\nbody:not([data-ds-dark-theme]) .bre-effort-track::before {\n  content: \"\";\n  position: absolute;\n  z-index: 0;\n  inset: 0 auto 0 0;\n  width: var(--bre-progress);\n  border-radius: inherit;\n  background: linear-gradient(90deg, #fff 0%, #e2f0ff 20%, #a8d0fb 57%, #438fdf 100%);\n  transition: width 190ms cubic-bezier(.22,1,.36,1);\n}\nbody:not([data-ds-dark-theme]) .bre-effort-slider[data-top] .bre-effort-track::before {\n  background: linear-gradient(90deg, #fff 0%, #d7eaff 18%, #75afea 54%, #0751ad 100%);\n}\nbody:not([data-ds-dark-theme]) .bre-effort.is-dragging .bre-effort-track::before {\n  transition: none;\n}\nbody:not([data-ds-dark-theme]) .bre-effort-track::after {\n  z-index: 1;\n  background: linear-gradient(90deg, rgba(255,255,255,.48), transparent 34%, rgba(23,101,201,.07));\n}\nbody:not([data-ds-dark-theme]) .bre-effort-canvas {\n  opacity: .78;\n  mix-blend-mode: multiply;\n}\nbody:not([data-ds-dark-theme]) .bre-effort-flare {\n  background: radial-gradient(ellipse at 100% 50%, rgba(255,255,255,.98) 0 5%, rgba(204,231,255,.88) 13%, rgba(91,162,241,.48) 31%, rgba(37,111,207,.16) 53%, transparent 75%);\n  filter: blur(2px) saturate(1.12);\n}\nbody:not([data-ds-dark-theme]) .bre-effort-flare::before {\n  background: linear-gradient(90deg, transparent, rgba(116,177,244,.34), #fff, rgba(66,139,225,.58), transparent);\n  box-shadow: 0 0 7px rgba(58,133,222,.5), 0 0 13px rgba(104,176,255,.38);\n}\nbody:not([data-ds-dark-theme]) .bre-effort-flare::after {\n  background: linear-gradient(180deg, transparent, rgba(255,255,255,.94), transparent);\n  box-shadow: 0 0 7px rgba(64,137,224,.44);\n}\nbody:not([data-ds-dark-theme]) .bre-effort-knob {\n  border-color: rgba(126,160,197,.32);\n  box-shadow:\n    0 0 0 2px rgba(58,124,207,.09),\n    0 0 13px rgba(48,118,207,.3),\n    0 3px 8px rgba(39,77,119,.18);\n}\nbody:not([data-ds-dark-theme]) .bre-effort-slider[data-top] .bre-effort-track {\n  animation-name: bre-effort-light-breathe;\n}\nbody:not([data-ds-dark-theme]) .bre-effort-slider[data-top] .bre-effort-knob,\nbody:not([data-ds-dark-theme]) .bre-effort.is-dragging .bre-effort-knob {\n  box-shadow:\n    0 0 0 3px rgba(36,105,192,.15),\n    0 0 20px rgba(25,100,201,.45),\n    0 3px 8px rgba(39,77,119,.18);\n}\n@keyframes bre-effort-dark-breathe {\n  0%, 100% { box-shadow: inset 0 1px 0 rgba(196,204,255,.16), 0 3px 10px rgba(18,25,72,.4); }\n  50% { box-shadow: inset 0 1px 0 rgba(220,214,255,.24), 0 0 21px rgba(111,66,255,.5); }\n}\n@keyframes bre-effort-light-breathe {\n  0%, 100% { box-shadow: inset 0 1px 0 rgba(255,255,255,.9), inset 0 0 0 1px rgba(67,124,193,.16), 0 3px 10px rgba(48,101,165,.13); }\n  50% { box-shadow: inset 0 1px 0 rgba(255,255,255,.96), inset 0 0 0 1px rgba(31,102,190,.22), 0 0 19px rgba(31,105,201,.24); }\n}\n.bre-slider-hint {\n  /* upstream re-model-status */\n  display: block;\n  padding: 14px;\n  color: var(--dsw-alias-label-tertiary, #9296a0);\n  font-size: 12px;\n  text-align: center;\n}\n/* upstream re-model-error: the directory/store error line under the row */\n.bre-model-error {\n  margin: 8px;\n  padding: 8px 10px;\n  border-radius: 8px;\n  color: var(--dsw-alias-state-error-primary, #c83e4d);\n  background: var(--dsw-alias-state-error-tertiary, rgba(220,55,70,.08));\n  font-size: 11px;\n}\n/* upstream .re-menu-separator */\n.bre-menu-separator {\n  height: 1px;\n  background: var(--dsw-alias-stroke-secondary, rgba(121,126,145,.16));\n}\n/* upstream .re-model-row: name \u00B7 current effort \u203A (click \u2192 official model list) */\n.bre-model-row {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) auto auto;\n  align-items: center;\n  gap: 8px;\n  min-height: 45px;\n  padding: 0 14px;\n  width: 100%;\n  border: 0;\n  color: inherit;\n  background: transparent;\n  font: inherit;\n  text-align: left;\n  cursor: pointer;\n}\n.bre-model-row:hover { background: var(--dsw-alias-fill-tertiary, rgba(120,125,140,.09)); }\n.bre-model-row-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }\n.bre-model-row-effort { color: var(--dsw-static-deepseek-500, #4d70ff); font-size: 12px; }\n.bre-row-chevron {\n  flex: none;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  font-size: 18px;\n  line-height: 1;\n  color: var(--dsw-alias-label-tertiary);\n  transform: rotate(0deg);\n  transition: transform 120ms ease;\n}\n.bre-row-chevron.is-open { transform: rotate(90deg); }\n@media (prefers-reduced-motion: reduce) {\n  .bre-effort-slider[data-top] .bre-effort-track { animation: none; }\n  .bre-effort-knob,\n  .bre-effort-flare,\n  body:not([data-ds-dark-theme]) .bre-effort-track::before { transition: none; }\n}\n/* ---- Models-page slider toggle (boxed setting item) ----\n   Item form ported VERBATIM from upstream .re-setting-row; the surrounding\n   box is the requested container (border only, transparent background). */\n.bre-slider-setting {\n  margin-top: 12px;\n  padding: 0 14px;\n  border: 1px solid var(--dsw-alias-stroke-secondary, rgba(121,126,145,.2));\n  border-radius: 12px;\n  background: transparent;\n}\n.bre-slider-setting-row {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 24px;\n  padding: 16px 0;\n  /* Upstream .re-setting-row carries a list bottom border because the general\n     settings list held TWO rows (the slider + the big-fish toggle). This box\n     holds exactly one, so no divider: the box itself is the container. */\n}\n.bre-slider-setting-copy { min-width: 0; }\n.bre-slider-setting-title {\n  color: var(--dsw-alias-label-primary, #15171b);\n  font-size: 14px;\n  font-weight: 400;\n  line-height: 22px;\n}\n.bre-slider-setting-description {\n  margin-top: 3px;\n  color: var(--dsw-alias-label-tertiary, #9296a0);\n  font-size: 12px;\n  line-height: 18px;\n}\n.bre-slider-setting-control { display: inline-flex; align-items: center; gap: 10px; flex: none; }\n.bre-slider-setting-state { color: var(--dsw-alias-label-secondary, #686c75); font-size: 13px; }\n.bre-slider-setting-switch {\n  position: relative;\n  width: 38px;\n  height: 22px;\n  padding: 0;\n  border: 0;\n  border-radius: 999px;\n  background: var(--dsw-alias-fill-quaternary, #c7cbd3);\n  cursor: pointer;\n  transition: background 150ms ease;\n}\n.bre-slider-setting-switch:hover { filter: brightness(.97); }\n.bre-slider-setting-switch:disabled { cursor: not-allowed; opacity: .45; }\n.bre-slider-setting-switch:focus-visible {\n  outline: 2px solid var(--dsw-static-blue-400, #5d83ff);\n  outline-offset: 2px;\n}\n.bre-slider-setting-switch.is-on { background: var(--dsw-alias-state-business-primary, #4f73ff); }\n.bre-slider-setting-switch-knob {\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 18px;\n  height: 18px;\n  border-radius: 50%;\n  background: #fff;\n  box-shadow: 0 1px 4px rgba(0,0,0,.2);\n  transition: transform 170ms cubic-bezier(.22,1,.36,1);\n}\n.bre-slider-setting-switch.is-on .bre-slider-setting-switch-knob { transform: translateX(16px); }\n\n/* Model selection search box */\n.bre-model-search-box {\n  display: flex;\n  flex-direction: column;\n  padding: 6px 8px 4px;\n  position: sticky;\n  top: 0;\n  z-index: 2;\n  background: var(--dsw-specific-menu, var(--dsw-alias-bg-layer-1, #1e1f22));\n}\n.bre-model-search-box:has(.bre-search-empty),\n.bre-model-search-box.has-empty {\n  flex: 1 1 auto;\n}\n.bre-search-input-wrapper {\n  display: flex;\n  align-items: center;\n  position: relative;\n  width: 100%;\n  height: 32px;\n  padding: 0 8px;\n  box-sizing: border-box;\n  border-radius: 8px;\n  background: var(--dsw-alias-bg-layer-2, rgba(255, 255, 255, 0.06));\n  border: 0.5px solid var(--dsw-alias-border-l4, rgba(255, 255, 255, 0.12));\n  color: var(--dsw-alias-label-primary);\n  transition: border-color 150ms ease, box-shadow 150ms ease;\n}\n.bre-search-input-wrapper:focus-within {\n  border-color: var(--dsw-static-deepseek-500, #4d70ff);\n  box-shadow: 0 0 0 2px rgba(77, 112, 255, 0.2);\n}\n.bre-search-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: 0 0 16px;\n  width: 16px;\n  height: 16px;\n  margin-right: 6px;\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  pointer-events: none;\n}\n.bre-search-icon svg {\n  width: 14px;\n  height: 14px;\n}\n.bre-search-input {\n  flex: 1 1 auto;\n  min-width: 0;\n  height: 100%;\n  padding: 0;\n  border: none;\n  outline: none;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  font-size: 13px;\n  line-height: 20px;\n}\n.bre-search-input::placeholder {\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  opacity: 0.85;\n}\n.bre-search-clear {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: 0 0 18px;\n  width: 18px;\n  height: 18px;\n  margin-left: 4px;\n  padding: 0;\n  border: none;\n  border-radius: 4px;\n  background: transparent;\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  cursor: pointer;\n  transition: background 120ms ease, color 120ms ease;\n}\n.bre-search-clear:hover {\n  background: var(--dsw-alias-interactive-bg-hover, rgba(255, 255, 255, 0.1));\n  color: var(--dsw-alias-label-primary);\n}\n.bre-search-clear svg {\n  width: 12px;\n  height: 12px;\n}\n.bre-search-empty {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: 1 1 auto;\n  min-height: 180px;\n  padding: 24px 16px;\n  text-align: center;\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  font-size: 13px;\n  line-height: 20px;\n  user-select: none;\n}\n\n/* ---- Request-header section (issue #12). Mounted through the official\n   settings.models.provider-card seat, so it sits in the card's own layout\n   rather than a disclosure grid.\n\n   Every value below was MEASURED off the official Models page's own controls\n   in DSH 0.1.7-rc.2 rather than guessed, and each is expressed through the same\n   --dsw-alias-* token the host paints with, so a theme switch (light/dark)\n   repaints this section along with the page:\n\n     provider card   radius 20px, 1px var(--dsw-alias-settings-card-stroke)\n     editor action   save = filled var(--dsw-alias-button-primary-fill), h36,\n                     radius 12px, 0 14px, 14px; cancel = 1px border, same box\n     row action      h28, radius 8px, 0 10px, 12px, 1px border\n     text link       h21, radius 4px, 2px 6px, 12px, link-blue label\n     text input      radius 12px, 0 10px, 1px var(--dsw-alias-border-l3)  ---- */\n/* The provider-card slot's wrapper.\n   The official slot mounts us inside a display:contents container, so our own\n   root IS a flex item of the card row \u2014 and the row lays its children out with\n   a 12px gap. A wrapper that stays in the flow while empty therefore adds one\n   phantom gap to EVERY card in the list, which is exactly the height regression\n   this rule exists to prevent. Collapsed, the wrapper leaves the flow entirely:\n   the card renders as it did before the plugin.\n   (Deliberately NOT display:contents here \u2014 that keeps it a gap-participating\n   item, which is the bug this rule fixes.)\n   Open, it becomes an ordinary block so the section below can lay itself out.\n   data-edit lives HERE \u2014 the occurrence component publishes the card's state\n   onto its own root, so keying the rule on .bre-headers[data-edit] instead\n   would silently never match. */\n.bre-headers-host {\n  display: none;\n}\n.bre-headers-host[data-edit=\"1\"] {\n  display: block;\n}\n.bre-headers {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  /* The card lays its own children out with a 12px gap and no dividers; this\n     section is an addition to that column, so it separates itself the same way\n     the host separates card sections \u2014 a hairline on the card's own stroke. */\n  border-top: 1px solid var(--dsw-alias-border-l2, #0000001a);\n  padding-top: 12px;\n\n  /* Present ONLY while the provider card is being edited.\n     The provider list is a list of providers: a request-header row parked in\n     every card, collapsed or not, is noise on a surface the user did not ask\n     to configure. The card reveals its editor when the user presses its own\n     Edit action, and that is the moment this section belongs on screen \u2014 the\n     same gesture that opens the model list opens this.\n\n     The visibility is decided by the component (which watches the card and\n     sets data-edit on the wrapper), not by a selector: the official editor is\n     NOT a sibling of this element \u2014 its container sits in the card row's own\n     children, after the row head and this section's own wrapper \u2014 so no\n     relative selector can reach it. The wrapper's data-edit is the one fact\n     CSS can act on.\n\n     Degradation is safe by construction: with no observer (no card ancestor to\n     watch) data-edit stays \"0\", the section is never revealed, and the\n     official page stays clean rather than leaking a row into every card. */\n  display: none;\n}\n.bre-headers-host[data-edit=\"1\"] .bre-headers {\n  display: flex;\n}\n/* The collapsed heading is the section's identity while the card is being\n   edited: title, configured count, and the \u203A that opens the details. */\n.bre-headers-disclosure {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  width: 100%;\n  padding: 0;\n  border: none;\n  background: transparent;\n  color: inherit;\n  font: inherit;\n  text-align: left;\n  cursor: pointer;\n}\n.bre-headers-disclosure:hover .bre-effort-title {\n  color: var(--dsw-alias-label-secondary, #61666b);\n}\n.bre-headers-chevron {\n  margin-left: auto;\n  padding-right: 2px;\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  font-size: 14px;\n  line-height: 1;\n  transition: transform 150ms ease;\n}\n.bre-headers[data-open=\"1\"] .bre-headers-chevron { transform: rotate(90deg); }\n/* How many entries are configured \u2014 the one fact worth showing while closed. */\n.bre-headers-count {\n  min-width: 16px;\n  padding: 0 5px;\n  border-radius: 8px;\n  background: var(--dsw-alias-interactive-bg-hover, #2631480f);\n  color: var(--dsw-alias-label-secondary, #61666b);\n  font-size: 11px;\n  line-height: 16px;\n  text-align: center;\n}\n.bre-headers-head {\n  display: flex;\n  align-items: center;\n  min-height: 32px;\n  padding: 0 8px;\n  border-radius: var(--dsw-radius-sm, 8px);\n  background: var(--dsw-alias-interactive-bg-hover, #2631480f);\n}\n.bre-headers-head .bre-effort-title {\n  color: var(--dsw-alias-label-primary, #0f1115);\n  font-weight: 600;\n}\n.bre-headers-edit, .bre-headers-rows {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n.bre-headers-columns,\n.bre-headers-row {\n  display: grid;\n  grid-template-columns: minmax(120px, 0.9fr) minmax(180px, 1.5fr) 32px;\n  align-items: center;\n  gap: 8px;\n}\n.bre-headers-columns {\n  padding: 0 10px;\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  font-size: 11px;\n  line-height: 16px;\n}\n.bre-headers-row {\n  min-height: 40px;\n  padding: 4px 6px;\n  border: 1px solid var(--dsw-alias-border-l2, #0000001a);\n  border-radius: var(--dsw-radius-sm, 8px);\n  background: var(--dsw-alias-bg-layer-1, #fff);\n}\n.bre-headers-add {\n  align-self: flex-start;\n  min-height: 30px;\n  padding: 0 10px;\n  border: 1px solid var(--dsw-alias-border-l2, #0000001a);\n  border-radius: var(--dsw-radius-sm, 8px);\n  color: var(--dsw-alias-label-primary, #0f1115);\n}\n.bre-headers-add:hover:not(:disabled) {\n  background: var(--dsw-alias-interactive-bg-hover, #2631480f);\n}\n.bre-headers-remove {\n  width: 32px;\n  padding: 0;\n  justify-self: center;\n}\n.bre-headers-rows .bre-headers-name {\n  color: var(--dsw-alias-label-secondary, #61666b);\n  font-size: 12px;\n  word-break: break-all;\n}\n.bre-headers-masked {\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n  letter-spacing: 0;\n}\n\n/* The section's commit/dismiss pair, matching the official editor's own\n   actions: a filled commit and a bordered dismiss, 36px tall at 14px. */\n.bre-headers-edit .bre-primary-button {\n  height: 36px;\n  padding: 0 14px;\n  border: none;\n  border-radius: var(--dsw-radius-md, 12px);\n  background: var(--dsw-alias-button-primary-fill, #0f1115);\n  color: var(--dsw-alias-label-primary-foreground, #fff);\n  font-size: 14px;\n  font-weight: 400;\n  line-height: 1;\n  cursor: pointer;\n}\n.bre-headers-edit .bre-primary-button:hover:not(:disabled) {\n  background: var(--dsw-alias-button-primary-hover, #43454a);\n}\n.bre-headers-edit .bre-primary-button:disabled { opacity: 0.5; cursor: default; }\n.bre-headers-edit .bre-secondary-button {\n  height: 36px;\n  padding: 0 14px;\n  border: 1px solid var(--dsw-alias-border-l3, #0000001f);\n  border-radius: var(--dsw-radius-md, 12px);\n  background: transparent;\n  color: var(--dsw-alias-label-primary, #0f1115);\n  font-size: 14px;\n}\n.bre-headers-edit .bre-secondary-button:hover:not(:disabled) {\n  background: var(--dsw-alias-interactive-bg-hover, #2631480f);\n}\n\n/* The row actions and the section's Edit affordance: the official 28px\n   bordered small button, and the 21px blue text link the model rows use. */\n.bre-headers-row .bre-link-button {\n  height: 28px;\n  padding: 2px 8px;\n  border: none;\n  border-radius: var(--dsw-radius-sm, 8px);\n  background: transparent;\n  color: var(--dsw-alias-label-secondary, #61666b);\n  font-size: 12px;\n  line-height: 1;\n}\n.bre-headers-row .bre-link-button:hover:not(:disabled) {\n  background: var(--dsw-alias-interactive-bg-hover, #2631480f);\n}\n.bre-headers .bre-effort-head > .bre-link-button {\n  height: 28px;\n  padding: 0 10px;\n  border: 1px solid var(--dsw-alias-border-l2, #0000001a);\n  border-radius: var(--dsw-radius-sm, 8px);\n  color: var(--dsw-alias-label-primary, #0f1115);\n  font-size: 12px;\n  text-decoration: none;\n}\n.bre-headers .bre-effort-head > .bre-link-button:hover:not(:disabled) {\n  background: var(--dsw-alias-interactive-bg-hover, #2631480f);\n  text-decoration: none;\n}\n.bre-headers-edit .bre-link-button {\n  color: var(--dsw-alias-label-secondary, #61666b);\n  font-size: 12px;\n}\n\n/* The section's own fields, on the official input box. */\n.bre-headers-edit input.bre-text-input {\n  height: 32px;\n  padding: 0 10px;\n  border: 1px solid var(--dsw-alias-border-l3, #0000001f);\n  border-radius: var(--dsw-radius-md, 12px);\n  background: var(--dsw-alias-bg-layer-1, #fff);\n  color: var(--dsw-alias-label-primary, #0f1115);\n  font-size: 13px;\n  box-sizing: border-box;\n}\n.bre-headers-edit input.bre-text-input:focus {\n  border-color: var(--dsw-alias-label-tertiary, #81858c);\n  outline: none;\n}\n.bre-headers-edit input.bre-text-input:disabled { opacity: 0.6; cursor: default; }\n\n/* Status copy and the coexistence warnings, on the host's own state colours. */\n.bre-headers .bre-effort-note.bre-warn { color: var(--dsw-alias-state-warn-label, #dd8629); }\n.bre-headers .bre-effort-message.bre-success { color: var(--dsw-alias-state-success-primary, #22c55e); }\n.bre-headers .bre-effort-message.bre-error { color: var(--dsw-alias-state-error-primary, #ec1313); }\n\n@media (max-width: 520px) {\n  .bre-headers-columns { display: none; }\n  .bre-headers-row {\n    grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) 32px;\n    gap: 6px;\n    padding: 4px;\n  }\n  .bre-headers-edit input.bre-text-input {\n    padding: 0 8px;\n    font-size: 12px;\n  }\n}\n\n/* ---- Provider row reordering (Models page) ---- */\n\n/* The whole row header is the drag handle: an 18px grip is a poor thing to\n   have to hit, so a drag may start anywhere on the header that is not one of\n   the card's own controls (those keep their own cursor, declared below). */\nli[data-bre-row-head='1'] { cursor: grab; }\nli[data-bre-row-head='1']:active { cursor: grabbing; }\nli[data-bre-row-head='1'] button,\nli[data-bre-row-head='1'] a,\nli[data-bre-row-head='1'] input { cursor: pointer; }\n\n/* The grip is mounted as the first child of that header, so it reads as part\n   of the row rather than as a control bolted beside it. It is also the button\n   that reorders by keyboard. */\n.bre-drag-grip {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex: 0 0 auto;\n  width: 14px;\n  height: 20px;\n  margin-right: 2px;\n  border-radius: 4px;\n  color: var(--dsw-alias-label-tertiary, #81858c);\n  cursor: grab;\n  touch-action: none;\n}\n\n.bre-drag-grip:hover {\n  color: var(--dsw-alias-label-secondary, #61666b);\n  background: var(--dsw-alias-interactive-bg-hover, #2631480f);\n}\n\n.bre-drag-grip:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary);\n  outline-offset: 1px;\n}\n\n.bre-drag-grip:active { cursor: grabbing; }\n\n/* What the pointer carries: the browser's own drag image would be a screenshot\n   of a whole card, so we hand it this chip with the provider name instead. */\n.bre-drag-ghost {\n  position: fixed;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  max-width: 260px;\n  padding: 5px 10px 5px 7px;\n  border: 1px solid var(--dsw-alias-border-secondary, #e6e8eb);\n  border-radius: 8px;\n  background: var(--dsw-alias-bg-elevated, #ffffff);\n  box-shadow: 0 6px 18px #0000002e;\n  color: var(--dsw-alias-label-primary, #17181a);\n  font-size: 13px;\n  line-height: 18px;\n  pointer-events: none;\n  transform: translate(-50%, -50%);\n  z-index: 60;\n}\n\n.bre-drag-ghost-name {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.bre-drag-ghost svg { color: var(--dsw-alias-label-tertiary, #81858c); }\n\n/* The row the drag is carrying: still in place, visibly the one in hand. */\nli.bre-row-dragging { opacity: .5; }\n\n/* The row the pointer would drop it on \u2014 a secondary cue; the insertion line\n   below is the one that says which side. */\nli.bre-row-drop-target { border-color: var(--dsw-alias-brand-primary); }\n\n/* The insertion line. A fixed overlay on the body, never a child of the list\n   React owns, so writing it cannot trigger anything in the official section.\n   The layer stack matters more than it looks: the provider list lives inside the\n   settings dialog, whose overlay is fixed and opaque with z-index 1000, so a\n   line in the shell's own range would be drawn behind the dialog and never\n   seen. It clears the dialog, and stays under the header's controls. */\n.bre-drop-line {\n  position: fixed;\n  display: none;\n  height: 2px;\n  border-radius: 2px;\n  background: var(--dsw-alias-brand-primary, #4d6bfe);\n  box-shadow: 0 0 0 1px #ffffffb3, 0 1px 4px var(--dsw-alias-brand-primary, #4d6bfe);\n  pointer-events: none;\n  z-index: 1200;\n}\n\n/* The row slide (a FLIP pass driven from the script) is motion; drop it for a\n   reader who asked for less. */\n@media (prefers-reduced-motion: reduce) {\n  li[data-bre-row-provider] { transition: none !important; }\n}\n\n@media (max-width: 520px) {\n  .bre-drag-grip { width: 18px; height: 24px; }\n  .bre-drag-ghost { max-width: 180px; font-size: 12px; }\n}\n\n/* ---- Model rows inside one provider's editor (Models page) ---- */\n\n/* The official model row is a four-column grid (id, display name, two icon\n   buttons). Our grip is a fifth child, so the grid needs a leading track to\n   hold it \u2014 declared by our own class, because the official rule is a single\n   class selector and ours has to win on specificity, not on load order.\n   The name must NOT be \"bre-model-row\": that one is this plugin's own composer\n   row (see the \".bre-model-row\" block above), and lending it to the host's grid\n   would hand that grid our padding, gap, min-height, pointer cursor and hover\n   fill along with it. */\n.bre-model-grid[class*=\"modelRow\"] {\n  grid-template-columns: auto minmax(0, 1.4fr) minmax(0, 1fr) auto auto;\n}\n\n/* A model row is a grid of inputs, so only the grip drags: the row keeps its\n   text cursor and its own click behaviour. The grip takes the height of the\n   row's controls, so the pointer has a real target inside a 6px-gap grid. */\n.bre-model-grid > .bre-drag-grip {\n  width: 18px;\n  height: 24px;\n  margin-right: 0;\n}\n\n/* The engine paints the carried row and the row under the pointer with the same\n   classes it uses on a provider card; the official model entry carries the\n   border, so the drop cue has to land there rather than on the list item. */\ndiv.bre-row-dragging { opacity: .5; }\n[class*=\"modelEntry\"].bre-row-drop-target { border-color: var(--dsw-alias-brand-primary); }\n\n/* The row slide (a FLIP pass driven from the script) is motion; drop it for a\n   reader who asked for less. */\n@media (prefers-reduced-motion: reduce) {\n  [data-bre-row-model] { transition: none !important; }\n}\n\n/* ---- Provider enable switch (Models page) ---- */\n\n/* Leads the row's own action group (which is pushed right by margin-left:auto),\n   in front of the card's buttons, so the destructive one stays last. The knob is\n   a pseudo element: no extra node for the official section's tree to trip over. */\n.bre-provider-switch {\n  position: relative;\n  flex: 0 0 auto;\n  width: 30px;\n  height: 18px;\n  padding: 0;\n  border: none;\n  border-radius: 9px;\n  background: var(--dsw-alias-bg-tertiary, #d7dae0);\n  cursor: pointer;\n  transition: background 140ms ease;\n}\n\n.bre-provider-switch::after {\n  content: '';\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 14px;\n  height: 14px;\n  border-radius: 50%;\n  background: var(--dsw-alias-bg-elevated, #ffffff);\n  box-shadow: 0 1px 2px #00000026;\n  transition: transform 140ms ease;\n}\n\n.bre-provider-switch:not([aria-checked='true']):hover { background: var(--dsw-alias-bg-quaternary, #c9ccd2); }\n\n.bre-provider-switch[aria-checked='true'] { background: var(--dsw-alias-brand-primary, #4d6bfe); }\n\n.bre-provider-switch[aria-checked='true']:hover { background: var(--dsw-alias-brand-primary-hover, #3f5ce8); }\n\n.bre-provider-switch[aria-checked='true']::after { transform: translateX(12px); }\n\n.bre-provider-switch:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary, #4d6bfe);\n  outline-offset: 2px;\n}\n\n/* A provider that is switched off stays on the page \u2014 this is the only place it\n   can be switched back on \u2014 but it is visibly out of play. The switch itself is\n   left at full strength: it is the way back. */\nli.bre-row-disabled [class*=\"rowIdentity\"],\nli.bre-row-disabled [class*=\"rowName\"] { opacity: .5; }\n\n@media (prefers-reduced-motion: reduce) {\n  .bre-provider-switch,\n  .bre-provider-switch::after { transition: none; }\n}\n\n/* ---- The reserved delete seat (Models page) ---- */\n\n/* A provider the host will not let the user remove renders no delete button, so\n   that row's action group \u2014 pushed right by margin-left:auto \u2014 starts further\n   right than its neighbours' and the column of buttons lines up raggedly. This\n   seat holds the place: it borrows the metrics the official button takes inside\n   an action group (.rowActions button is 28px tall / 12px / 0 10px) and the\n   dimmed treatment the host gives its own disabled buttons (opacity .4 with a\n   default cursor). It is always disabled \u2014 it is the alignment, not an action. */\n.bre-provider-delete {\n  box-sizing: border-box;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  height: 28px;\n  padding: 0 10px;\n  border: none;\n  border-radius: var(--dsw-radius-sm, 6px);\n  background: 0 0;\n  color: var(--dsw-alias-state-error-primary, #e5484d);\n  font: inherit;\n  font-size: 12px;\n  line-height: 18px;\n  opacity: .4;\n  cursor: default;\n}\n\n/* -----------------------------------------------------------------------\n   The provider editor's three tabs.\n\n   The official editor lays a provider out as one long column \u2014 identity\n   fields, then the model list, then this plugin's request-header section\n   one slot up the card. The tab pass (injection/editor-tabs.ts) tags each\n   region and stamps the card with the active tab; EVERY visibility decision\n   lives here, so the official React tree never moves and a pass failure\n   degrades to the untouched one-column editor.\n   ----------------------------------------------------------------------- */\n\n/* The segmented control. The plugin's tab-bar component renders it inside the\n   request-header mount, which already holds the card's 12px gap slot \u2014 so the\n   bar reaches the panes in the card's own rhythm WITHOUT this plugin ever\n   inserting a node into the official child list. It stays hidden until the pass\n   marks the card: a card the pass could not take over (the DeepSeek account\n   editor) keeps that mount visible for its request-header section, and must not\n   grow a bar that switches nothing. */\n.bre-editor-tabs {\n  display: none;\n  gap: 2px;\n  padding: 2px;\n  border-radius: 10px;\n  background: var(--dsw-alias-fill-tertiary, rgba(120, 125, 140, .09));\n}\n\n/* Only a taken-over card shows the bar. */\n.bre-tabbed .bre-editor-tabs { display: flex; }\n\n/* ...and while the takeover is on, the mount holding that bar MUST be visible.\n   This is the one place the takeover does not delegate its reveal to the\n   official-edit state: the bar lives in here, and gating it on the _editor\n   class probe would make the tabs depend on a probe an official redesign can\n   break \u2014 with data-edit stuck at 0 the bar would be inside a display:none\n   parent and no rule of ours could reach it. The taken-over class is written by\n   the pass itself, in the same frame, so it is the trustworthy half of the\n   pair. The section's own visibility stays a pane decision (below). */\n.bre-tabbed .bre-headers-host { display: block; }\n\n.bre-editor-tab {\n  flex: 1 1 0;\n  min-width: 0;\n  height: 28px;\n  padding: 0 10px;\n  border: none;\n  border-radius: 8px;\n  background: transparent;\n  color: var(--dsw-alias-label-secondary, #61666b);\n  font: inherit;\n  font-size: 12px;\n  font-weight: 500;\n  line-height: 1;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  cursor: pointer;\n  transition: background 140ms ease, color 140ms ease, box-shadow 140ms ease;\n}\n\n.bre-editor-tab:hover { color: var(--dsw-alias-label-primary, #0f1115); }\n\n/* The selected segment lifts out of the track: the page's own surface colour\n   plus the card's own hairline, the same elevation the host uses for raised\n   controls. Hover on a selected tab stays put \u2014 it is already where you are. */\n.bre-editor-tab[aria-selected='true'],\n.bre-editor-tab[aria-selected='true']:hover {\n  background: var(--dsw-alias-bg-layer-1, #fff);\n  color: var(--dsw-alias-label-primary, #0f1115);\n  box-shadow: 0 1px 2px #0000001a, 0 0 0 1px var(--dsw-alias-border-l2, #0000001a);\n}\n\n.bre-editor-tab:focus-visible {\n  outline: 2px solid var(--dsw-alias-brand-primary, #4d6bfe);\n  outline-offset: 1px;\n}\n\n/* An advanced section with no headers mount (pre-first-render, feature off)\n   offers an empty pane \u2014 the button steps aside until the mount exists. */\n.bre-editor-tab[hidden] { display: none; }\n\n/* Pane visibility, keyed on the card's active tab. Only the HIDING has to win\n   a specificity fight (against the official sheet and the headers host's own\n   reveal rule); the active pane keeps whatever display the official layout\n   gave it, so showing must not declare a display at all. */\n.bre-tabbed:not([data-bre-tab='provider']) [data-bre-region='provider'],\n.bre-tabbed:not([data-bre-tab='models']) [data-bre-region='models'],\n.bre-tabbed:not([data-bre-tab='advanced']) [data-bre-region='advanced'] {\n  display: none !important;\n}\n\n/* The advanced tab: the official body \u2014 fields, model list, action row and the\n   editor's own header \u2014 steps aside for the request-header section, which is a\n   complete form with its own save/cancel and becomes the pane under the very\n   same bar. */\n.bre-tabbed[data-bre-tab='advanced'] [data-bre-editor-body] {\n  display: none !important;\n}\n\n/* The advanced pane shows the section for the same reason the mount is shown:\n   a pane that is already the active one has no business depending on the\n   official-edit probe. The rule above still wins for every other tab, and the\n   base bre-headers rule keeps a collapsed card's section hidden \u2014 a card only\n   carries the taken-over class while its editor is open. */\n.bre-tabbed[data-bre-tab='advanced'] .bre-headers { display: flex; }\n\n/* The pane is a card, and the section draws it. On the advanced tab the section\n   is not an appendage to the fields above it any more \u2014 it is the whole surface\n   \u2014 so it takes the inset fill the official module cards use (the add and setup\n   cards): the one fill in this system that stays visible on the content card's\n   own white in the light theme and reads as raised in the dark one, where every\n   theme layer token collapses onto the same value. The hairline goes with it: it\n   divided this section from those fields, and here the bar above ends the pane.\n   The 12px top margin sets the card off the tab bar above it \u2014 the same gap the\n   provider and models panes put between the bar and their own cards \u2014 and the\n   12px padding is the card's inner inset, not the separator. */\n.bre-tabbed[data-bre-tab='advanced'] .bre-headers {\n  margin-top: 12px;\n  padding: 12px;\n  border-top: none;\n  border-radius: var(--dsw-radius-lg, 16px);\n  background: var(--dsw-alias-bg-module-platform, #f5f6f7);\n}\n\n/* The live editor folds its identity fields and model list into one\n   \"Customized\" disclosure. Under the tabs the grouping is the panes' job: the\n   group stays expanded (the pass forces it open) and its summary row \u2014 now a\n   toggle with nothing left to toggle \u2014 steps aside. */\n.bre-tabbed [data-bre-editor-body] details > summary {\n  display: none !important;\n}\n\n/* A region that is NOT a pane. The editor's own header repeats the card row's\n   provider name and route tag, and that row is already on screen directly above\n   it, so the header is hidden on every tab. No pane rule above can select this\n   id, which is what keeps it hidden whichever tab is active. */\n.bre-tabbed [data-bre-region='none'] {\n  display: none !important;\n}\n\n/* The Models pane shows the custom model list and the catalogue, and two\n   hairlines used to divide it: the \"Customized\" group's separator from the key\n   field (which this pane hides) and the catalogue's own, drawn directly above\n   its \"Model catalogue\" heading. Neither has anything to divide here \u2014 the tab\n   bar already ends the pane above, and the divider between the two lists above\n   the catalogue is the group's boundary, not a rule. Both go, with every top\n   padding that held content off them (the group's 10px, its body's 12px, the\n   catalogue's 12px), so the pane runs from the tab bar into the catalogue with\n   only the official editor's own 14px gap between blocks. */\n.bre-tabbed[data-bre-tab='models'] [data-bre-editor-body] details[class*='customized'] {\n  border-top: none;\n  padding-top: 0;\n}\n\n.bre-tabbed[data-bre-tab='models'] [data-bre-editor-body] details[class*='customized'] > [class*='customizedBody'] {\n  padding-top: 0;\n}\n\n/* The catalogue is a section (its heading, title and meta are the divs inside\n   it), so this probe hits the ruled box and nothing else. */\n.bre-tabbed[data-bre-tab='models'] [data-bre-editor-body] section[class*='modelCatalog'] {\n  border-top: none;\n  padding-top: 0;\n}\n\n/* The API-key eye. The official key field is a plain flex column whose input is\n   its last in-flow child, so the button hangs on the field's own box and is\n   measured against the input's 32px row \u2014 the official markup offers no\n   wrapper, and introducing one would mean moving DOM the host owns. The input\n   keeps the room the button needs. */\n.bre-key-field { position: relative; }\n\n.bre-key-field > input { padding-right: 34px; }\n\n/* A field the plugin's key list manages hands its input over: the list below\n   says the same thing once per key and keeps the pick, the alias and the value\n   in one place, so an official box that writes the provider's single key would\n   be a second, conflicting way to do it. The input stays in the DOM \u2014 the\n   host's form still owns it and the reveal pass still finds it \u2014 so unmanaging\n   the field brings the official box back. The marker is what the reveal pass\n   stamps on that input; the direct-child form covers the pass that has not run\n   yet, and the eye is the button the same pass hangs on the field. */\n.bre-key-managed [data-bre-key-input],\n.bre-key-managed > input,\n.bre-key-managed .bre-key-eye { display: none; }\n\n/* A field that failed validation grows a message line under the input; the eye\n   rides above it so it stays on the input it belongs to (18px line + 6px gap). */\n.bre-key-field:has(> p) .bre-key-eye { bottom: 24px; }\n\n.bre-key-eye {\n  position: absolute;\n  right: 4px;\n  bottom: 0;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 32px;\n  padding: 0;\n  border: 0;\n  border-radius: 8px;\n  background: transparent;\n  color: var(--dsw-alias-label-secondary, #6b7280);\n  cursor: pointer;\n  -webkit-appearance: none;\n  appearance: none;\n  transition: background 140ms ease, color 140ms ease;\n}\n\n.bre-key-eye:hover {\n  color: var(--dsw-alias-label-primary, #0f1115);\n  background: var(--dsw-alias-interactive-bg-hover);\n}\n\n.bre-key-eye:focus-visible {\n  outline: none;\n  box-shadow: inset 0 0 0 2px var(--dsw-alias-border-l3);\n}\n\n/* Resolving a stored key is a same-origin round trip, so the button can be\n   busy: it stays in place and dims rather than changing size or disappearing. */\n.bre-key-eye[aria-busy='true'] {\n  opacity: 0.55;\n  cursor: progress;\n}\n\n.bre-key-eye[hidden] { display: none; }\n\n/* One glyph at a time. The state lives on the button's own attribute, so a\n   click swaps the icon without the host re-rendering anything. */\n.bre-key-eye svg[data-bre-icon] { display: none; }\n\n.bre-key-eye[aria-pressed='false'] svg[data-bre-icon='eye'],\n.bre-key-eye[aria-pressed='true'] svg[data-bre-icon='eye-off'] { display: block; }\n\n/* The key list. The plugin mounts it into its own host, a sibling placed right\n   after the official key field, so the list sits under the input without\n   changing the field's own box: the reveal eye is measured against that box\n   (bottom: 0), and a list inside the field would drag the eye down onto the\n   list's last row. The margin only covers the case where the card spaces its\n   fields with margins instead of a gap. */\n.bre-keys-host {\n  display: block;\n  min-width: 0;\n  margin-top: 4px;\n}\n\n.bre-keys { display: flex; flex-direction: column; gap: 8px; }\n\n/* While the key list is still reading, the panel renders NOTHING (the component\n   returns an empty .bre-keys). An empty ruled box \u2014 or a placeholder line that\n   then swaps to the list \u2014 would paint one frame of a panel that then visibly\n   changes: the \"the key section flashes when you press Edit\" report. :empty\n   takes the panel out of the layout until the first answer lands, so the list\n   is the first thing the key area ever paints, and nothing under it moves. */\n.bre-keys:empty { display: none; }\n\n/* One ruled container holding the keys and the add entry, the way a settings\n   list reads: a single hairline box, and hairlines between rows only. */\n.bre-keys-list {\n  display: flex;\n  flex-direction: column;\n  margin: 0;\n  padding: 0;\n  border: 0.5px solid var(--dsw-alias-border-l2, #d5d7dd);\n  border-radius: 8px;\n  list-style: none;\n  overflow: hidden;\n}\n\n.bre-keys-list > li + li { border-top: 0.5px solid var(--dsw-alias-border-l2, #d5d7dd); }\n\n.bre-keys-row {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  min-width: 0;\n  padding: 9px 10px;\n}\n\n/* The enable choice closes the row. The radio stays the real input \u2014 so the\n   keys of one provider are one group, choosing one clears the rest, and the\n   pick is keyboard-reachable \u2014 and the circle is its face; the word beside it\n   names the action instead of a state to hunt for. */\n.bre-keys-enable {\n  display: inline-flex;\n  flex: 0 0 auto;\n  align-items: center;\n  gap: 6px;\n  cursor: pointer;\n}\n\n.bre-keys-enable-text {\n  font-size: 11px;\n  line-height: 1.5;\n  color: var(--dsw-alias-label-secondary, #6b7280);\n}\n\n.bre-keys-enable:has(.bre-keys-enabled:checked) .bre-keys-enable-text {\n  color: var(--dsw-alias-label-primary, #0f1115);\n}\n\n.bre-keys-enabled {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  margin: -1px;\n  padding: 0;\n  border: 0;\n  overflow: hidden;\n  white-space: nowrap;\n  clip-path: inset(50%);\n}\n\n.bre-keys-mark {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  box-sizing: border-box;\n  border: 1px solid var(--dsw-alias-border-l3, #9aa0aa);\n  border-radius: 50%;\n  color: var(--dsw-alias-bg-layer-1, #ffffff);\n  transition: background 120ms ease, border-color 120ms ease;\n}\n\n.bre-keys-mark > svg { width: 12px; height: 12px; }\n\n.bre-keys-enabled:checked + .bre-keys-mark {\n  border-color: var(--dsw-alias-label-primary, #0f1115);\n  background: var(--dsw-alias-label-primary, #0f1115);\n}\n\n.bre-keys-enabled:focus-visible + .bre-keys-mark {\n  outline: none;\n  box-shadow: 0 0 0 2px var(--dsw-alias-brand-primary, #3b82f6);\n}\n\n/* With an alias the alias is the row's name and the masked key follows it as a\n   quiet code pill; without one the masked key is the name and takes the row's\n   measure, so a key is always readable as itself. */\n.bre-keys-alias {\n  flex: 0 1 auto;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  font-size: 12px;\n  font-weight: 500;\n  color: var(--dsw-alias-label-primary, #0f1115);\n}\n\n.bre-keys-mask {\n  flex: 0 1 auto;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  padding: 1px 6px;\n  border-radius: 4px;\n  background: var(--dsw-alias-interactive-bg-hover, rgba(127, 127, 127, 0.08));\n  color: var(--dsw-alias-label-secondary, #6b7280);\n  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  font-size: 11px;\n}\n\n.bre-keys-mask-plain {\n  flex: 1 1 auto;\n  padding: 0;\n  background: transparent;\n  color: var(--dsw-alias-label-primary, #0f1115);\n  font-family: inherit;\n  font-size: 12px;\n}\n\n/* The row's three actions, revealed on hover or keyboard focus rather than\n   removed, so the row keeps its width and nothing shifts under the pointer.\n   Revealing is opacity alone; a pointer that cannot hover simply always sees\n   them, because a hidden action there would be an unreachable one. */\n.bre-keys-actions {\n  display: inline-flex;\n  flex: 0 0 auto;\n  align-items: center;\n  gap: 10px;\n  margin-left: auto;\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity 120ms ease;\n}\n\n.bre-keys-row:hover .bre-keys-actions,\n.bre-keys-row:focus-within .bre-keys-actions {\n  opacity: 1;\n  pointer-events: auto;\n}\n\n@media (hover: none) {\n  .bre-keys-actions { opacity: 1; pointer-events: auto; }\n}\n\n.bre-keys-danger { color: var(--dsw-alias-state-error-primary, #c62828); }\n\n/* The one inline form. It opens under the row it edits, or \u2014 for a new key \u2014 as\n   the list's own last item, which is what keeps adding a key in place instead\n   of in a dialog that has to be found and dismissed. */\n.bre-keys-form-row { padding: 10px; }\n\n.bre-keys-form { display: flex; flex-direction: column; gap: 8px; }\n\n.bre-keys-form-fields {\n  display: grid;\n  grid-template-columns: repeat(2, minmax(0, 1fr));\n  gap: 8px;\n}\n\n/* One field means the whole row: the value form holds only the secret, and it\n   must not sit in half a row beside an empty half. */\n.bre-keys-form-fields > :only-child { grid-column: 1 / -1; }\n\n/* The shared input caps itself at 240px for the panels it was written for; here\n   the field is the measure. */\n.bre-keys-form-fields .bre-text-input { max-width: none; }\n\n.bre-keys-form-actions {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 8px;\n}\n\n/* The shared primary button is styled inside the headers editor, which is not\n   where this form lives, so the key list carries its own compact copy. */\n.bre-keys-form-actions .bre-primary-button {\n  height: 28px;\n  padding: 0 12px;\n  border: 0;\n  border-radius: var(--dsw-radius-md, 8px);\n  background: var(--dsw-alias-button-primary-fill, #0f1115);\n  color: var(--dsw-alias-label-primary-foreground, #ffffff);\n  font: inherit;\n  font-size: 12px;\n  cursor: pointer;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n.bre-keys-form-actions .bre-primary-button:hover {\n  background: var(--dsw-alias-button-primary-hover, #43454a);\n}\n\n.bre-keys-form-actions .bre-primary-button:disabled { opacity: 0.5; cursor: default; }\n\n.bre-keys-form-actions .bre-primary-button:focus-visible {\n  outline: none;\n  box-shadow: 0 0 0 2px var(--dsw-alias-brand-primary, #3b82f6);\n}\n\n/* The add entry is the list's own last row \u2014 full width, the same shape as the\n   keys it adds to \u2014 so the way in and the thing it makes read as one list. */\n.bre-keys-add-row { padding: 0; }\n\n.bre-keys-add {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  width: 100%;\n  padding: 9px 10px;\n  box-sizing: border-box;\n  border: 0;\n  background: transparent;\n  color: var(--dsw-alias-label-secondary, #6b7280);\n  font: inherit;\n  font-size: 12px;\n  text-align: left;\n  cursor: pointer;\n  -webkit-appearance: none;\n  appearance: none;\n  transition: background 120ms ease, color 120ms ease;\n}\n\n.bre-keys-add:hover {\n  background: var(--dsw-alias-interactive-bg-hover, rgba(127, 127, 127, 0.08));\n  color: var(--dsw-alias-label-primary, #0f1115);\n}\n\n.bre-keys-add:focus-visible {\n  outline: none;\n  box-shadow: inset 0 0 0 2px var(--dsw-alias-brand-primary, #3b82f6);\n}\n\n.bre-keys-add:disabled { opacity: 0.55; cursor: default; }\n\n.bre-keys-add-mark {\n  display: inline-flex;\n  flex: 0 0 auto;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n}\n\n.bre-keys .bre-effort-message { font-size: 11px; }\n\n@media (prefers-reduced-motion: reduce) {\n  .bre-editor-tab { transition: none; }\n  .bre-key-eye { transition: none; }\n  .bre-keys-mark, .bre-keys-actions, .bre-keys-add { transition: none; }\n}\n";