commit cb1cbcc80b8df8ec87e32395b61ca7433d0b4aec
Author: Scott Duensing <scott@duensing.com>
Date:   Wed Jul 1 20:07:28 2026 -0500

    Initial commit

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..33287e5
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,3 @@
+node_modules
+.test-state/
+*.log
diff --git a/ARCHITECTURE.md b/ARCHITECTURE.md
new file mode 100644
index 0000000..6b6e840
--- /dev/null
+++ b/ARCHITECTURE.md
@@ -0,0 +1,1425 @@
+# Theme Builder — Architecture
+
+> Saltcorn plugin `theme-builder` — a visual theme designer. Phase 1 ships a Bootstrap-5 CSS custom-property **skin overlay** (no Sass); Phase 2 flips on a selectable **layout** assembled from a Craft.js tree with an optional full dart-sass recompile. Themes live in a **real, backup-safe, per-tenant Saltcorn Table**; the active pointer lives in **plugin config**. Compiled CSS is a **derived cache**, never stored.
+
+This document is the authoritative, implementation-ready specification. It supersedes the per-subsystem designs it was assembled from and folds in every adversarial-review fix.
+
+---
+
+## Table of contents
+
+1. [Overview & goals](#1-overview--goals)
+2. [Design principles](#2-design-principles)
+3. [Saltcorn integration points](#3-saltcorn-integration-points)
+4. [Data model & storage](#4-data-model--storage)
+5. [Plugin module contract & lifecycle](#5-plugin-module-contract--lifecycle)
+6. [HTTP API surface](#6-http-api-surface)
+7. [Compile & render pipeline](#7-compile--render-pipeline)
+8. [Builder SPA](#8-builder-spa)
+9. [Export / import](#9-export--import)
+10. [Package / file layout](#10-package--file-layout)
+11. [Phase plan & milestones](#11-phase-plan--milestones)
+12. [Open questions](#12-open-questions)
+
+---
+
+## 1. Overview & goals
+
+### 1.1 What it is
+
+`theme-builder` is a Saltcorn plugin (sibling to `dev-deploy`, `idp`, `postiz` under `/home/scott/claude/saltcorn/`) that lets an admin design site themes visually and publish them to the live site. A Saltcorn theme is fundamentally **a plugin that exports `layout.wrap()` (the HTML skeleton) plus linked CSS**; `theme-builder` realizes both halves through config-driven facilities so that one stored theme drives the live appearance.
+
+It maintains a **library** of themes (built-in starters shipped in code + user themes in a real Table), a **token editor** with live preview, an **activate** operation that publishes exactly one theme to the live site, and **export/import** for cross-instance portability.
+
+### 1.2 The phased approach
+
+The plugin ships in two phases that share the same data model, store, compile entry point, and SPA shell. The phase is a single config flag, `phase2Enabled`.
+
+| Aspect | **Phase 1 — the "skin"** | **Phase 2 — the "bones"** |
+|---|---|---|
+| Mechanism | A config-driven CSS custom-property overlay injected via `headers(cfg)` as a `{ css: ".../theme.css?v=<hash>" }` link, loaded *after* Bootstrap so it wins by cascade. | The plugin registers a selectable `layout(cfg)` so it becomes choosable via `layout_by_role` / `user._attributes.layout`. `wrap()` is assembled from a Craft.js serialized tree. |
+| Composition | **Composes** with the active theme (e.g. `sbadmin2`); it is *not* itself a layout. | The plugin **owns** the stylesheet, so an optional **full dart-sass recompile** of Bootstrap from source becomes worthwhile (no double-Bootstrap problem). |
+| Compiler | Pure-JS `--bs-*` overlay emitter. No Sass dependency. | Optional `sass.compileString` against vendored Bootstrap source; falls back to the overlay on failure. |
+| Per-role | `headers` `only_if(req)` predicate. | Native `layout_by_role`. |
+| Blast radius | Low. Ships first. | Higher; gated behind `phase2Enabled`. |
+
+### 1.3 The hybrid `bootstrap.build` + Craft.js model
+
+Two complementary tooling models are adopted:
+
+- **`bootstrap.build`-style token editor** — we adopt its *model* (a panel of color/font/spacing pickers that drive Bootstrap variables), implemented as our own React because `bootstrap.build` is not an embeddable npm library. Tokens map 1:1 onto Bootstrap 5 `--bs-*` custom properties, so the common case needs **no Sass compiler**.
+- **Craft.js canvas** — `@craftjs/core` is already vendored in `saltcorn-builder`. Phase 2 grafts a structural canvas that reuses saltcorn-builder's `Editor`/`Frame`/resolver patterns and the `craftToSaltcorn`/`layoutToNodes` serialization round-trip, persisting a `layoutTree` on the theme row.
+
+### 1.4 The cardinal rule: load ≠ activate
+
+The single most load-bearing semantic in this design:
+
+> **`load` (open in editor) is strictly separated from `activate` (publish).** Every editor/library operation (list/load/create/duplicate/save/rename/delete/export/import) only reads or writes the library Table. **`activate` is the ONLY operation that mutates the live site** — it recompiles tokens → CSS into the active-CSS cache and flips the active pointer in plugin config. This is enforced *structurally*: editor handler modules never `require` the activate engine.
+
+---
+
+## 2. Design principles
+
+### 2.1 Single source of truth
+
+- A theme's **`tokens` object is authoritative.** Compiled CSS is a **derived cache**, recomputed on activate/save, never the source and never stored per-theme.
+- Craft.js layout nodes (Phase 2) reference `var(--bs-*)` / Bootstrap classes, **never literal hex**. Token values live only in `tokens`. The serialization bridge never inlines token values into the layout tree, so the token panel and the canvas panel both derive from the one `tokens` object.
+- The token→CSS **mapping** has one chokepoint each direction: the server `TOKEN_SCHEMA` table (compiler) and the SPA `TokenManifest` (editor) are kept structurally parallel so the live preview and production CSS can never drift (§7, §8).
+- The **active pointer** has one home: `plugin.configuration` (`activeThemeId`, optional `activeByRole`). It is read at request time from the live merged cfg; it is written only by `activate`.
+- **Identity has one form:** the stable `theme_id` (uuid). The `name` is display-only.
+
+### 2.2 Backup-safety via a real Table (the audit lesson)
+
+The earlier backup audit (`plugin_db_backup_compat`) found that raw-DDL `_dd_*`/`_idp_*` tables created with a bare `CREATE TABLE` are **invisible** to Saltcorn backup/restore/snapshots (because backup enumerates `_sc_tables`), and that a raw `_dd_row_uuid` column could ROLLBACK a user-table restore — a data-loss bug.
+
+This design **never issues raw DDL.** The theme library is created via the **Table model** (`Table.create` writes `_sc_tables`; `Field.create` writes `_sc_fields`), so:
+
+- The table and all its rows ride backup/restore/snapshots **automatically**.
+- It is **per-tenant for free** (schema-qualified by the Table model from async-local storage).
+- The active pointer in plugin config rides `plugin_pack`/`install_pack` automatically.
+
+Export/import is the **per-theme cross-instance complement** to backup (a portable file for one theme between unrelated instances), deliberately *not* a workaround for an invisibility gap.
+
+### 2.3 Admin-trust import model
+
+Per the final, locked import-security decision: **there is NO security sanitization of imported themes.** An admin can already inject arbitrary site-wide CSS/JS via `page_custom_css`, `page_custom_html`, or by installing plugins, so a theme import (admin-only) crosses no boundary the admin role does not already own.
+
+We keep **robustness-only** validation, justified by correctness/UX/operational hygiene, never by security:
+
+(a) format + version check with **upcasting** of old exports;
+(b) mint a **fresh id** on import + **de-dup name**, so an import can never overwrite an existing theme;
+(c) a **light valid-CSS / scope-a-bad-token** check so a malformed token cannot white-screen every page;
+(d) a **generous size cap** (operational hygiene).
+
+**Documented contingency:** if a non-admin role is ever permitted to import or manage themes, real sanitization (CSS/selector/`@import`/`url()`/expression filtering, layoutTree resolver allow-listing) **MUST** be reintroduced before that capability ships. This is recorded as an inline comment in `lib/portability.js` and in the plugin README security section.
+
+---
+
+## 3. Saltcorn integration points
+
+The single switch that makes the plugin config-driven is the **presence of `configuration_workflow`.** Because it is present, `State.registerPlugin`'s `withCfg` resolver treats **every facility** (`layout`, `headers`, `routes`, …) as a factory `(cfg) => value` and calls it with the merged config (state.ts:1019-1024). Therefore our `headers`, `routes`, and (Phase 2) `layout` **must** be functions; the stored config drives all three.
+
+### 3.1 The hooks we use (with file:line)
+
+| Hook | How we use it | Grounding |
+|---|---|---|
+| `configuration_workflow()` | Returns a `Workflow` mounting the phase toggle + a link/iframe to the builder SPA + the active-pointer step. Its presence is the config-driven switch. | plugins.js:843-854,920-957; workflow.ts:28-54,212-322 |
+| `routes(cfg)` | Returns the full route array (public `theme.css` + admin editor/API). Mounted at **app root** on the per-tenant router; `routesChangedCb` fires only when `routes.length>0`. Callbacks run positionally `(req,res,next)` via `error_catcher`. | state.ts:1136-1138; plugin_routes_handler.js:26-53; utils.js:298-306 |
+| `headers(cfg)` | Phase 1: returns `{ css: ".../theme.css?v=<hash>", only_if }` entries. Emitted **after** the theme's Bootstrap CSS so the overlay wins. The `Header` type key is `css`/`script`/`headerTag` — **there is no `style` key** in the type (though `headersInHead` emits `h.style` at runtime, we never rely on it). | state.ts:1123-1135; base_types.ts:69-76; sbadmin2/index.js:400-427; layout_utils.ts:646-720; wrapper.js:132-190 |
+| `layout(cfg)` | Phase 2 only: returns `{ wrap, authWrap?, renderBody?, pluginName }`. Registered into `state.layouts["theme-builder"]` only when truthy (`if (layout) this.layouts[name] = layout`). Phase 1 returns `undefined` so we are never a layout. | state.ts:1113-1117; base_types.ts:159-175 |
+| `onLoad(cfg)` | Idempotent per-tenant bootstrap (table ensure, builtins are code-only so nothing to seed into DB, **active-CSS cache rehydration**). Runs **outside** `withCfg` with the **raw** stored config; errors are swallowed+logged, so every step must be idempotent and self-guarded. | plugin.ts:499-505 |
+| static `public/` | Serves the compiled SPA bundle at `/plugins/public/theme-builder/<file>` with zero extra route. | plugins.js:1246-1276 |
+| `exposed_configs` | **Omitted** (see §5.3) — the factories read the full merged cfg directly, and declaring it triggers a misleading "users must relogin" flash on every config save. | state.ts:1007-1012; plugins.js:962-963 |
+
+### 3.2 How `configuration_workflow` makes facilities config-driven
+
+```
+Plugin.loadPlugin(plugin)
+  -> registerPlugin(plugin_name||name, module, cfg, location, modname)   // state.ts:993
+       withCfg(key, def) = plugin.configuration_workflow
+                              ? (plugin[key] ? plugin[key](cfg||{}) : def)
+                              : (plugin[key] || def)                       // state.ts:1019
+       this.layouts[name]       = withCfg("layout")   // only set if truthy   state.ts:1113
+       this.headers[name].push( ...withCfg("headers", []) )                  state.ts:1129
+       this.plugin_routes[name] = withCfg("routes", [])                      state.ts:1136
+  -> module.onLoad(plugin.configuration)              // RAW cfg, not merged  plugin.ts:499
+```
+
+`cfg` passed to factories is **merged**: `{ ...savedConfig, ...fixed_plugin_configuration[name] }` (state.ts:1002-1006). `onLoad` receives the **raw** `plugin.configuration`. We keep `activeThemeId`/`activeByRole`/`phase2Enabled`/`activeHash` as plugin-internal keys that an admin would not set in `fixed_plugin_configuration` (or they would be un-editable AND stripped from packs).
+
+### 3.3 Layout selection (Phase 2)
+
+`getLayout(user)` precedence is **role > per-user > last-installed** (state.ts:378-426), with the twist that when `layout_by_role` names a plugin **and** the user has a per-user layout for that **same** plugin, the per-user entry wins (state.ts:388-392). Critically, only the `layout_by_role` branch and the per-user `userLayouts` branch stamp `pluginName` onto the returned layout; the **last-installed fallback branch (state.ts:419-425) returns the layout object WITHOUT `pluginName`** — a fact §7.6 and §5.7 must never rely on (see the suppression fix there). `activeByRole` is intentionally shaped like core's `layout_by_role` (`{ [role_id:number]: value }`) so Phase 2 can project it mechanically. The canonical key everywhere (`state.layouts`, `plugin_cfgs`, `layout_by_role` values) is `plugin_name` = `"theme-builder"`, **not** the npm package name (plugin.ts:474).
+
+---
+
+## 4. Data model & storage
+
+This is owned by `lib/themeStore.js` (the only module that touches the Table or `plugin.configuration`), with pure helpers in `lib/themeSchema.js`, `lib/portability.js`, and `lib/builtins/`.
+
+### 4.1 The theme library — a real Saltcorn Table
+
+**Table name:** `_themebuilder_themes` (leading underscore + unique prefix marks it plugin-internal; there is no flag to hide a registered table from the admin Tables UI, so **naming + `min_role`** are the only levers — table.ts:770 gotcha). `min_role_read = 1`, `min_role_write = 1`, `versioned = false`, `has_sync_info = false`.
+
+**Identity column resolution (folded review fix):** `Table.create` *always* creates an integer `serial` pk literally named `id` (table.ts:750-797). The **stable theme identity must NOT live in a column named `id`** or it collides with that pk and the locked IDENTITY decision breaks (route `:id` would resolve to the integer pk). Therefore the stable uuid lives in a **separate** `theme_id` String column; the integer `id` is internal housekeeping only and is never a theme reference.
+
+| Column | Saltcorn type | SQL | required | unique | Purpose |
+|---|---|---|---|---|---|
+| `id` | (auto pk) | serial | yes | yes | Row housekeeping only. **NOT** a theme reference. |
+| `theme_id` | String | text | yes | **yes** (`is_unique`) | **Stable theme identity** (uuid v4). All pointers/role-map refs use this. |
+| `name` | String | text | yes | no (app-enforced) | Display name, freely renamable. Uniqueness is UX-only (no DB constraint, so import can de-dup freely). |
+| `engine` | String | text | yes | no | Token dialect: `"bootstrap5"`. Forward-compat. |
+| `tokens` | String | text | yes | no | `JSON.stringify(tokensObject)` — the SINGLE SOURCE OF TRUTH. |
+| `layout_tree` | String | text | no | no | `JSON.stringify(craftTree)` — Phase 2 only; null in Phase 1. |
+| `version` | Integer | int | yes | no | Optimistic-lock counter, starts at 1. Bumped only by `save`. |
+| `created_at` | Date | timestamptz | yes | no | Row creation. |
+| `updated_at` | Date | timestamptz | yes | no | Last save. |
+
+**Why String for JSON:** the base plugin registers only `String, Integer, Bool, Date, Float, Color` (base-plugin/index.ts:68); there is **no core JSON type**. `String` maps to unbounded SQL `text` (types.ts:782-785), so `tokens`/`layout_tree` are `String` and the store does `JSON.stringify`/`JSON.parse` itself. This also avoids the SQLite-only jsonb auto-parse asymmetry.
+
+**`name` uniqueness is NOT a DB constraint.** It is enforced in app code at create/rename/import via `dedupName` (so import can de-dup freely and never 409 on a clash). Identity (`theme_id`) carries the only real unique constraint.
+
+### 4.2 Built-in / starter themes (in code, merged at read time)
+
+Built-ins ship as frozen JS/JSON files under `lib/builtins/` (Bootswatch-derived token maps). They are **never inserted** into the Table — they live in code so upgrades ship new/updated starters with no DB migration and a user can never delete or rename them.
+
+```js
+// lib/builtins/flatly.js
+module.exports = Object.freeze({
+  id: "builtin:flatly",            // "builtin:" namespace prevents collision with row uuids
+  name: "Flatly",
+  engine: "bootstrap5",
+  tokens: { $tokensVersion: 1, colors: { primary: "#2c3e50", success: "#18bc9c" /* ... */ } },
+  layoutTree: null,                // Phase-2 builtins may ship a tree
+});
+```
+
+```js
+// lib/builtins/index.js
+const themes = [require("./flatly"), require("./darkly"), require("./cosmo") /* ... */];
+const byId = Object.freeze(Object.fromEntries(themes.map((t) => [t.id, t])));
+function listBuiltins() { return themes; }
+function getBuiltin(id) { return byId[id] || null; }
+module.exports = { listBuiltins, getBuiltin };
+```
+
+Merge semantics:
+
+- Row `theme_id`s are uuid v4; builtin ids are `builtin:<slug>` — collision is impossible by namespacing. `ensureTable` asserts no stored `theme_id` starts with `builtin:`.
+- Built-ins are **not deletable, not renamable, not save-able**: any mutating op whose id `startsWith("builtin:")` is rejected before touching the Table.
+- **"Load" of a builtin = duplicate-to-edit:** opening a builtin returns its definition read-only; the first save duplicates it to a fresh uuid row.
+- **Activating a builtin directly is allowed** (a builtin id is a valid active-pointer value); duplicating is only required to *edit*.
+- Built-ins appear in `list()` even on a fresh, empty install.
+
+### 4.3 Token schema, shape & defaults
+
+`tokens` mirrors the `bootstrap.build` model and maps 1:1 onto Bootstrap 5 `--bs-*` custom properties.
+
+```ts
+type Tokens = {
+  $tokensVersion: 1;                  // token-shape version (for future upcasting)
+  colors: { primary?, secondary?, success?, info?, warning?, danger?, light?, dark?,
+            bodyBg?, bodyColor? };    // all string CSS values
+  typography: { fontSansSerif?, fontMonospace?, rootFontSize?, bodyFontSize?,
+                bodyFontWeight?, bodyLineHeight?, headingsFontFamily? };
+  borders: { borderRadius?, borderWidth?, borderColor? };
+  components: { navbarBg?, cardBg?, linkColor?, linkHoverColor? };
+  custom?: { [cssVarName: string]: string };  // raw "--my-var": "value" escape hatch
+  sass?: string;                      // Phase-2 only: extra admin-authored Sass before recompile
+};
+```
+
+Every leaf is a **string** (CSS value text). All keys are optional except `$tokensVersion`. Missing keys fall back to `DEFAULT_TOKENS` via deep-merge-on-read, so a sparse theme never white-screens (an empty `{}` compiles to a Bootstrap no-op overlay).
+
+```js
+const DEFAULT_TOKENS = Object.freeze({
+  $tokensVersion: 1,
+  colors: { primary: "#0d6efd", secondary: "#6c757d", success: "#198754",
+            info: "#0dcaf0", warning: "#ffc107", danger: "#dc3545",
+            light: "#f8f9fa", dark: "#212529", bodyBg: "#ffffff", bodyColor: "#212529" },
+  typography: { rootFontSize: "16px", bodyFontSize: "1rem", bodyFontWeight: "400", bodyLineHeight: "1.5" },
+  borders: { borderRadius: "0.375rem", borderWidth: "1px" },
+  components: {}, custom: {},
+});
+```
+
+> **Token-shape upcasting (folded review fix).** The token axis is currently a **no-op placeholder at v1**: `normalizeTokens` validates and deep-merges over `DEFAULT_TOKENS`; it does not transform. The `$tokensVersion` gate exists so a real `TOKEN_UPCASTERS` chain can be added later mirroring the envelope upcaster. We do **not** claim a transform that is not built.
+
+```js
+// themeSchema.js
+function normalizeTokens(raw) {
+  // v1: validate + deep-merge over DEFAULT_TOKENS (no transform yet).
+  // Future: while ($tokensVersion < CURRENT) raw = TOKEN_UPCASTERS[v](raw)
+  const merged = deepMerge(DEFAULT_TOKENS, raw || {});
+  merged.$tokensVersion = 1;
+  return merged;
+}
+function emptyTokens() { return structuredClone(DEFAULT_TOKENS); }
+function tokensAreValid(tokens) { /* object; no non-string leaf; key-count cap -> {ok, errors[]} */ }
+```
+
+`normalizeTokens` is the single chokepoint every read passes through (`rowToTheme` and `portability.parseEnvelope` both call it), so the compiler always receives a fully-populated, current-shape object.
+
+### 4.4 The active pointer (plugin config)
+
+```js
+// in plugin.configuration:
+{
+  activeThemeId: "ab12-...uuid...",                 // global active theme id (never name)
+  activeByRole:  { "4": "cd34-...", "8": "ef56-..." }, // optional {role_id: themeId}
+  activeHash:    "ab12cd34",                          // COMPOSITE content hash over the default CSS
+                                                      //   AND every activeByRole entry's CSS (cache-buster)
+  phase2Enabled: false,
+}
+```
+
+The pointer lives in config (not the Table) so it rides `plugin_pack` (pack.ts:118-139) and `install_pack` (pack.ts:558-578). It is read at request time from the live merged cfg (`getState().plugin_cfgs["theme-builder"]`, no DB hit); it is written only by `activate`/`delete-auto-switch`, via the **persist → re-register → propagate** sequence (§5.5).
+
+> **`activeHash` is a first-class, COMPOSITE config key (folded review fix resolving an inter-subsystem contradiction).** The compiler subsystem relies on a stable cross-worker cache-buster in `headers(cfg)`. `activate` recomputes `activeHash` as a composite over **every** pointer-implied CSS (the default theme's hash AND each `activeByRole` entry's hash) and **writes it into `plugin.configuration`** alongside the pointer, *before* `upsert`, on **every** activation (default and role). Because it folds in the role-override hashes, re-activating a theme for a specific role changes `activeHash`, so every `?v=` link the headers facet emits (default and per-role) changes too. This resolves the earlier "activeHash referenced but never written" contradiction AND the "role-override `?v` never changes → stale immutable role CSS" seam (§7.6, §7.8).
+
+### 4.5 Backup interaction
+
+| Concern | Mechanism | Rides backup? |
+|---|---|---|
+| Whole library (all DB themes) | real Table `_themebuilder_themes` in `_sc_tables`/`_sc_fields` | **Yes** — catalog-registered (table.ts:786, field.ts:1390). Per-tenant for free. |
+| Active pointer + role map + `activeHash` + `phase2Enabled` | `plugin.configuration` | **Yes** — `plugin_pack` copies config minus fixed keys (pack.ts:118-139); `install_pack` round-trips it (pack.ts:558-578). |
+| Built-in starters | plugin **code** | N/A — travel with the plugin install, never in DB/backup. |
+| Compiled CSS | in-memory derived cache | **No** — never stored, regenerated on activate / lazily on miss. |
+| Single-theme cross-instance portability | export/import envelope | The additive complement (one theme as a file between unrelated instances). |
+
+**Restore-over-existing caveat (documented, not a bug):** `install_pack` *skips* a plugin whose name already exists (pack.ts:569), so restoring a pack onto an instance that already has `theme-builder` installed will **not** overwrite the live `activeThemeId`. To migrate the pointer between live instances, use export/import + an explicit activate.
+
+**onLoad-vs-pack double-definition is safe:** on restore, `install_pack` runs the plugin (→ `onLoad` → `ensureTable` creates the empty table) *before* its table-pack loop, and that loop finds the table existing and *updates* rather than re-creating; `Field.create` is gated on field existence (pack.ts:600-630). Both `ensureTable` and the pack loop are existence-checked, so there is no duplicate-create on restore.
+
+### 4.6 Multi-tenant behavior
+
+- The Table is created **once per tenant** in `ensureTable`, iterated via the canonical `eachTenant` helper (which establishes per-tenant async-local schema). All CRUD is tenant-implicit (schema-qualified by the Table model from async-local storage — table.ts:761).
+- Plugin config (`_sc_plugins` / `plugin_cfgs`) is per-State/per-tenant, so `activeThemeId`/`activeByRole` differ independently per tenant.
+- Built-ins are global code, identical across tenants, merged at read time — no per-tenant storage cost.
+
+---
+
+## 5. Plugin module contract & lifecycle
+
+### 5.1 The export object (`index.js`)
+
+```js
+// index.js
+const { API_VERSION, PLUGIN_NAME } = require("./lib/constants");
+const configuration_workflow        = require("./lib/configWorkflow");
+const { headers }                   = require("./lib/headers");        // (cfg)=>Header[]
+const { routes }                    = require("./lib/routes");         // (cfg)=>PluginRoute[]
+const { layout }                    = require("./lib/layout");         // (cfg)=>PluginLayout|undefined
+const { onLoad }                    = require("./lib/onLoad");
+
+module.exports = {
+  sc_plugin_api_version: API_VERSION,    // 1, gates compat (sbadmin2/index.js:575)
+  plugin_name: PLUGIN_NAME,              // "theme-builder" — canonical key everywhere (plugin.ts:474)
+
+  configuration_workflow,                // PRESENCE => every facility is a (cfg)=>value factory
+  // NOTE: exposed_configs intentionally OMITTED (see 5.3)
+
+  headers,                               // Phase-1 overlay links; per-request only_if gated (see 5.4)
+  routes,                                // public theme.css + admin editor/API
+  layout,                                // (cfg)=> undefined in Phase 1; {wrap,...} in Phase 2
+  onLoad,                                // raw cfg; idempotent; per-tenant; rehydrates active CSS
+};
+```
+
+**Why `layout` returns `undefined` in Phase 1 (load-bearing):** `registerPlugin` does `const layout = withCfg("layout"); if (layout) this.layouts[name] = layout` (state.ts:1113-1117). A falsy return means we are never inserted into `state.layouts`, never appear in `getLayout`'s last-installed fallback, and are never a `layout_by_role` choice — exactly the Phase-1 "skin overlay, not a layout" contract. Returning `{}` would wrongly register us; we return `undefined`.
+
+### 5.2 Constants (`lib/constants.js`)
+
+```js
+const PLUGIN_NAME     = "theme-builder";          // canonical plugin_name
+const API_VERSION     = 1;
+const THEME_TABLE     = "_themebuilder_themes";
+const URL_PREFIX      = "/theme-builder";          // top-level, NOT under core /admin (see 6.1)
+const API_BASE        = `${URL_PREFIX}/api`;
+const CSS_ROUTE       = `${URL_PREFIX}/theme.css`;
+const FORMAT_VERSION  = 1;                          // export envelope formatVersion
+const SCHEMA_ID       = "saltcorn-theme";
+const ENGINE          = "bootstrap5";
+const MAX_IMPORT_BYTES= 2 * 1024 * 1024;           // 2 MiB
+const MAX_TOKENS      = 2000;
+const ROLE_ADMIN      = 1;
+const ROLE_PUBLIC     = 100;
+// config keys:
+const CFG = { ACTIVE: "activeThemeId", BY_ROLE: "activeByRole",
+              HASH: "activeHash", PHASE2: "phase2Enabled", SCHEMA_VER: "schemaVersion" };
+module.exports = { PLUGIN_NAME, API_VERSION, THEME_TABLE, URL_PREFIX, API_BASE, CSS_ROUTE,
+                   FORMAT_VERSION, SCHEMA_ID, ENGINE, MAX_IMPORT_BYTES, MAX_TOKENS,
+                   ROLE_ADMIN, ROLE_PUBLIC, CFG };
+```
+
+### 5.3 `exposed_configs` is omitted (folded review fix)
+
+The factories read the full merged cfg directly; `plugins_cfg_context` (the only thing `exposed_configs` populates — state.ts:1007-1012) is never read. Worse, declaring `exposed_configs.length>0` makes the native configure route flash a misleading "users need to relogin" warning on every config save (plugins.js:962-963). We therefore **drop `exposed_configs` entirely.**
+
+### 5.4 Config readers — one resolution rule (`lib/cfgReaders.js`)
+
+All facilities and the CSS route resolve the active theme through these readers, so there is exactly one rule.
+
+```js
+function getActiveThemeId(cfg)      { return cfg?.activeThemeId || null; }
+function getActiveByRole(cfg)       { return cfg?.activeByRole || {}; }
+function activeThemeIdForRole(cfg, roleId) {            // role override then global
+  const byRole = getActiveByRole(cfg);
+  return byRole[roleId] != null ? byRole[roleId] : getActiveThemeId(cfg);
+}
+function isPhase2(cfg)              { return !!cfg?.phase2Enabled; }
+function activeHashHint(cfg, roleId){ return (cfg && cfg.activeHash) || "0"; }
+
+// Replicate getLayout's fallback precedence WITHOUT reading the pluginName field the
+// last-installed fallback omits (state.ts:419-425). A request renders via theme-builder when
+// layout_by_role[role] names us OR (no layout_by_role entry for that role AND theme-builder is
+// the last-installed/only registered layout). (folded review fix — see 5.7/7.6)
+function requestRendersViaThemeBuilder(req) {
+  const state = getState();
+  if (!state.layouts[PLUGIN_NAME]) return false;        // not registered as a layout (Phase 1)
+  const role = req.user?.role_id ?? ROLE_PUBLIC;
+  const byRole = state.getConfig("layout_by_role", {}) || {};
+  const mapped = byRole[role] ?? byRole[String(role)];
+  if (mapped != null) return mapped === PLUGIN_NAME;     // role branch is authoritative
+  // no layout_by_role entry for this role -> falls through to per-user / last-installed.
+  // theme-builder is selected by the fallback iff it is the last-installed layout key.
+  const keys = Object.keys(state.layouts);
+  return keys.length > 0 && keys[keys.length - 1] === PLUGIN_NAME;
+}
+```
+
+> **role-key coercion:** `activeByRole` (and `layout_by_role`) keys are JSON strings but `req.user.role_id` is numeric. Readers and writers coerce consistently (lookups use the numeric value as a property key, which JS stringifies; all comparisons normalize to `Number`/`String` at the boundary).
+
+### 5.5 Active-pointer write: persist → re-register → propagate → **refresh assets** (folded review fixes)
+
+The pointer is written by exactly one routine. The earlier subsystem designs were correct that the sequence must be `upsert → loadPlugin → processSend` (mirroring the core configure route, plugins.js:956-967), but **two review fixes are mandatory**:
+
+**Fix 1 — `assets_by_role` must be recomputed.** `get_headers` reads the precomputed `state.assets_by_role[role]` bucket FIRST and only falls back to raw `state.headers` when that bucket is empty (wrapper.js:133-145). `assets_by_role` is rebuilt **only** by `computeAssetsByRole()`, which is called **only** from `refresh_views()` (state.ts:718). Neither `registerPlugin` nor the `refresh_plugin_cfg` cluster handler triggers it. **Without an explicit refresh, an activated theme's new `?v=<hash>` header is never served** and the Phase-1 "activate is the only live-changer" contract silently fails. So the writer **must** call `getState().refresh_views()` locally after re-register, and the cluster receiver must do the same.
+
+**Fix 2 — `loadPlugin` is heavy; document and accept.** `Plugin.loadPlugin` constructs a `PluginInstaller` and runs `loader.install()` (a full reinstall) before `registerPlugin` (plugin.ts:460-505), and re-runs `onLoad`. This is correct (parity with the configure route) but **not cheap**; it runs synchronously inside the activate request and on every peer worker. We accept it for correctness and keep `onLoad` fast and idempotent (its hot path short-circuits — §5.6).
+
+```js
+// lib/activePointer.js
+const Plugin   = require("@saltcorn/data/models/plugin");
+const { getState } = require("@saltcorn/data/db/state");
+const db       = require("@saltcorn/data/db");
+const { PLUGIN_NAME } = require("./constants");
+
+// Resolve the install-name row defensively: _sc_plugins.name is the INSTALL name, which
+// is NOT guaranteed to equal plugin_name. Try the canonical name, then fall back to scanning
+// for the row whose module resolves to plugin_name. (folded review fix: read/write name-space split)
+async function findPluginRow() {
+  let p = await Plugin.findOne({ name: PLUGIN_NAME });
+  if (p) return p;
+  const all = await Plugin.find({});
+  return all.find((r) => {
+    const mod = getState().plugins[PLUGIN_NAME];
+    return mod && (getState().plugin_module_names[r.name] === PLUGIN_NAME || r.name === PLUGIN_NAME);
+  }) || null;
+}
+
+async function setActivePointer(patch /* {activeThemeId?|activeByRole?|activeHash?} */) {
+  const plugin = await findPluginRow();
+  if (!plugin) throw new Error("theme-builder plugin row not found");
+  plugin.configuration = { ...(plugin.configuration || {}), ...patch };
+  await plugin.upsert();                                   // _sc_plugins (plugin.ts:104-119)
+  await Plugin.loadPlugin(plugin);                          // re-register -> re-run headers(cfg)
+  await getState().refresh_views();                        // REBUILD assets_by_role (Fix 1)
+  getState().processSend({ refresh_plugin_cfg: PLUGIN_NAME, tenant: db.getTenantSchema() });
+  return plugin.configuration;
+}
+
+// READ: live merged cfg, no DB hit.
+function getActivePointer() {
+  const cfg = getState().plugin_cfgs[PLUGIN_NAME] || {};
+  return { activeThemeId: cfg.activeThemeId || null, activeByRole: cfg.activeByRole || {},
+           activeHash: cfg.activeHash || "0" };
+}
+module.exports = { setActivePointer, getActivePointer, findPluginRow };
+```
+
+**Cluster receiver requirement (cross-seam contract):** the worker that handles `refresh_plugin_cfg` for `theme-builder` must, after re-loading the plugin, also `computeAssetsByRole()` (via `refresh_views()`) and `bustAll()` its local CSS cache, then lazily recompile on first request. This is a required step the lifecycle owner wires into the refresh handler; `registerPlugin` alone is insufficient.
+
+### 5.6 `onLoad` — idempotent per-tenant bootstrap + **active-CSS rehydration** (folded review fixes)
+
+```js
+// lib/onLoad.js
+const db = require("@saltcorn/data/db");
+const { getState } = require("@saltcorn/data/db/state");
+const { eachTenant } = require("@saltcorn/admin-models/models/tenant");  // canonical (folded fix)
+const themeStore = require("./themeStore");
+const cssCache   = require("./cssCache");
+const { getActivePointer } = require("./activePointer");
+const { PLUGIN_NAME } = require("./constants");
+
+async function bootstrapTenant() {
+  // 1) HOT-PATH SHORT-CIRCUIT: if the table already exists for THIS tenant, skip all DDL
+  //    work cheaply (loadPlugin re-runs onLoad on every activate). (folded review fix)
+  await themeStore.ensureTableForCurrentTenant();   // Table.findOne first; Table.create only if null
+
+  // 2) Rehydrate the active-CSS cache from the persisted pointer so the live site is themed
+  //    immediately after a restart/new worker (folded review fix: rehydration was unowned).
+  try {
+    const { activeThemeId, activeByRole } = getActivePointer();
+    const keys = new Set();
+    if (activeThemeId) keys.add(null);                          // default key
+    for (const r of Object.keys(activeByRole)) keys.add(Number(r));
+    for (const roleKey of keys) {
+      const id = roleKey == null ? activeThemeId : activeByRole[roleKey];
+      if (id) await cssCache.warm(id, roleKey);                // recompile -> cache
+    }
+  } catch (e) { getState().log(3, `theme-builder rehydrate failed: ${e.message}`); }
+}
+
+// eachTenant self-selects single vs multi: it runs default_schema FIRST then iterates
+// DB-backed tenants only in MT mode. No hand-rolled is_it_multi_tenant branch. (folded fix)
+async function onLoad(/* rawCfg */) {
+  await eachTenant(bootstrapTenant);
+}
+module.exports = { onLoad, bootstrapTenant };
+```
+
+Folded review fixes embodied above:
+
+- **Canonical tenant iteration.** Use `eachTenant` from `@saltcorn/admin-models/models/tenant`, which runs `default_schema` first and then iterates the **DB-backed** tenant list. This fixes three bugs from the subsystem drafts: (a) `for...of` over the plain-object `getAllTenants()` (which throws `TypeError`), (b) the in-memory `db/state.getAllTenants` being best-effort (only loaded tenants), and (c) the admin `getAllTenants()` *excluding* the default schema (which would leave the root site with no table).
+- **Errors are swallowed** (plugin.ts:502-503), so every step is wrapped and idempotent; a throw won't fail load but would leave the table/cache unbuilt — hence the explicit try/catch on rehydration.
+- **Hot-path cheapness.** `ensureTableForCurrentTenant` does `Table.findOne(THEME_TABLE)` first and returns immediately if present, so re-running on every activate is cheap.
+
+### 5.7 Phase 1 → Phase 2 toggle
+
+| Aspect | Phase 1 | Phase 2 |
+|---|---|---|
+| config flag | `phase2Enabled: false` | `phase2Enabled: true` |
+| `layout(cfg)` returns | `undefined` → not in `state.layouts` | `{ wrap, … }` → registered (state.ts:1116) |
+| token CSS delivery | `headers` overlay link, after Bootstrap | owned by `wrap()`; overlay suppressed **per-request** (§7.6) |
+| per-role | `only_if` overlay headers | native `layout_by_role` |
+| Sass | not needed | optional full dart-sass recompile |
+
+The toggle is a pure config change. The config workflow persists `phase2Enabled`; the writer's `upsert → loadPlugin → refresh_views → processSend` re-runs the factories cluster-wide.
+
+> **Phase-2 suppression must be per-request, must NOT read `getLayout().pluginName`, and is gated on full coverage (folded review fix).** A blanket `headers(cfg) → []` when `isPhase2` un-themes any role whose layout does **not** resolve to `theme-builder` (e.g. a role still on sbadmin2 because `layout_by_role` maps only some roles). So Phase-2 suppression is gated by an `only_if(req)` that suppresses the overlay **only** for requests that actually render via theme-builder. Crucially, that decision **must not** be made by reading `getState().getLayout(req.user)?.pluginName === PLUGIN_NAME`: the grounded `getLayout` (state.ts:378-426) stamps `pluginName` only in the `layout_by_role` branch and the per-user `userLayouts` branch — the **last-installed fallback branch (state.ts:419-425) returns the layout WITHOUT `pluginName`**. In Phase 2 theme-builder is typically the only registered layout, so a role with no `layout_by_role` entry resolves to theme-builder via exactly that fallback; there `pluginName` is `undefined`, `undefined === "theme-builder"` is false, the overlay is NOT suppressed, and that role's pages get tokens applied TWICE (overlay header + `wrap()`) — the precise "uncovered role" case the check was meant to handle, double-themed instead. We therefore (a) detect theme-builder-served requests with `cfgReaders.requestRendersViaThemeBuilder(req)`, which **replicates `getLayout`'s fallback precedence** (role branch, else last-installed/only-layout) rather than reading the omitted field; AND (b) the config workflow **hard-blocks** saving `phase2Enabled: true` until `layout_by_role` covers **every** live role, so the last-installed fallback is never the selector for a live role. (Details and code in §7.6; coverage hard-block in §12.3 resolved to a hard block.)
+
+### 5.8 `package.json`
+
+Phase 1 needs no Sass/Bootstrap runtime deps.
+
+```jsonc
+{
+  "name": "theme-builder",
+  "version": "0.0.1",
+  "description": "Saltcorn plugin: visual theme builder (Phase 1 Bootstrap-5 skin overlay; Phase 2 Craft.js layout + optional dart-sass).",
+  "main": "index.js",
+  "scripts": {
+    "test": "node --test test/",
+    "build:ui": "webpack --config builder/webpack.config.js --mode production",
+    "watch:ui": "webpack --config builder/webpack.config.js --watch --mode development"
+  },
+  "engines": { "node": ">=20" },
+  "dependencies": {
+    "@saltcorn/data": "*",
+    "@saltcorn/markup": "*"
+    // Phase 2 adds: "sass": "^1.x", "bootstrap": "^5.x"   (vendored SCSS under scss/)
+  },
+  "devDependencies": {
+    // webpack, webpack-cli, babel-*, @craftjs/core (bundled into builderApp.js for Phase 2)
+  },
+  "author": "Scott Duensing",
+  "license": "MIT"
+}
+```
+
+---
+
+## 6. HTTP API surface
+
+### 6.1 Mounting model & namespace (folded review fix)
+
+Routes are returned from the `routes(cfg)` factory and stored in `state.plugin_routes["theme-builder"]`; `routesChangedCb` fires only when `routes.length>0` (state.ts:1138). We always return a non-empty array (the public CSS route is always present), so the tenant router always mounts. Routes mount at the **app root** (no `/plugins` prefix) on the per-tenant router after `mountRoutes` (app.js:483-502). Callbacks run positionally `(req,res,next)` via `error_catcher` (utils.js:298-306).
+
+**Top-level namespace `/theme-builder` (NOT `/admin/theme-builder`).** An earlier draft namespaced under the core-owned `/admin` prefix (mounted at app.js:478 *before* the plugin router), which works today only because core's admin sub-router has no matching route and falls through — fragile if core ever adds `/admin/theme-builder*` or an `/admin` catch-all. We use a **unique top-level prefix** per the grounded guidance.
+
+### 6.2 Route table
+
+`A` = admin-guarded; `P` = public. Plugin routes support only `get`/`post` (plugin_routes_handler.js:26-53) — there is **no PUT/DELETE verb**, so all mutations are POST sub-paths.
+
+| # | method | url | guard | body / query | success | errors |
+|---|---|---|---|---|---|---|
+| 1 | get | `/theme-builder/theme.css` | **P** | `?v=<hash>`, `?role=` | 200 `text/css` | never 5xx → fallback CSS |
+| 2 | get | `/theme-builder/editor` | A | `?id=<theme_id>` | 200 `text/html` SPA shell | 302/401 |
+| 3 | get | `/theme-builder/api/state` | A | — | 200 `StateEnvelope` | 401/403 |
+| 4 | get | `/theme-builder/api/themes/:id` | A | — | 200 `{theme}` | 404 |
+| 5 | post | `/theme-builder/api/themes` | A | `{name?, engine?, fromTemplate?}` | 200 `{theme}` | 422 bad engine |
+| 6 | post | `/theme-builder/api/themes/:id/duplicate` | A | `{name?}` | 200 `{theme}` | 404 |
+| 7 | post | `/theme-builder/api/themes/:id/save` | A | `{tokens, layoutTree?, baseVersion, force?}` | 200 `{theme}` | 400/403/404/409 |
+| 8 | post | `/theme-builder/api/themes/:id/rename` | A | `{name}` | 200 `{theme}` | 403/404/409 |
+| 9 | post | `/theme-builder/api/themes/:id/delete` | A | `{autoSwitch?}` | 200 `{ok, switchedActiveTo?}` | 403/404/409 |
+| 10 | post | `/theme-builder/api/themes/:id/activate` | A | `{role?}` | 200 `{ok, activeThemeId, activeByRole, cssHash}` | 404/500 |
+| 11 | get | `/theme-builder/api/themes/:id/export` | A | — | 200 JSON attachment | 404 |
+| 12 | post | `/theme-builder/api/import` | A | multipart `file` OR `{envelope}` | 200 `{theme}` | 400/413/422 |
+
+**CSRF:** GET routes are inherently exempt. `theme.css` is fully public. All POSTs are admin-only and the SPA carries the CSRF token (read from the shell bootstrap, sent as `CSRF-Token` header — mirrors core builder `Library.js:102-129`). We add **no** route to `noCsrf`/`disable_csrf_routes`.
+
+### 6.3 `routes(cfg)` factory
+
+```js
+// lib/routes.js
+const { URL_PREFIX, API_BASE, CSS_ROUTE } = require("./constants");
+const h = require("./apiHandlers");
+
+function routes(cfg) {
+  return [
+    { url: CSS_ROUTE,                          method: "get",  callback: (req,res)=>h.getThemeCss(req,res,cfg) }, // PUBLIC
+    { url: `${URL_PREFIX}/editor`,             method: "get",  callback: h.getEditor },
+    { url: `${API_BASE}/state`,                method: "get",  callback: h.getState_ },
+    { url: `${API_BASE}/themes/:id`,           method: "get",  callback: h.loadTheme },
+    { url: `${API_BASE}/themes`,               method: "post", callback: h.createTheme },
+    { url: `${API_BASE}/themes/:id/duplicate`, method: "post", callback: h.duplicateTheme },
+    { url: `${API_BASE}/themes/:id/save`,      method: "post", callback: h.saveTheme },
+    { url: `${API_BASE}/themes/:id/rename`,    method: "post", callback: h.renameTheme },
+    { url: `${API_BASE}/themes/:id/delete`,    method: "post", callback: h.deleteTheme },
+    { url: `${API_BASE}/themes/:id/activate`,  method: "post", callback: h.activateTheme },
+    { url: `${API_BASE}/themes/:id/export`,    method: "get",  callback: h.exportTheme },
+    { url: `${API_BASE}/import`,               method: "post", callback: h.importTheme },
+  ];
+}
+module.exports = { routes };
+```
+
+`:id` carries the `theme_id` (slug/uuid), not the integer pk. `error_catcher` escapes `req.params`/`req.query` values (utils.js:299-304) — fine for slug ids; bodies are read raw.
+
+### 6.4 Admin guard (`lib/httpUtils.js`) — JSON-aware (folded review fix)
+
+```js
+const db = require("@saltcorn/data/db");
+const { ROLE_ADMIN, API_BASE } = require("./constants");
+
+function isAdminReq(req) {                         // mirror core isAdmin (utils.js:85-100)
+  return !!(req.user && req.user.role_id === ROLE_ADMIN && req.user.tenant === db.getTenantSchema());
+}
+function wantsJson(req) {
+  return req.xhr
+    || (req.path || "").startsWith(API_BASE)       // API routes ALWAYS answer JSON (fixes multipart-import misclassify)
+    || (req.get("accept") || "").includes("application/json")
+    || (req.get("content-type") || "").includes("application/json");
+}
+function guardAdmin(req, res) {
+  if (isAdminReq(req)) return true;
+  if (wantsJson(req)) res.status(req.user ? 403 : 401).json({ error: { code: "forbidden", message: "Must be admin" } });
+  else res.redirect(req.user ? "/" : `/auth/login?dest=${encodeURIComponent(req.originalUrl)}`);
+  return false;
+}
+function jsonError(res, status, code, message, extra) { res.status(status).json({ error: { code, message, ...(extra||{}) } }); }
+module.exports = { isAdminReq, wantsJson, guardAdmin, jsonError };
+```
+
+Uniform error envelope: `{ error: { code, message, ...context } }`, where `code ∈ { forbidden, not_found, version_conflict, name_taken, active_theme, builtin_immutable, bad_format, too_large, uncompilable, bad_request, compile_failed, activation_failed, initializing }`.
+
+The `wantsJson` `API_BASE` check (folded fix) ensures a non-admin **multipart** import POST (which has neither JSON content-type nor `req.xhr`) still receives the JSON `{error:{…}}` envelope rather than an opaque redirect.
+
+### 6.5 The public route — `GET /theme.css` (folded cache-poisoning fix)
+
+```js
+async function getThemeCss(req, res, cfg) {
+  const role = req.query.role ? Number(req.query.role) : (req.user?.role_id ?? 100);
+  const themeId = activeThemeIdForRole(cfg, role);
+  res.set("Content-Type", "text/css; charset=utf-8");
+  if (!themeId) { res.set("Cache-Control","no-store"); res.send("/* theme-builder: no active theme */"); return; }
+
+  const roleKey = (cfg.activeByRole && cfg.activeByRole[role]) ? role : null;
+  let entry = cssCache.getCached(themeId, roleKey);
+  let isReal = !!entry;
+  if (!entry) {                                     // lazy compile-on-miss
+    const theme = await themeStore.getById(themeId);
+    if (theme) {
+      const compiled = compileTheme(theme.tokens, { engine: theme.engine });
+      entry = { ...compiled, themeId, role: roleKey, builtAt: Date.now() };
+      cssCache.setCached(entry);
+      isReal = true;
+    }
+  }
+  if (!entry) {                                     // theme missing mid-activate, transient
+    res.set("Cache-Control", "no-store");          // FOLDED FIX: never memoize fallback under live hash
+    res.send(builtins.fallbackCss());
+    return;
+  }
+  // ETag always reflects the per-entry CONTENT hash, so the If-None-Match/304 path can correct
+  // stale CSS even when a ?v cache-buster failed to change. We keep `immutable` ONLY when the
+  // emitted link's ?v is guaranteed to change on re-activation. With the COMPOSITE activeHash
+  // (4.4/7.8) that guarantee now holds for the per-role link too, so `immutable` is safe here;
+  // were that guarantee ever weakened, drop `immutable` (keep ETag + must-revalidate) so the
+  // 304/If-None-Match path can still correct stale role CSS. (folded review fix)
+  res.set("ETag", `"${entry.hash}"`);
+  res.set("Cache-Control", isReal ? "public, max-age=31536000, immutable" : "no-store");
+  if (req.headers["if-none-match"] === `"${entry.hash}"`) { res.status(304).end(); return; }
+  res.send(entry.css);
+}
+```
+
+**Folded fixes:**
+
+- **No 5xx on a public page.** A missing table, missing theme, or compile miss degrades to valid (often empty) CSS — the active theme renders unchanged, never a white-screen. (This also subsumes the "503 initializing" status: a not-yet-created table on a freshly-spawned tenant degrades to fallback CSS on the *public* path rather than throwing; the 503 status is reserved for admin mutation paths where a hard error is appropriate.)
+- **No cache poisoning.** The `immutable, max-age=1y` header is set **only** when serving real compiled CSS under its true content hash. Fallback / transient-miss responses use `Cache-Control: no-store`, so a later successful compile is picked up.
+- **Role CSS staleness is correctable.** The `ETag` is the per-entry content hash, so the 304/`If-None-Match` path corrects stale CSS independently of the `?v` query; and because `activeHash` is now composite (§4.4, §7.8), every role link's `?v` actually changes on re-activation, so the `immutable` long-cache is safe rather than pinning old role CSS forever.
+
+### 6.6 Selected handler semantics
+
+**save — optimistic CAS on `version` (row-level concurrency):**
+
+```js
+async function saveTheme(req, res) {
+  if (!guardAdmin(req, res)) return;
+  const id = req.params.id;
+  if (builtins.isBuiltinId(id)) return jsonError(res, 403, "builtin_immutable", "Built-in themes are read-only");
+  const { tokens, layoutTree = null, baseVersion, force } = req.body || {};
+  if (tokens == null) return jsonError(res, 400, "bad_request", "Missing tokens");
+  if (baseVersion == null && !force) return jsonError(res, 400, "bad_request", "Missing baseVersion");
+  const updated = force
+    ? await themeStore.forceUpdate(id, { tokens, layoutTree })
+    : await themeStore.casUpdate(id, baseVersion, { tokens, layoutTree }); // UPDATE ... WHERE theme_id=$ AND version=$base, version=version+1
+  if (!updated) {
+    const cur = await themeStore.getById(id);
+    if (!cur) return jsonError(res, 404, "not_found", "Unknown theme");
+    return jsonError(res, 409, "version_conflict", "Theme was modified by another session", { currentVersion: cur.version });
+  }
+  res.json({ theme: updated });                     // SAVE does NOT touch the live site
+}
+```
+
+Two concurrent saves: first wins (`version → base+1`); second matches 0 rows → 409 with `currentVersion` so the SPA offers reload-or-overwrite (`force:true`). The pointer (config) is written only by `activate` (single-writer per tenant), so pointer writes never race row writes.
+
+**delete — block if active unless `autoSwitch`; builtins never deletable:**
+
+```js
+async function deleteTheme(req, res) {
+  if (!guardAdmin(req, res)) return;
+  const id = req.params.id;
+  if (builtins.isBuiltinId(id)) return jsonError(res, 403, "builtin_immutable", "Cannot delete built-in");
+  const r = await themeStore.getById(id);
+  if (!r) return jsonError(res, 404, "not_found", "Unknown theme");
+  const { activeThemeId, activeByRole } = activePointer.getActivePointer();
+  const isActive = activeThemeId === id || Object.values(activeByRole).includes(id);
+  if (isActive) {
+    if (!req.body?.autoSwitch) return jsonError(res, 409, "active_theme", "Theme is active; pass autoSwitch to reassign first");
+    const successor = (await themeStore.firstOther(id))?.theme_id || builtins.defaultId();
+    await activateEngine.activateTheme(successor);            // recompile + flip to successor FIRST
+    await activePointer.dropRoleRefs(id);                     // scrub activeByRole entries == id
+  }
+  await themeStore.remove(id);
+  res.json({ ok: true, switchedActiveTo: isActive ? undefined : null });
+}
+```
+
+> **Delete-of-active policy is unified to auto-switch** (the API and SPA layers offer the explicit `autoSwitch` confirmation; the engine recompiles to the successor *before* the row is deleted, so the live site is never pointed at a deleted theme). The SPA blocks delete of a role-assigned theme with a clear message and offers `autoSwitch`.
+
+**activate — the only live-mutating op; staged compile vs pointer failures (folded review fix):**
+
+```js
+async function activateTheme(req, res) {
+  if (!guardAdmin(req, res)) return;
+  const id = req.params.id;
+  const exists = builtins.isBuiltinId(id) ? !!builtins.get(id) : !!(await themeStore.getById(id));
+  if (!exists) return jsonError(res, 404, "not_found", "Unknown theme");
+  try {
+    const out = await activateEngine.activateTheme(id, req.body?.role);
+    res.json({ ok: true, ...out });
+  } catch (e) {
+    if (e.stage === "compile") return jsonError(res, 500, "compile_failed", e.message);   // pointer untouched
+    return jsonError(res, 500, "activation_failed", e.message);                            // pointer write/propagate failed
+  }
+}
+```
+
+### 6.7 Concurrency model summary
+
+- **Library rows:** row-level, with optimistic CAS on `version` for `save`. `rename` touches `name` only and does **not** bump `version`.
+- **Active pointer:** single-writer per tenant via `activePointer.setActivePointer` (`upsert` + `loadPlugin` + `refresh_views` + `processSend`).
+- **CSS cache:** per-tenant in-memory map; busted on activate, lazily refilled on miss.
+
+---
+
+## 7. Compile & render pipeline
+
+Owns tokens → CSS, the `theme.css` route, the compile/cache/cache-bust lifecycle, the robustness (no-white-screen) guard, and the load-order proof. It consumes `tokens`/`layoutTree` and produces the bytes the browser loads.
+
+### 7.1 Module layout & shared helpers (folded export fix)
+
+```
+lib/
+  compile.js        # compileTheme(), emitOverlayCss(), robustnessGuard(), contentHash(), deriveRgb()
+  sanitize.js       # sanitizeValue(), sanitizeSelector()   <-- shared by compile.js AND sassCompile.js
+  sassCompile.js    # compileSass() (Phase 2, lazy require('sass'))
+  cssCache.js       # per-tenant cache + hashing + busting
+  activate.js       # activateTheme(): recompile + cache + persist pointer+composite-hash + re-register + refresh
+  tokenSchema.js    # TOKEN_SCHEMA mapping table
+scss/               # Phase 2: vendored Bootstrap SCSS + _themeVars template
+```
+
+> **Folded fix:** the value/selector guards (`sanitizeValue`, `sanitizeSelector`) live in their own `sanitize.js`, imported by **both** `compile.js` and `sassCompile.js`. They are not internal-only helpers of `compile.js` (an earlier draft `require('./compile').sanitizeValue`'d a non-exported symbol, silently degrading every Sass theme to the overlay fallback).
+
+### 7.2 The token mapping table (`tokenSchema.js`)
+
+The single server-side source of truth for **how a token maps to CSS**, kept structurally parallel to the SPA `TokenManifest` (§8.6).
+
+```js
+const TOKEN_SCHEMA = {
+  primary:        { kind: "bsvar", cssVar: "primary",   derive: ["primary-rgb"] },
+  secondary:      { kind: "bsvar", cssVar: "secondary", derive: ["secondary-rgb"] },
+  success:        { kind: "bsvar", cssVar: "success",   derive: ["success-rgb"] },
+  "body-bg":      { kind: "bsvar", cssVar: "body-bg",   derive: ["body-bg-rgb"] },
+  "body-color":   { kind: "bsvar", cssVar: "body-color",derive: ["body-color-rgb"] },
+  "font-sans-serif": { kind: "bsvar", cssVar: "font-sans-serif" },
+  "border-radius":{ kind: "bsvar", cssVar: "border-radius" },
+  "link-color":   { kind: "bsvar", cssVar: "link-color", derive: ["link-color-rgb"] },
+  "navbar-bg":    { kind: "rule", selector: ".navbar", prop: "--bs-navbar-bg" },
+  "sidebar-bg":   { kind: "rule", selector: ".sidebar, #accordionSidebar", prop: "background-color" },
+  // kind:"ignore" -> known-but-not-emitted (forward-compat)
+};
+const TOKEN_KEY_RE = /^[-a-zA-Z0-9_]{1,64}$/;
+const MAX_VALUE_LEN = 2048, MAX_CSS_BYTES = 512 * 1024;
+```
+
+`kind:"bsvar"` → `:root { --bs-<cssVar>: <value>; }` (+ auto-derived `--bs-<x>-rgb` companion for `rgba()` mixes). `kind:"rule"` → a targeted `selector{prop:value;}` for things `--bs-*` alone can't reach.
+
+> The compiler walks a *flattened* view of the `tokens` object (colors/typography/borders/components/custom merged into `key→value` pairs by a small adapter), so `normalizeTokens`'s nested shape and `TOKEN_SCHEMA`'s flat keys stay reconciled in one place.
+
+### 7.3 Phase 1 overlay compiler (`compile.js`)
+
+```js
+function compileTheme(tokens, opts = {}) {           // pure; NEVER throws
+  const engine = opts.engine === "sass" ? "sass" : "overlay";
+  const out = engine === "sass"
+    ? require("./sassCompile").compileSass(tokens, opts)   // Phase 2
+    : emitOverlayCss(tokens);
+  const guarded = robustnessGuard(out.css, out.warnings || []);
+  return { css: guarded.css, hash: contentHash(guarded.css), warnings: guarded.warnings, engine };
+}
+function contentHash(css) { return crypto.createHash("sha1").update(css).digest("hex").slice(0, 8); }
+```
+
+`emitOverlayCss` iterates the flattened tokens, drops keys failing `TOKEN_KEY_RE`, passes each value through `sanitize.sanitizeValue` (dropping it from output on failure), and emits `:root{ --bs-*: v; … }` plus per-token `selector{prop:v;}` rule blocks and validated `custom`/`_rules` entries. Unknown-but-valid tokens are emitted as harmless `--tb-<key>` passthrough custom properties.
+
+### 7.4 Robustness guard — "scope a bad token so it can't white-screen" (folded truncation fix)
+
+Three layered, non-security defenses:
+
+1. **Per-value scoping (`sanitize.sanitizeValue`)** — the primary mechanism. A value containing `{`, `}`, `;`, `</`, `/*`, `*/`, or exceeding `MAX_VALUE_LEN`, is **dropped from output** (not escaped). Because a CSS declaration value containing `}` could close `:root{}` early and leak following declarations globally, dropping it confines every token to its own declaration. A dropped token degrades to "that one variable falls back to Bootstrap's default," not "the whole block is lost."
+2. **Block-isolation emit shape** — each `--bs-x:v;` is its own declaration and each targeted rule is its own `{}` block, so the CSS parser's standard error recovery drops a single bad declaration/rule without discarding siblings.
+3. **Final structural validate (`robustnessGuard`)** — checks balanced braces and `MAX_CSS_BYTES`; on failure, degrade safely:
+
+```js
+function robustnessGuard(css, warnings) {
+  if (Buffer.byteLength(css, "utf8") > MAX_CSS_BYTES) {
+    warnings.push("css exceeds cap");
+    const rootLine = css.split("\n").find((l) => l.startsWith(":root{")) || "";
+    // FOLDED FIX: re-check the selected :root line; if STILL over cap, fall through to empty.
+    css = (rootLine && Buffer.byteLength(rootLine, "utf8") <= MAX_CSS_BYTES) ? rootLine : "/* theme-builder: empty (over cap) */";
+  }
+  let depth = 0, ok = true;
+  for (const ch of css) { if (ch === "{") depth++; else if (ch === "}") { if (--depth < 0) { ok = false; break; } } }
+  if (!ok || depth !== 0) { warnings.push("unbalanced braces; emitting empty"); css = "/* theme-builder: empty (invalid) */"; }
+  return { css, warnings };
+}
+```
+
+Empty-but-valid CSS = active theme renders unchanged = no white-screen. (Folded fix: the truncation path re-checks the selected `:root` line and falls through to the empty sentinel if it is itself over cap, so size is actually bounded; even better, `emitOverlayCss` caps `rootDecls` length during emit.)
+
+`compileTheme` doubles as the import robustness check (§9): the importer calls it, and a hard fallback flags the import.
+
+### 7.5 Phase 2 dart-sass recompile (`sassCompile.js`) (folded path/@use fix)
+
+```js
+const path = require("path");
+const { sanitizeValue } = require("./sanitize");        // shared guard (folded fix)
+
+function compileSass(tokens, opts = {}) {
+  const sass = require("sass");                          // lazy
+  const warnings = [];
+  const flat = flattenTokens(tokens);
+  const varBlock = Object.entries(flat)
+    .filter(([k]) => /^[-a-zA-Z0-9_]{1,64}$/.test(k))
+    .map(([k, v]) => { const sv = sanitizeValue(v, warnings); return sv == null ? "" : `$${k}: ${sv};`; })
+    .filter(Boolean).join("\n");
+  const scssDir = path.join(__dirname, "..", "scss");
+  // FOLDED FIX: use a relative module id resolved via loadPaths; no absolute @import string.
+  const entry = `@use "bootstrap/bootstrap" with (\n${varBlock}\n);\n`;
+  try {
+    const result = sass.compileString(entry, { loadPaths: [scssDir], style: "compressed",
+      logger: { warn: (m) => warnings.push(m), debug: () => {} } });
+    return { css: result.css, warnings };
+  } catch (e) {
+    warnings.push("sass compile failed: " + e.message);
+    return require("./compile").emitOverlayCss(tokens);  // fall back to overlay; never white-screen
+  }
+}
+```
+
+Notes:
+
+- The plugin **ships** Bootstrap SCSS under `theme-builder/scss/bootstrap/` (not vendored in saltcorn). Pin a Bootstrap 5 version matching the Phase-1 `--bs-*` names.
+- Uses `@use … with (…)` (modern dart-sass) and a **relative** module id resolved by `loadPaths` (folded fix — an absolute interpolated `@import` path breaks on Windows backslashes and is deprecated in modern dart-sass).
+- Runs synchronously, only on activate/save — amortized by the cache.
+
+### 7.6 `headers(cfg)` injection + per-role / Phase-2 suppression (folded fixes)
+
+```js
+const { requestRendersViaThemeBuilder } = require("./cfgReaders");
+
+function headers(cfg) {
+  const def = getActiveThemeId(cfg);
+  const byRole = getActiveByRole(cfg);
+  const list = [];
+  if (!def) return list;
+
+  // ONE header; only_if decides per-request whether this role gets the overlay.
+  list.push({
+    css: `${CSS_ROUTE}?v=${activeHashHint(cfg)}`,
+    only_if: (req) => {
+      const role = req.user?.role_id ?? 100;
+      // PHASE 2: suppress ONLY for requests that actually render via theme-builder.
+      // Detected by replicating getLayout's fallback precedence (cfgReaders), NOT by reading
+      // getLayout().pluginName -- the last-installed fallback omits pluginName, so an uncovered
+      // role would otherwise be double-themed (overlay + wrap()). (folded review fix)
+      if (isPhase2(cfg) && requestRendersViaThemeBuilder(req)) return false;
+      // role with an explicit override gets its own header below, not this one
+      return byRole[role] === undefined || byRole[role] === def;
+    },
+  });
+
+  // per-role overlays for explicit overrides (Phase 1)
+  for (const [roleStr, tid] of Object.entries(byRole)) {
+    if (tid === def) continue;
+    const role = Number(roleStr);
+    list.push({
+      css: `${CSS_ROUTE}?v=${activeHashHint(cfg)}&theme=${encodeURIComponent(tid)}&role=${role}`,
+      only_if: (req) => {
+        if (isPhase2(cfg) && requestRendersViaThemeBuilder(req)) return false;
+        return (req.user?.role_id ?? 100) === role;     // MUST strictly return true (wrapper.js:137)
+      },
+    });
+  }
+  return list;
+}
+```
+
+Folded fixes embodied:
+
+- **`only_if` must strictly return `true`** (wrapper.js:137) — every predicate returns an explicit boolean.
+- **Phase-2 suppression is per-request and does NOT read `getLayout().pluginName`.** The overlay is suppressed only for requests `requestRendersViaThemeBuilder(req)` deems theme-builder-served (those get tokens via `wrap()`), and is still emitted for roles left on a Bootstrap theme. `requestRendersViaThemeBuilder` (§5.4) replicates `getLayout`'s fallback precedence — role branch, else last-installed/only-layout — rather than reading the field the fallback branch omits (state.ts:419-425); this fixes the prior `undefined === "theme-builder"` miss that double-themed every uncovered role. The config workflow additionally **hard-blocks** saving `phase2Enabled` unless `layout_by_role` covers all live roles (§5.7, §12.3), so the last-installed fallback is never the live selector and suppression is deterministic.
+- **Cross-worker cache-buster** comes from the **composite** `cfg.activeHash` (written by `activate` before `upsert`, folding in the default AND every role override's CSS hash — §4.4/§7.8), so all workers emit a consistent `?v=` even on a cold worker, AND every per-role link's `?v` actually changes when that role is re-activated. The route lazily compiles to match.
+- `css` headers are not de-duped (only `script` URLs are — state.ts:1123-1135), so role-specific links coexist; distinct `?v`/`role` queries keep them distinct.
+
+### 7.7 Cache + cache-busting (`cssCache.js`)
+
+```js
+const cache = new Map(); // tenantSchema -> Map<`${themeId}:${role??"_"}`, CompiledEntry>
+function tkey() { return db.getTenantSchema(); }
+function ck(themeId, role) { return `${themeId}:${role ?? "_"}`; }
+function getCached(themeId, role) { return cache.get(tkey())?.get(ck(themeId, role)); }
+function setCached(e) { let t = cache.get(tkey()); if (!t) cache.set(tkey(), (t = new Map())); t.set(ck(e.themeId, e.role), e); }
+function bustTheme(themeId) { const t = cache.get(tkey()); if (t) for (const k of [...t.keys()]) if (k.startsWith(themeId + ":")) t.delete(k); }
+function bustAll() { cache.delete(tkey()); }
+async function warm(themeId, role) {                 // used by onLoad rehydration + activate
+  const theme = await themeStore.getById(themeId);
+  if (!theme) return null;
+  const compiled = compileTheme(theme.tokens, { engine: theme.engine });
+  const entry = { ...compiled, themeId, role: role ?? null, builtAt: Date.now() };
+  setCached(entry);
+  return entry;
+}
+```
+
+Per-tenant for free (outer key = `getTenantSchema()`). Derived; never persisted; rebuilt lazily on restart (plus eager rehydration in `onLoad`, §5.6). The cache key space is pinned: numeric `role` (or `null`/`"_"` for default). `activate` writes **all** keys implied by the current pointer (default + every `activeByRole` role), so the headers facet never reads a key activate didn't populate (folded fix).
+
+### 7.8 `activateTheme` (`activate.js`) — staged, persists COMPOSITE hash, refreshes assets (folded fixes)
+
+```js
+const crypto = require("crypto");
+
+function compositeHash(entries /* CompiledEntry[] */) {
+  // Fold the default + every role-override entry's content hash into ONE cache-buster so that
+  // re-activating ANY single role changes activeHash (and thus every emitted ?v). (folded fix)
+  const h = crypto.createHash("sha1");
+  for (const e of entries.filter(Boolean)) { h.update(`${e.role ?? "_"}:${e.hash};`); }
+  return h.digest("hex").slice(0, 8);
+}
+
+async function activateTheme(id, role) {
+  const theme = builtins.isBuiltinId(id) ? builtins.get(id) : await themeStore.getById(id);
+  if (!theme) { const e = new Error("theme not found"); e.stage = "compile"; throw e; }
+
+  // STAGE 1: compile (distinct failure stage -> compile_failed). Pointer untouched on throw.
+  let compiled;
+  try { compiled = compileTheme(theme.tokens, { engine: theme.engine }); }
+  catch (e) { e.stage = "compile"; throw e; }
+
+  // STAGE 2: prime cache for ALL pointer-implied keys (default + every activeByRole role).
+  const { activeThemeId, activeByRole } = activePointer.getActivePointer();
+  const nextByRole = role == null ? activeByRole : { ...activeByRole, [role]: id };
+  const nextDefault = role == null ? id : activeThemeId;
+  cssCache.bustAll();
+  const entries = [];
+  if (nextDefault) entries.push(await cssCache.warm(nextDefault, null));
+  for (const r of Object.keys(nextByRole)) entries.push(await cssCache.warm(nextByRole[r], Number(r)));
+
+  // STAGE 3: persist pointer + COMPOSITE hash, re-register, refresh assets, propagate
+  //          (distinct failure -> activation_failed).
+  // activeHash folds in the default AND every role-override entry's content hash, so re-activating
+  // a single role CHANGES activeHash -> the per-role ?v link changes -> immutable role CSS is busted.
+  // (folded review fix: role-override cache-buster never changed -> stale immutable CSS)
+  const nextHash = compositeHash(entries);
+  try {
+    const patch = role == null
+      ? { activeThemeId: id, activeByRole: nextByRole, activeHash: nextHash }
+      : { activeByRole: nextByRole, activeHash: nextHash };  // ALWAYS update activeHash, incl. role path
+    await activePointer.setActivePointer(patch);      // upsert + loadPlugin + refresh_views + processSend
+  } catch (e) {
+    cssCache.bustTheme(id);                           // drop orphan cache entry (folded fix)
+    e.stage = "activation"; throw e;
+  }
+  return { activeThemeId: nextDefault, activeByRole: nextByRole, cssHash: nextHash };
+}
+```
+
+Folded fixes: staged compile-vs-pointer failures (`compile_failed` vs `activation_failed`) with orphan-cache cleanup on pointer-write failure; `setActivePointer` performs the mandatory `refresh_views()` so the new `?v=hash` header actually reaches pages; and `activeHash` is now a **composite** persisted into config on **every** activation (default AND role), folding in the default plus every `activeByRole` entry's content hash. This closes the prior seam where the role-override path wrote `{ activeByRole }` only — leaving `activeHash` unchanged — so a re-activated role's per-role `?v` link was byte-identical and, under the `immutable, max-age=1y` header (§6.5), browsers served stale role CSS forever. Now any role re-activation changes `activeHash`, hence changes every emitted `?v`, busting the immutable cache.
+
+> `save` of the **currently-active** theme routes through `activateTheme(sameId)` to recompile-in-place (locked: recompile on activate/save). Non-active saves never touch the live cache or pointer.
+
+### 7.9 Load-order proof (Phase 1)
+
+1. `sbadmin2.wrapIt` emits, in order in `<head>`: fontawesome, nunito, **`sb-admin-2.min.css`** (its Bootstrap-derived stylesheet), optional `bootstrap.rtl`, and **only then** `headersInHead(headers)` (sbadmin2/index.js:408-414).
+2. `headersInHead` emits **all `css` links first** (layout_utils.ts:660-666), so our overlay `css` is in that first group.
+3. `get_headers` places `state_headers` (where our plugin headers land) **after** `stdHeaders` (which includes core `saltcorn.css`) (wrapper.js:183-190).
+
+Result: `sb-admin-2.min.css → … → [overlay theme.css]`. The later `:root{--bs-*}` wins by cascade order, overriding the theme on equal specificity. The overlay **composes** with the active theme (it is a `css` header, not a layout) — the Phase-1 "skin not bones" requirement.
+
+For Phase 2 the plugin *is* the layout; its `wrap()` controls head order, emits the single (Sass-compiled) Bootstrap link and then `headersInHead(headers)` — no second Bootstrap, no overlay needed.
+
+### 7.10 Phase 2 `layout(cfg).wrap()`
+
+```js
+function layout(cfg) {
+  if (!isPhase2(cfg)) return undefined;             // falsy => not registered as a layout (Phase 1)
+  return {
+    pluginName: PLUGIN_NAME,
+    wrap: ({ title, body, brand, menu, alerts, headers, bodyClass, role, req }) => {
+      const themeLink = `<link rel="stylesheet" href="${CSS_ROUTE}?v=${activeHashHint(cfg, role)}">`;
+      const skeleton = renderTreeToHtml(activeLayoutTree(cfg, role), { title, body, brand, menu, alerts });
+      return `<!doctype html><html><head>${themeLink}${headersInHead(headers)}<title>${title}</title></head>`
+           + `<body class="${bodyClass||""}">${skeleton}${headersInBody(headers)}</body></html>`;
+    },
+    authWrap: /* analogous */,
+    renderBody: /* passthrough */,
+  };
+}
+```
+
+Registered into `state.layouts["theme-builder"]`; selectable via `layout_by_role[role]="theme-builder"` or `user._attributes.layout`. `renderTreeToHtml` is the Phase-2 builder facet's tree→HTML emitter; the tree references `var(--bs-*)`/Bootstrap classes only. Because `wrap()` emits the token `<link>` itself (with the composite-hash `?v`), Phase-2 token delivery never needs the Phase-1 overlay header — which is exactly why the §7.6 `only_if` suppresses it for theme-builder-served requests.
+
+### 7.11 Data-flow diagram
+
+```
+                            ┌──────────────────────────── theme-builder plugin ───────────────────────────┐
+  EDIT (no compile)         │                                                                              │
+  ┌─────────────┐  PUT/POST │   ┌────────────┐  Table model   ┌───────────────────────────┐               │
+  │ Builder SPA │──────────────▶│ themeStore │───────────────▶│ _themebuilder_themes Table│ (in _sc_tables│
+  │ token panel │  /save     │   │ (CRUD)     │  JSON.stringify│ theme_id,name,tokens,...  │  => backup-safe│
+  │ +preview    │◀────────── │   └────────────┘   getById      └───────────────────────────┘               │
+  └─────┬───────┘  GET load  │          ▲                                                                   │
+        │ applyTokens(--bs-*)│          │ getById(activeId).tokens                                          │
+        │ (live, in iframe)  │   ┌──────┴─────┐  compileTheme(tokens)  ┌──────────────┐                     │
+        │                    │   │  activate  │───────────────────────▶│  compile.js  │ tokens->CSS+hash    │
+  ACTIVATE (only live op)    │   │  engine    │                        │ (robustness  │ (DERIVED cache only)│
+  ┌─────────────┐  POST      │   │            │  setCached(all keys)   │  guard)      │                     │
+  │ Activate btn│───────────────▶│ 1 compile │───────────────────────▶│              │                     │
+  └─────────────┘  /activate │   │ 2 cache   │   ┌──────────┐          └──────────────┘                     │
+                             │   │ 3 persist │──▶│ cssCache │ Map<tenant, Map<themeId:role, {css,hash}>>     │
+                             │   │   pointer │   └────┬─────┘                                                │
+                             │   │   +compos │        │ getCached / warm-on-miss                             │
+                             │   │    -ite   │        │                                                      │
+                             │   │    hash   │        │                                                      │
+                             │   │ 4 reload  │        │                                                      │
+                             │   │ 5 refresh │        │                                                      │
+                             │   │   _views  │  ┌─────▼──────┐  {css:".../theme.css?v=hash", only_if(req)}   │
+                             │   │ 6 procSend │  │ headers(cfg)│──────────────────┐                          │
+                             │   └────────────┘  └────────────┘                   │                          │
+                             └─────────────────────────────────────────────────── │ ─────────────────────────┘
+                                                                                  ▼
+  BROWSER page render:  sbadmin2 wrap emits Bootstrap CSS  ─────▶  then headersInHead(headers) emits overlay link
+                        GET /theme-builder/theme.css?v=hash  ─────▶  cssCache hit -> 200 text/css (304 if If-None-Match)
+                        :root{--bs-*} applies AFTER Bootstrap  ─────▶  theme visible, no compile at request time
+```
+
+---
+
+## 8. Builder SPA
+
+The in-browser React editor, mounted on an admin-only route and built as one static bundle served from the plugin's `public/` dir.
+
+### 8.1 Serving the bundle
+
+The SPA compiles to `public/builderApp.js` + `public/builderApp.css`, served by Saltcorn's built-in static route at `/plugins/public/theme-builder/builderApp.js` with **zero extra route** (plugins.js:1246-1276). The webpack `output.library` global is `themeBuilder`. The compiled artifacts are committed (so an installed plugin works without a build step) and rebuilt via `build:ui`. We do **not** reuse core's `/static_assets/<tag>/builder_bundle.js` (core-owned, version_tag-gated — builder.ts:67-69).
+
+For Phase 2 we **bundle our own `@craftjs/core`** into `builderApp.js` (and **vendor/copy** the saltcorn-builder element/storage source files), because `@saltcorn/builder` exposes no importable `craftToSaltcorn`/`layoutToNodes` (its functions are ESM source bundled only into `builder_bundle.js`). This keeps the SPA self-contained and decoupled from a specific core builder version.
+
+### 8.2 The shell page (`lib/page.js`)
+
+```js
+async function getEditor(req, res) {
+  if (!guardAdmin(req, res)) return;                // GET -> redirect to login on failure
+  const boot = await apiState.buildState(req);      // same payload as GET /api/state
+  const csrf = req.csrfToken ? req.csrfToken() : "";
+  const html = `
+    <div id="theme-builder-root" data-base="${URL_PREFIX}"></div>
+    <link rel="stylesheet" href="/plugins/public/theme-builder/builderApp.css">
+    <script>
+      window.__THEME_BUILDER__ = { boot:${JSON.stringify(boot)}, csrf:${JSON.stringify(csrf)},
+                                   apiBase:${JSON.stringify(API_BASE)}, base:${JSON.stringify(URL_PREFIX)},
+                                   openThemeId:${JSON.stringify(req.query.id || null)} };
+    </script>
+    <script src="/plugins/public/theme-builder/builderApp.js"></script>
+    <script>window.themeBuilder.mount("theme-builder-root", window.__THEME_BUILDER__);</script>`;
+  res.sendWrap({ title: "Theme Builder", no_menu: false }, html);
+}
+```
+
+The SPA reads CSRF from the bootstrap blob and sends it as `CSRF-Token` on every POST. The shell embeds the initial `/state` payload to avoid a flash GET.
+
+### 8.3 Top-level state machine (`app.jsx`)
+
+```ts
+AppState = {
+  view: "manager" | "editor",
+  panel: "tokens" | "canvas",          // canvas only when caps.phase === 2
+  themes: ThemeListItem[],
+  activeThemeId: string|null,
+  manifest: TokenManifest, caps: {...},
+  open: { id, name, builtin, baseTokens, draftTokens, layoutTree, version, dirty } | null
+}
+```
+
+Transitions:
+
+- `openTheme(id)` → GET `/api/themes/:id`; if `builtin`, set `open.builtin=true` (read-only); switch `view:"editor"`.
+- `editToken(path,value)` → mutate `draftTokens`, set `dirty`, push to preview iframe (**no network**).
+- `save()` → if `open.builtin`, first POST `/dup` and swap `open.id`; then POST `/save` with `{tokens, layoutTree, baseVersion:open.version}`; on 409 offer reload-or-overwrite; on success `baseTokens=draftTokens, version++ , dirty=false`.
+- `activate()` → POST `/activate`; on success update `activeThemeId` + re-fetch `/state`. **The only transition that publishes.**
+- `rename/delete/create/duplicate/import/export` → library mutations + re-fetch `/state`.
+
+`save()` and `activate()` are distinct buttons; editing/saving never implies publishing. A "Save & Apply" affordance = save then activate.
+
+### 8.4 REST adapter (`api.js`)
+
+```js
+function makeApi(base, csrf) {
+  const j = async (method, path, body) => {
+    const r = await fetch(base + path, {
+      method, headers: { "Content-Type":"application/json", "X-Requested-With":"XMLHttpRequest",
+                         "Accept":"application/json", "CSRF-Token": csrf },
+      body: body ? JSON.stringify(body) : undefined,
+    });
+    if (!r.ok) throw new Error((await r.json().catch(()=>({}))).error?.message || r.statusText);
+    return (r.headers.get("content-type")||"").includes("json") ? r.json() : r.text();
+  };
+  return {
+    state:     () => j("GET",  "/api/state"),
+    load:      (id) => j("GET", `/api/themes/${id}`),
+    create:    (b) => j("POST", "/api/themes", b),
+    duplicate: (id,b)=> j("POST", `/api/themes/${id}/duplicate`, b),
+    save:      (id,b)=> j("POST", `/api/themes/${id}/save`, b),
+    rename:    (id,n)=> j("POST", `/api/themes/${id}/rename`, { name:n }),
+    remove:    (id,autoSwitch)=> j("POST", `/api/themes/${id}/delete`, { autoSwitch }),
+    activate:  (id,role)=> j("POST", `/api/themes/${id}/activate`, { role }),
+    exportUrl: (id)=> `${base}/api/themes/${id}/export`,    // plain <a download>
+  };
+}
+```
+
+The `X-Requested-With`/`Accept` headers ensure `wantsJson` is true even for multipart import (folded fix). CSRF comes from the shell blob (core-builder pattern, Library.js:102-129).
+
+### 8.5 `GET /api/state` payload
+
+```ts
+StateEnvelope = {
+  themes: ThemeListItem[],                  // metadata only (NOT full token payloads)
+  activeThemeId: string|null,
+  activeByRole?: { [roleId:number]: string },
+  manifest: TokenManifest,
+  caps: { phase: 1|2, canImport: true, engine: "bootstrap5", formatVersion, sizeCap },
+}
+ThemeListItem = { id, name, builtin, active, engine, updatedAt, hasLayoutTree }
+```
+
+`buildState` merges builtins (mapped `builtin:true`) + library rows (`builtin:false`), annotates `active` from the live pointer (read via `getState().plugin_cfgs`, no DB hit), and includes the manifest. `caps.phase` toggles the canvas panel.
+
+### 8.6 Phase 1 — token panel + live preview
+
+The token panel renders **from the manifest** (parallel to the server `TOKEN_SCHEMA`), grouping descriptors into sections (colors/fonts/spacing) and naming the picker + `--bs-*` var(s) each token maps to:
+
+```ts
+TokenManifest = { sections: [
+  { id:"colors", label:"Colors", tokens:[
+    { key:"primary", label:"Primary", picker:"color", cssVars:["--bs-primary","--bs-primary-rgb"], default:"#0d6efd" } ]},
+  { id:"fonts", label:"Typography", tokens:[
+    { key:"fontBase", label:"Base font", picker:"font", cssVars:["--bs-body-font-family"], default:"system-ui" } ]},
+  { id:"spacing", label:"Spacing", tokens:[
+    { key:"spacer", label:"Spacer", picker:"spacing", cssVars:["--bs-body-line-height"], default:"1rem", unit:"rem" } ]},
+]}
+```
+
+**Live preview (no compile while editing).** The preview is a sandboxed `<iframe>` whose document loads the same Bootstrap/active-theme stylesheet the live site uses plus a representative sample page, with an empty `<style id="tb-overlay">` we write into. On every token change we set `--bs-*` custom properties — **the exact same overlay mechanism production uses on activate** — so WYSIWYG with zero compile.
+
+```jsx
+function PreviewFrame({ tokens, manifest }) {
+  const ref = useRef();
+  useEffect(() => { ref.current.srcdoc = buildSrcdoc(); }, []);
+  // FOLDED FIX: apply tokens on iframe load (srcdoc parses async) AND on tokens change.
+  const apply = () => { const d = ref.current?.contentDocument; if (d) applyTokens(d, tokens, manifest); };
+  useEffect(apply, [tokens, manifest]);
+  return <iframe ref={ref} onLoad={apply} sandbox="allow-same-origin" title="Theme preview" className="tb-preview"/>;
+}
+function applyTokens(doc, tokens, manifest) {
+  const decls = [];
+  for (const s of manifest.sections) for (const tk of s.tokens) {
+    const v = tokens[tk.key]; if (v == null) continue;
+    for (const cssVar of tk.cssVars) decls.push(`${cssVar}: ${formatVar(cssVar, v, tk)};`);
+  }
+  const style = doc.getElementById("tb-overlay");
+  if (style) style.textContent = `:root, [data-bs-theme]{${decls.join("")}}`;
+}
+```
+
+The folded fix applies tokens on the iframe `load` event (the `srcdoc` document parses asynchronously, so the first `[tokens]` effect would otherwise no-op on a not-yet-parsed doc and show defaults). `sandbox="allow-same-origin"` only (no `allow-scripts`) — the preview cannot run arbitrary code or navigate.
+
+**Parity guarantee:** editing → preview = `tokens` → `--bs-*` overlay (client, live); activate → production = `tokens` → `--bs-*` overlay served by `headers(cfg)` as cached CSS via the route (server). Same mapping; no drift. Production emits the overlay as a `css` link to the hash-busted `theme.css` (a real `Header` key) — **never** the untyped `style` Header field (folded fix).
+
+### 8.7 Phase 2 — Craft.js canvas
+
+A third panel (`panel:"canvas"`) reuses saltcorn-builder's patterns: `<Editor resolver onRender handlers>` + `<Frame><Element canvas is={Container}/></Frame>` (Builder.js:834-873,967-973) and the `craftToSaltcorn`/`layoutToNodes` round-trip (storage.js:97-679).
+
+```jsx
+function CanvasPanel({ open, onChange, options }) {
+  return (
+    <Editor onRender={RenderNode} resolver={RESOLVER} handlers={s=>new DefaultEventHandlers({store:s})}>
+      <Frame><Element canvas is={Container}/></Frame>
+      {/* on mount: layoutToNodes(open.layoutTree, query, actions.history.ignore(), "ROOT", options) */}
+      {/* on change (debounced): craftToSaltcorn(JSON.parse(query.serialize()),"ROOT",options).layout -> onChange(layout) */}
+    </Editor>
+  );
+}
+```
+
+- **Load:** `layoutToNodes(..., actions.history.ignore(), ...)` so the seed render is not undoable (Builder.js:762-764).
+- **Edit/serialize:** `craftToSaltcorn(...).layout` → store as `layoutTree`; mark dirty. **No network, no compile.**
+- **Save:** the one `/save` POST carries `{ tokens, layoutTree }` together (both panels feed it).
+- **Activate (Phase 2):** the engine does a full Sass recompile (viable because the plugin owns the stylesheet). The SPA is unchanged — still just POST `/activate`.
+- **Resolver completeness:** every node type appearing in a serialized tree MUST be in the Editor resolver or `deserialize` throws (Builder.js:845-873). The canvas resolver mirrors saltcorn-builder's structural subset; new node types must also be registered in the storage `allElements` list.
+- Craft nodes reference `var(--bs-*)`/Bootstrap classes only — never literal hex — keeping `tokens` the single source of truth across both panels.
+
+### 8.8 Manager panel buttons
+
+| Button | Enabled when |
+|---|---|
+| Activate | always (builtin or not) |
+| Load/Edit | always; builtin opens read-only, first save duplicates |
+| Duplicate | always |
+| Rename | not builtin |
+| Delete | not builtin AND (not active OR `autoSwitch` confirmed) AND not role-assigned-without-confirm |
+| Export | always (`<a href={exportUrl} download>`) |
+
+Top toolbar: New, Import (file input → reads text → POST `/import`).
+
+---
+
+## 9. Export / import
+
+### 9.1 Envelope
+
+```ts
+ThemeEnvelope = {
+  $schema: "saltcorn-theme",          // SCHEMA_ID discriminator
+  formatVersion: number,              // FORMAT_VERSION (1) at export; import upcasts older
+  name: string,                       // import de-dups; never an id
+  engine: "bootstrap5",
+  tokens: object,                     // authoritative
+  layoutTree?: object,                // present only if the theme has one
+}
+```
+
+The envelope carries **no id**, **no version**, **no timestamps**, **no compiled CSS** — identity is instance-local (import mints fresh), so import is structurally non-destructive.
+
+### 9.2 Build (export)
+
+```js
+function buildEnvelope(theme) {
+  const env = { $schema: SCHEMA_ID, formatVersion: FORMAT_VERSION,
+                name: theme.name, engine: theme.engine || ENGINE, tokens: theme.tokens };
+  if (theme.layoutTree) env.layoutTree = theme.layoutTree;
+  return env;
+}
+```
+
+Export works for builtins too. The route sets `Content-Disposition: attachment; filename="<slug>.theme.json"` (ASCII slug, round-trips across OSes).
+
+### 9.3 Upcaster chain (two axes)
+
+```js
+const FORMAT_UPCASTERS = {
+  0: (e) => ({ $schema: SCHEMA_ID, formatVersion: 1, name: e.name || "Imported",
+               engine: e.engine || ENGINE, tokens: e.vars || e.tokens || {}, layoutTree: e.layoutTree || null }),
+  // future: 1 -> 2 here
+};
+function upcastEnvelope(e) {
+  let cur = e, v = typeof e.formatVersion === "number" ? e.formatVersion : 0;
+  while (v < FORMAT_VERSION) {
+    if (!FORMAT_UPCASTERS[v]) throw new ImportError(`no upcaster for formatVersion ${v}`);
+    cur = FORMAT_UPCASTERS[v](cur); v = cur.formatVersion;
+  }
+  if (v > FORMAT_VERSION) throw new ImportError(`formatVersion ${v} newer than supported ${FORMAT_VERSION}`);
+  return cur;
+}
+```
+
+The **envelope** axis (`formatVersion`) is handled here; the **token-shape** axis (`tokens.$tokensVersion`) is handled by `normalizeTokens` (§4.3), currently a v1 no-op.
+
+### 9.4 Parse + robustness validation — NO security sanitization
+
+```js
+async function parseEnvelope(rawText) {
+  // (d) size cap — operational hygiene, BEFORE parse
+  if (Buffer.byteLength(rawText, "utf8") > MAX_IMPORT_BYTES) return { ok: false, error: "Theme file exceeds size limit" };
+  let parsed; try { parsed = JSON.parse(rawText); } catch { return { ok:false, error:"Not valid JSON" }; }
+  // (a) format + discriminator + upcast
+  if (!parsed || parsed.$schema !== SCHEMA_ID) return { ok:false, error:"Not a saltcorn-theme file" };
+  let env; try { env = upcastEnvelope(parsed); } catch (e) { return { ok:false, error:e.message }; }
+  if (env.engine && env.engine !== ENGINE) return { ok:false, error:`Unsupported engine: ${env.engine}` };
+
+  const tokens = normalizeTokens(env.tokens);
+  if (Object.keys(tokens).length > MAX_TOKENS) return { ok:false, error:"Too many tokens" };
+  const tv = tokensAreValid(tokens); if (!tv.ok) return { ok:false, error:tv.errors.join("; ") };
+
+  // (c) light "won't white-screen" check: actually compile + verify balanced braces.
+  const compiled = compileTheme(tokens, { engine: env.engine || ENGINE });
+  if (compiled.warnings.some((w) => /unbalanced|empty \(invalid\)/.test(w)))
+    return { ok:false, error:"Theme tokens do not compile to valid CSS" };
+
+  return { ok:true, draft: { name: (env.name||"Imported Theme").trim(), engine: env.engine||ENGINE,
+                             tokens, layoutTree: env.layoutTree ?? null } };
+}
+```
+
+### 9.5 Import handler — multipart source fix + fresh-id (folded fixes)
+
+```js
+async function importTheme(req, res) {
+  if (!guardAdmin(req, res)) return;
+  let raw;
+  if (req.files && req.files.file) {
+    const f = req.files.file;
+    if (f.size > MAX_IMPORT_BYTES) return jsonError(res, 413, "too_large", "Theme file too large");
+    // FOLDED FIX: with useTempFiles, f.data is an EMPTY (truthy) Buffer -> branch on LENGTH, read tempFilePath.
+    raw = (f.data && f.data.length) ? f.data.toString("utf8") : require("fs").readFileSync(f.tempFilePath, "utf8");
+  } else if (req.body && (req.body.$schema || req.body.envelope)) {
+    raw = typeof req.body.envelope === "string" ? req.body.envelope : JSON.stringify(req.body.envelope || req.body);
+    if (Buffer.byteLength(raw) > MAX_IMPORT_BYTES) return jsonError(res, 413, "too_large", "Theme too large");
+  } else return jsonError(res, 400, "bad_request", "No theme file provided");
+
+  const parsed = await portability.parseEnvelope(raw);
+  if (!parsed.ok) return jsonError(res, parsed.error.includes("compile") ? 422 : 400,
+                                   parsed.error.includes("compile") ? "uncompilable" : "bad_format", parsed.error);
+  // (b) FRESH id + de-dup name via create() -> import NEVER overwrites
+  const theme = await themeStore.create({ name: parsed.draft.name, engine: parsed.draft.engine,
+                                          tokens: parsed.draft.tokens, layoutTree: parsed.draft.layoutTree });
+  res.json({ theme });
+}
+```
+
+Folded fixes: branch on `f.data.length` (with `useTempFiles`, `f.data` is an empty *truthy* `Buffer`, so a truthiness branch always took the empty path → `JSON.parse("")` → every multipart import 400'd); size-check before reading the temp file.
+
+Import is admin-only; **no sanitization** (admin already owns site CSS/JS); only the four robustness checks run. Re-importing the same file yields a second copy (fresh uuid + de-dup name), never a clobber. **Contingency** (re-add sanitization if non-admin import is ever enabled) is documented inline.
+
+---
+
+## 10. Package / file layout
+
+```
+/home/scott/claude/saltcorn/theme-builder/
+  index.js                       # export object: api_version, plugin_name, configuration_workflow,
+                                 #   headers, routes, layout, onLoad
+  package.json
+  README.md                      # incl. SECURITY section (no-sanitization rationale + contingency)
+  lib/
+    constants.js                 # PLUGIN_NAME, THEME_TABLE, URL_PREFIX, CSS_ROUTE, CFG keys, caps
+    configWorkflow.js            # Workflow: phase2 toggle (+coverage HARD-BLOCK), builder link, active step
+    themeSchema.js               # DEFAULT_TOKENS, normalizeTokens, tokensAreValid, emptyTokens
+    themeStore.js                # ONLY module touching the Table: ensureTable, CRUD, casUpdate, dedupName
+    builtins/
+      index.js                   # listBuiltins(), getBuiltin(id), isBuiltinId(id), defaultId(), fallbackCss()
+      flatly.js  darkly.js  cosmo.js  ...   # Bootswatch-derived starters (frozen)
+    activePointer.js             # getActivePointer (read live cfg), setActivePointer (persist+reload+refresh)
+    cfgReaders.js                # getActiveThemeId, activeThemeIdForRole, isPhase2, activeHashHint, requestRendersViaThemeBuilder
+    portability.js               # buildEnvelope, parseEnvelope, upcastEnvelope (robustness-only)
+    sanitize.js                  # sanitizeValue, sanitizeSelector (shared by compile + sassCompile)
+    compile.js                   # compileTheme, emitOverlayCss, robustnessGuard, contentHash, deriveRgb
+    sassCompile.js               # compileSass (Phase 2, lazy require('sass'))
+    cssCache.js                  # getCached/setCached/bustTheme/bustAll/warm (per-tenant)
+    activate.js                  # activateTheme (staged compile->cache->persist composite hash->reload->refresh)
+    tokenSchema.js               # TOKEN_SCHEMA mapping table
+    tokenManifest.js             # getTokenManifest() (parallel to TOKEN_SCHEMA), validateCompiles()
+    headers.js                   # headers(cfg) factory
+    layout.js                    # layout(cfg) factory (Phase 2)
+    routes.js                    # routes(cfg) factory
+    onLoad.js                    # eachTenant bootstrap + active-CSS rehydration
+    httpUtils.js                 # isAdminReq, wantsJson, guardAdmin, jsonError
+    apiHandlers.js               # getThemeCss, getEditor, getState_, loadTheme, createTheme, ...
+    page.js                      # SPA shell HTML
+    apiState.js                  # buildState
+  scss/                          # Phase 2 only: vendored Bootstrap SCSS source
+    bootstrap/ ...
+  builder/                       # React SPA source (compiled -> public/)
+    webpack.config.js  babel.config.js
+    src/
+      index.jsx                  # window.themeBuilder.mount(elId, boot)
+      app.jsx  api.js  store.js
+      panels/ managerPanel.jsx  tokenPanel.jsx  canvasPanel.jsx
+      preview/ previewFrame.jsx  previewSrcdoc.js
+      pickers/ colorPicker.jsx  fontPicker.jsx  spacingPicker.jsx
+      craft/   resolver.js  craftBridge.js          # Phase 2 (vendored saltcorn-builder source)
+  public/                        # served at /plugins/public/theme-builder/<file>
+    builderApp.js  builderApp.css                   # committed compiled artifacts
+  test/
+    contract.test.js  compile.test.js  portability.test.js  themeStore.test.js  e2e.js
+```
+
+Filenames are camelCase throughout, per the repo convention.
+
+---
+
+## 11. Phase plan & milestones
+
+### 11.1 Phase 1 ships
+
+- `themeStore` + real Table `_themebuilder_themes` (backup-safe, per-tenant) + built-ins in code.
+- Plugin export with `configuration_workflow`, `headers(cfg)`, `routes(cfg)`, `onLoad` (table ensure + active-CSS rehydration). `layout(cfg)` present but returns `undefined`.
+- Full HTTP API (list/load/create/duplicate/save[CAS]/rename/delete[auto-switch]/activate/export/import) + public `theme.css`.
+- Pure-JS overlay compiler + robustness guard + per-tenant cache + composite `?v=hash` busting + `refresh_views` on activate.
+- Builder SPA: manager panel + token panel + live-preview iframe (no compile while editing).
+- Export/import envelope + upcaster + robustness-only validation.
+
+### 11.2 Phase 2 ships (behind `phase2Enabled`)
+
+- `layout(cfg)` returns a real `{wrap,...}` registered into `state.layouts`; selectable via `layout_by_role`/per-user attr.
+- Per-request Phase-2 overlay suppression (only for requests that render via `theme-builder`, detected by replicating `getLayout`'s fallback precedence — never by reading the fallback-omitted `pluginName`), with a config-workflow **hard-block** requiring full `layout_by_role` coverage before `phase2Enabled` can be saved.
+- Craft.js canvas panel (vendored saltcorn-builder source) persisting `layoutTree`; `wrap()` renders the tree.
+- Optional full dart-sass recompile (`@use … with`), overlay fallback on failure.
+- Vendored Bootstrap SCSS under `scss/`; `sass`/`bootstrap` added to `package.json`.
+
+### 11.3 Testing strategy
+
+- **Pure-unit:** `compile.test.js` (overlay emit, robustness guard, brace-balance, size-cap truncation, bad-token scoping), `portability.test.js` (upcast chain, fresh-id, de-dup, multipart vs JSON source, size cap), `themeSchema` (normalize/merge/version).
+- **Store/contract:** `themeStore.test.js` against both SQLite and Postgres (per the Postgres-preferred directive; SQLite as the simple/mixed-topology peer) — `ensureTable` idempotency, CAS save, `dropRoleRefs`, dedupName bound.
+- **e2e (`test/e2e.js`):** drive both instances via the existing sqlite + curl + `sc-exec.js` shim harness pattern. Cover: load≠activate (save of active theme does not change live CSS unless re-activated), activate flips `?v=hash` AND the served header actually changes (assert `assets_by_role` refresh), per-role overlay `only_if`, **re-activating a single role override changes `activeHash` so its per-role `?v` link changes (no stale immutable role CSS)**, delete-of-active auto-switch, import never overwrites, restore-over-existing pointer caveat, multi-tenant isolation, cold-worker rehydration, public `theme.css` never 5xx and never poisons cache on transient miss.
+- **Phase-2 gates:** Craft round-trip equality (`craftToSaltcorn(layoutToNodes(x)) === x`), resolver completeness, Sass-failure → overlay fallback, per-request suppression coverage — including the **uncovered-role-via-last-installed-fallback** case (a role with no `layout_by_role` entry that resolves to theme-builder via the fallback is suppressed correctly and NOT double-themed), and the coverage hard-block rejecting `phase2Enabled` when any live role is uncovered.
+- **Security-first per-phase gate (Scott's directive):** enumerate abuse cases per module and write the adversarial tests before coding (e.g. token value with `}` cannot escape `:root{}`; oversized import → 413; non-admin → 401/403 JSON on every API route; the import contingency is asserted to be a no-op only while import is admin-only).
+
+### 11.4 Risks & mitigations
+
+| Risk | Mitigation |
+|---|---|
+| Activate doesn't visibly update browsers (stale `assets_by_role`) | `setActivePointer` calls `refresh_views()` locally; cluster receiver recomputes assets + busts cache. e2e asserts the served `?v` changes. |
+| Stale immutable role CSS after re-activating a role override | `activeHash` is a COMPOSITE over default + every role-override hash, updated on EVERY activation, so each role link's `?v` changes; ETag (per-entry content hash) + the 304 path provide a second correction lever. |
+| Cache poisoning under the live hash on transient miss | Fallback/miss responses use `Cache-Control: no-store`; immutable only for real hashed CSS. |
+| Uncovered role double-themed under Phase 2 (overlay + wrap) | Suppression detects theme-builder-served requests by replicating `getLayout`'s fallback precedence (not the fallback-omitted `pluginName`); config workflow hard-blocks `phase2Enabled` until `layout_by_role` covers every live role. |
+| `loadPlugin` reinstall cost on every activate | Accepted for parity; `onLoad` hot-path short-circuits; document the cost; activate is admin-triggered, not per-request. |
+| Theme lost after restart | `onLoad` eager rehydration of all pointer-implied cache keys. |
+| Cross-tenant table miss for late-created tenant | `eachTenant` (default-first, DB-backed); public route degrades to fallback CSS, never 5xx, if a tenant's table is missing. |
+| Bootstrap version drift between Phase-1 `--bs-*` names and Phase-2 SCSS | Pin a single Bootstrap 5 version for both; CI check that vendored SCSS var names match the manifest/schema. |
+| `install name ≠ plugin_name` breaks pointer writes | `findPluginRow` resolves the `_sc_plugins` row defensively (canonical name, then scan), never assumes `name === plugin_name`. |
+
+---
+
+## 12. Open questions
+
+1. **Per-role compile granularity at scale.** Phase 1 ships a single global active theme plus an optional `activeByRole` map; activate recompiles all pointer-implied keys eagerly. If `activeByRole` grows large (many roles × distinct themes), eager recompile-on-activate may warrant a lazy-only strategy for non-default roles. The cache keying and lazy-compile-on-miss already support either; the policy choice (eager vs lazy for role overrides) is deferred until real role counts are known.
+2. **Tenant created after the last plugin load.** A tenant added to `_sc_tenants` after the most recent plugin load gets its table only on the next plugin load / tenant-create hook. The public path degrades gracefully (fallback CSS, no 5xx) and the first admin action triggers `ensureTable`, but whether to subscribe to a tenant-creation event for eager table creation is an open operational choice.
+3. **Phase-2 `layout_by_role` coverage UX — RESOLVED to a hard block.** Enabling `phase2Enabled` without `layout_by_role` covering all live roles would leave some roles selected by the last-installed fallback (which `getLayout` returns *without* `pluginName`), making per-request overlay suppression undecidable from `getLayout().pluginName` and double-theming those roles. To keep suppression deterministic, the config workflow **hard-blocks** saving `phase2Enabled: true` until `layout_by_role` covers every live role (rather than merely warning). Remaining open question: the UX of presenting and auto-filling that coverage requirement (e.g. offering to map all uncovered roles to theme-builder in one click).
+4. **`@use … with` vs runtime `--bs-*` fidelity (Phase 2).** Full Sass recompile gives higher fidelity for Bootstrap's build-time-computed values (button shades, etc.) than `--bs-*` overrides. Whether Phase-2 themes default to Sass or keep the overlay engine unless the admin opts in is deferred to Phase-2 implementation, when compile-time benchmarks are available.
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..ca3e8e9
--- /dev/null
+++ b/README.md
@@ -0,0 +1,158 @@
+# theme-builder
+
+A Saltcorn plugin: a visual theme builder. By default it ships a Bootstrap-5 CSS
+custom-property **skin overlay** (no Sass, not a layout) that composes with the
+active theme (e.g. sbadmin2). Turning on **layout mode** (the `layoutMode`
+setting) flips the plugin into a selectable **layout** whose `wrap()` is
+assembled from a layout tree, with vendored Bootstrap and an optional dart-sass
+recompile.
+
+The authoritative design is in [`ARCHITECTURE.md`](./ARCHITECTURE.md). This
+README covers what is built, how it is stored, security, and how to run it.
+
+## Status (layout mode built + validated)
+
+**Layout mode is built and validated live.** The plugin registers as a real
+Saltcorn layout when `layoutMode` is on, and its `wrap()`/`authWrap()` render the
+page from the active theme's **layoutTree** (`layoutTree.js` presets
+`topnav`/`sidebar` + `renderTree.js` server-side emitter), linking vendored stock
+Bootstrap (`public/themeBootstrap.*`) + the theme overlay. The active tree is
+persisted in plugin config on activate (so `wrap()` stays synchronous and it
+rides backup). The overlay header is suppressed per-request for
+theme-builder-served requests; `configWorkflow` hard-blocks enabling layout mode
+until `layout_by_role` covers every live role. The editor gains a **Layout
+panel** (preset picker) when layout mode is on. Sass remains the documented
+opt-in (default engine is the overlay on vendored Bootstrap); the full Craft.js
+drag-drop canvas (ARCHITECTURE 8.7) is the remaining authoring enhancement.
+
+**Layout mode validated** (in-process harness + real HTTP, all green): enable ->
+registered in `getState().layouts`; `wrap()` renders `tb-root` + navbar/sidebar +
+body + theme CSS; `authWrap()` renders the login form (real HTTP login works);
+`GET /` served by our layout; overlay suppressed exactly for theme-builder
+requests.
+
+### Deep overlay (buttons recolor without Sass)
+
+A plain `:root{--bs-primary}` override does **not** recolor `.btn-primary` —
+Bootstrap 5.3 bakes button/component colors at Sass compile time. The **deep
+overlay** (`lib/bootstrapColor.js` + `lib/deepOverlay.js`) faithfully ports
+Bootstrap's `shade`/`tint`/`color-contrast` math to JS and re-emits the per-
+component `--bs-btn-*` variables (solid + outline, all 8 variants, incl. the
+`.btn-light`/`.btn-dark` force-overrides), so buttons/badges follow the theme.
+Unit tests assert **byte parity** with Bootstrap's compiled output for every
+variant; validated visually with headless Chromium (primary->pink recolors the
+button). Opt out with `tokens.deepOverlay === false`.
+
+The editor's **live preview** uses `POST /api/preview-css` (the *same* server
+compiler -> single source of truth), so the preview is WYSIWYG including
+recolored buttons (debounced, stale-response-guarded, no save/activate).
+
+### Installed in the dev TEST instance
+
+theme-builder is installed in the `:3001` TEST instance (registered by location,
+loaded on boot via `startServerTest.sh`). Validated in a real browser (headless
+Chromium): the editor manager, the manifest-driven token panel, and the live
+preview (navbar/buttons/links recolor) all work against TEST. The install is
+non-disruptive: with no active theme and layout mode off, `theme.css` is a no-op and
+sbadmin2 remains the active layout, so the TEST site looks unchanged until an
+admin activates a theme.
+
+### Rendering engine: overlay + deep overlay (Sass deferred)
+
+The shipping engine is the **CSS-variable overlay + deep overlay** (no build, no
+runtime deps). With the deep overlay recoloring buttons/components, this covers
+the practical theming surface. The **dart-sass full recompile** remains an
+**opt-in** (`lib/sassCompile.js` degrades to the overlay when `sass` is absent);
+the full Bootstrap-SCSS vendoring is intentionally NOT shipped, since the deep
+overlay made it unnecessary for the common case. Enable it later by adding `sass`
++ vendoring `scss/bootstrap` if a theme needs build-time-only Sass features.
+
+### Plugin vs Theme classification
+
+theme-builder exports a `layout` function, so Saltcorn classifies it as a
+**Theme** (`local_has_theme`): it appears under the Plugins page's **All / Themes
+/ Installed** tabs (next to sbadmin2), not the "Modules" tab. This is intentional
+and correct (in layout mode it *is* a layout). The Configure gear renders in every
+tab it appears in.
+
+## Status (Phase 1)
+
+Built and unit-tested (server-independent):
+
+- **Pure core** (`node --test`, no DB/server): `compile.js` (overlay compiler),
+  `sanitize.js`, `tokenSchema.js`, `themeSchema.js`, `portability.js`
+  (export/import + upcasting), `builtins/` (Flatly/Darkly/Cosmo starters).
+- **Storage, wiring, HTTP, lifecycle, editor**: `themeStore.js` (the only module
+  that touches the Table), `activePointer.js`, `cfgReaders.js`, `cssCache.js`,
+  `activate.js`, `headers.js`, `layout.js`, `routes.js`, `apiHandlers.js`,
+  `apiState.js`, `httpUtils.js`, `onLoad.js`, `configWorkflow.js`, `index.js`,
+  plus the buildless editor (`lib/page.js` + `public/builderApp.js`).
+
+All `*.js` pass `node --check`; the pure suite is green (`npm test`, 31 tests).
+
+**Validated end-to-end against a live SQLite instance** (in-process harness +
+real HTTP), all green:
+
+- `onLoad` creates the `_themebuilder_themes` Table (registered in `_sc_tables`).
+- create -> save (version-CAS; stale save -> 409) -> activate (pointer +
+  composite `activeHash` persisted) -> `GET /theme.css` serves the overlay.
+- export -> import mints a fresh id with a de-duped name.
+- Activating a **built-in** serves its overlay (the `getById` seam fix).
+- Real HTTP: public `theme.css` (200, immutable+ETag), admin guard (redirect for
+  HTML, JSON 401 for the API), authed `/api/state`, the editor shell, and the
+  overlay `<link>?v=<hash>` injected into rendered pages.
+
+Reproduce with `npm run test:integration` (self-contained throwaway DB).
+
+> **Dependency convention:** like `dev-deploy`/`idp`, this plugin declares **no**
+> `@saltcorn/*` dependencies -- the host provides them at runtime. Declaring them
+> makes the plugin installer try to fetch/copy them. Phase 1 has no third-party
+> runtime deps at all.
+
+The editor under `public/builderApp.js` is a **buildless, dependency-free**
+vanilla-JS app — the Phase-1 shipping UI. The React + Craft.js source tree
+(`builder/src`, webpack-built into `public/builderApp.js`) is the **Phase-2**
+upgrade path and is not yet implemented.
+
+## Storage & backup-safety
+
+The theme **library** is a real Saltcorn `Table` (`_themebuilder_themes`)
+created via the Table model, so it is registered in `_sc_tables` and rides
+backup / restore / snapshots for free, per-tenant. The **active pointer**
+(`activeThemeId`, `activeByRole`, `activeHash`, `layoutMode`) lives in
+`plugin.configuration`, which is also captured by `plugin_pack`. Compiled CSS is
+a **derived cache**, never stored. (This deliberately avoids the raw-DDL
+backup-invisibility pitfall documented for the other plugins.)
+
+## Running
+
+This plugin is loaded by a Saltcorn instance, not run standalone. Install it as a
+local plugin pointing at this directory; `onLoad` creates the table per tenant
+and rehydrates the active-theme CSS cache. The admin editor is served at
+`/theme-builder/editor`; the public stylesheet at `/theme-builder/theme.css`.
+
+```sh
+npm test               # pure unit tests (no server)
+npm run test:integration   # in-process e2e against a throwaway SQLite DB
+npm run build:ui       # layout mode: build the React/Craft.js editor (not yet present)
+```
+
+## Security: import model
+
+**Theme import performs NO security sanitization** of the uploaded file. An admin
+can already inject arbitrary site-wide CSS/JS via `page_custom_css`,
+`page_custom_html`, or by installing plugins, so an admin-only theme import
+crosses no boundary the admin role does not already own. Import runs only four
+**robustness** checks (size cap, format/version upcast, shape validation, and a
+"compiles to balanced CSS" probe) — these exist so a malformed file fails with a
+clear error and cannot white-screen the site, not as a defense against a trusted
+admin.
+
+**Contingency:** if a non-admin role is ever permitted to import or manage
+themes, real sanitization (CSS/selector/`@import`/`url()`/expression filtering and
+layoutTree resolver allow-listing) **MUST** be reintroduced before that ships.
+See `lib/portability.js`.
+
+## License
+
+MIT
diff --git a/builder/README.md b/builder/README.md
new file mode 100644
index 0000000..ebdcbcd
--- /dev/null
+++ b/builder/README.md
@@ -0,0 +1,77 @@
+# Theme Builder -- editor UI
+
+This directory documents the two-stage plan for the in-browser theme editor.
+The editor is mounted (admin-only) at `GET /theme-builder/editor`, whose shell
+page (`lib/page.js`, ARCHITECTURE.md 8.2) loads a single static bundle served by
+Saltcorn's built-in plugin static route at
+`/plugins/public/theme-builder/builderApp.js` (no extra route -- plugins.js
+1246-1276).
+
+## Phase 1 -- the shipping editor (`public/builderApp.js`)
+
+`public/builderApp.js` is the **buildless, dependency-free Phase-1 editor**. It
+is hand-written **vanilla ES2020** -- no React, no Craft.js, no build step, no
+imports. It IS the committed, shipped artifact: an installed plugin works
+without ever running a bundler.
+
+What it does (talking only to the REST API under `window.__TB__.apiBase`):
+
+- **Manager panel** -- `GET /api/state` lists every theme with `active` and
+  `built-in` badges (ARCHITECTURE.md 8.5/8.8). Per-row buttons: Activate, Edit,
+  Duplicate, Rename, Delete, Export (plain `<a download>` to
+  `/api/themes/:id/export`). Top toolbar: New, Import (file input -> multipart
+  `POST /api/import`).
+- **Token panel** -- color / font / spacing inputs rendered **from the manifest**
+  returned by `/api/state` (`manifest.tokens[<kebabKey>] = { kind, cssVar,
+  selector, prop, derive, default }`, from `lib/apiState.buildManifest`).
+- **Live preview** -- a sandboxed `<iframe>` (`sandbox="allow-same-origin"`, no
+  scripts) loads the live `theme.css` plus a representative sample page with an
+  empty `<style id="tb-overlay">`. On every edit the editor rewrites that style
+  with `--bs-*` custom properties (and the rule-based `selector{prop:value}`
+  tokens) -- the **exact same overlay mechanism production uses on activate**
+  (`lib/compile.emitOverlayCss`). WYSIWYG with zero compile and zero network.
+
+### The cardinal rule: load != activate
+
+Loading and editing a theme **never** touches the live site. **Save** (`POST
+/api/themes/:id/save` with `{ tokens, layoutTree, baseVersion }`) and
+**Activate** (`POST /api/themes/:id/activate`) are wired as **separate
+actions**; only Activate publishes (ARCHITECTURE.md 1.4 / 8.3). Save uses
+optimistic concurrency on `baseVersion`; a 409 `version_conflict` offers
+reload-or-overwrite. Editing a built-in is allowed: the first Save transparently
+duplicates it to an editable row, leaving the original untouched.
+
+### CSRF
+
+The shell (`lib/page.js`) bootstraps
+`window.__TB__ = { apiBase, cssRoute, csrfToken, base, openThemeId }`, reading
+the token via `req.csrfToken()` (core's pattern, e.g. server/wrapper.js:259).
+Every `POST` from the editor sends it back as the **`CSRF-Token`** header
+(plus `X-Requested-With: XMLHttpRequest` and `Accept: application/json` so the
+server treats every request -- including multipart import -- as JSON).
+
+## Phase 2 -- the upgrade path (`builder/src`, NOT yet implemented)
+
+The Phase-2 editor is a **React + Craft.js** application whose source tree will
+live under **`builder/src`** (ARCHITECTURE.md 8.3, 8.7, 10). It adds a visual
+**canvas panel** (`panel:"canvas"`, enabled only when `caps.phase === 2`) that
+reuses saltcorn-builder's `<Editor>/<Frame>` patterns and the
+`craftToSaltcorn` / `layoutToNodes` round-trip, with `@craftjs/core` and the
+vendored saltcorn-builder element/storage files **bundled directly into the same
+output path** (`public/builderApp.js`) by webpack (`build:ui`).
+
+Phase 2 is purely additive and does not change the REST surface or the
+"load != activate" rule:
+
+- The token panel, manager panel, and `--bs-*` live-preview overlay carry over
+  unchanged; the canvas is a third panel feeding the same single `POST /save`
+  (`{ tokens, layoutTree }`).
+- Activate is still just `POST /api/themes/:id/activate`; the server-side engine
+  swaps the overlay compiler for a full dart-sass recompile behind the
+  `phase2Enabled` config flag (ARCHITECTURE.md 5.7 / 7.5).
+
+Until that React tree is built, **`public/builderApp.js` (the buildless vanilla
+file) is the live editor.** When Phase 2 lands, the webpack build overwrites
+`public/builderApp.js` with the compiled React bundle (exposing the same
+`window.themeBuilder.mount` entry point), and this `builder/` directory holds its
+source.
diff --git a/index.js b/index.js
new file mode 100644
index 0000000..c069201
--- /dev/null
+++ b/index.js
@@ -0,0 +1,20 @@
+// index.js
+const { API_VERSION, PLUGIN_NAME } = require("./lib/constants");
+const configuration_workflow        = require("./lib/configWorkflow");
+const { headers }                   = require("./lib/headers");        // (cfg)=>Header[]
+const { routes }                    = require("./lib/routes");         // (cfg)=>PluginRoute[]
+const { layout }                    = require("./lib/layout");         // (cfg)=>PluginLayout|undefined
+const { onLoad }                    = require("./lib/onLoad");
+
+module.exports = {
+  sc_plugin_api_version: API_VERSION,    // 1, gates compat (sbadmin2/index.js:575)
+  plugin_name: PLUGIN_NAME,              // "theme-builder" -- canonical key everywhere (plugin.ts:474)
+
+  configuration_workflow,                // PRESENCE => every facility is a (cfg)=>value factory
+  // NOTE: exposed_configs intentionally OMITTED (see 5.3)
+
+  headers,                               // Phase-1 overlay links; per-request only_if gated (see 5.4)
+  routes,                                // public theme.css + admin editor/API
+  layout,                                // (cfg)=> undefined in Phase 1; {wrap,...} in Phase 2
+  onLoad,                                // raw cfg; idempotent; per-tenant; rehydrates active CSS
+};
diff --git a/lib/activate.js b/lib/activate.js
new file mode 100644
index 0000000..88834a7
--- /dev/null
+++ b/lib/activate.js
@@ -0,0 +1,74 @@
+// lib/activate.js
+// activateTheme -- staged, persists COMPOSITE hash, refreshes assets (ARCHITECTURE.md 7.8)
+const crypto = require("crypto");
+const { getState } = require("@saltcorn/data/db/state");
+
+const { compileTheme } = require("./compile");
+const themeStore       = require("./themeStore");
+const cssCache         = require("./cssCache");
+const activePointer    = require("./activePointer");
+const { normalizeLayoutTree } = require("./layoutTree");
+const { PLUGIN_NAME } = require("./constants");
+
+function compositeHash(entries /* CompiledEntry[] */) {
+  // Fold the default + every role-override entry's content hash into ONE cache-buster so that
+  // re-activating ANY single role changes activeHash (and thus every emitted ?v). (folded fix)
+  const h = crypto.createHash("sha1");
+  for (const e of entries.filter(Boolean)) { h.update(`${e.role ?? "_"}:${e.hash};`); }
+  return h.digest("hex").slice(0, 8);
+}
+
+
+async function activateTheme(id, role) {
+  // Resolve uniformly through the store so the SEAM FIX applies (getById returns a
+  // normalized ThemeDTO for builtin ids too) -- STAGE-1's compile probe then sees the
+  // same defaulted token shape STAGE-2 caches and serves.
+  const theme = await themeStore.getById(id);
+  if (!theme) { const e = new Error("theme not found"); e.stage = "compile"; throw e; }
+
+  // STAGE 1: compile (distinct failure stage -> compile_failed). Pointer untouched on throw.
+  let compiled;
+  try { compiled = compileTheme(theme.tokens, { engine: theme.engine }); }
+  catch (e) { e.stage = "compile"; throw e; }
+
+  // STAGE 2: prime cache for ALL pointer-implied keys (default + every activeByRole role).
+  const { activeThemeId, activeByRole } = activePointer.getActivePointer();
+  const nextByRole = role == null ? activeByRole : { ...activeByRole, [role]: id };
+  const nextDefault = role == null ? id : activeThemeId;
+  cssCache.bustAll();
+  const entries = [];
+  if (nextDefault) entries.push(await cssCache.warm(nextDefault, null));
+  for (const r of Object.keys(nextByRole)) entries.push(await cssCache.warm(nextByRole[r], Number(r)));
+
+  // STAGE 3: persist pointer + COMPOSITE hash, re-register, refresh assets, propagate
+  //          (distinct failure -> activation_failed).
+  // activeHash folds in the default AND every role-override entry's content hash, so re-activating
+  // a single role CHANGES activeHash -> the per-role ?v link changes -> immutable role CSS is busted.
+  // (folded review fix: role-override cache-buster never changed -> stale immutable CSS)
+  const nextHash = compositeHash(entries);
+
+  // LAYOUT MODE: persist the activated theme's layout tree into cfg so wrap() can read
+  // it synchronously (and it rides backup with the pointer). No-op when layout mode is off.
+  const liveCfg = getState().plugin_cfgs[PLUGIN_NAME] || {};
+  let layoutPatch = {};
+  if (liveCfg.layoutMode) {
+    const tree = normalizeLayoutTree(theme.layoutTree);
+    layoutPatch = role == null
+      ? { activeLayoutTree: tree }
+      : { activeLayoutTreeByRole: { ...(liveCfg.activeLayoutTreeByRole || {}), [role]: tree } };
+  }
+
+  try {
+    const patch = role == null
+      ? { activeThemeId: id, activeByRole: nextByRole, activeHash: nextHash, ...layoutPatch }
+      : { activeByRole: nextByRole, activeHash: nextHash, ...layoutPatch };  // ALWAYS update activeHash, incl. role path
+    await activePointer.setActivePointer(patch);      // upsert + loadPlugin + refresh_views + processSend
+  } catch (e) {
+    cssCache.bustTheme(id);                           // drop orphan cache entry (folded fix)
+    e.stage = "activation"; throw e;
+  }
+  return { activeThemeId: nextDefault, activeByRole: nextByRole, cssHash: nextHash };
+}
+
+
+module.exports = { activateTheme, compositeHash };
diff --git a/lib/activePointer.js b/lib/activePointer.js
new file mode 100644
index 0000000..e3a2a0b
--- /dev/null
+++ b/lib/activePointer.js
@@ -0,0 +1,53 @@
+// lib/activePointer.js
+// Active-pointer write: persist -> re-register -> propagate -> refresh assets (ARCHITECTURE.md 5.5)
+const Plugin   = require("@saltcorn/data/models/plugin");
+const { getState } = require("@saltcorn/data/db/state");
+const db       = require("@saltcorn/data/db");
+const { PLUGIN_NAME } = require("./constants");
+
+// Resolve the install-name row defensively: _sc_plugins.name is the INSTALL name, which
+// is NOT guaranteed to equal plugin_name. Try the canonical name, then fall back to scanning
+// for the row whose module resolves to plugin_name. (folded review fix: read/write name-space split)
+async function findPluginRow() {
+  let p = await Plugin.findOne({ name: PLUGIN_NAME });
+  if (p) return p;
+  const all = await Plugin.find({});
+  return all.find((r) => {
+    const mod = getState().plugins[PLUGIN_NAME];
+    return mod && (getState().plugin_module_names[r.name] === PLUGIN_NAME || r.name === PLUGIN_NAME);
+  }) || null;
+}
+
+
+async function setActivePointer(patch /* {activeThemeId?|activeByRole?|activeHash?} */) {
+  const plugin = await findPluginRow();
+  if (!plugin) throw new Error("theme-builder plugin row not found");
+  plugin.configuration = { ...(plugin.configuration || {}), ...patch };
+  await plugin.upsert();                                   // _sc_plugins (plugin.ts:104-119)
+  await Plugin.loadPlugin(plugin);                          // re-register -> re-run headers(cfg)
+  await getState().refresh_views();                        // REBUILD assets_by_role (Fix 1)
+  getState().processSend({ refresh_plugin_cfg: PLUGIN_NAME, tenant: db.getTenantSchema() });
+  return plugin.configuration;
+}
+
+
+// READ: live merged cfg, no DB hit.
+function getActivePointer() {
+  const cfg = getState().plugin_cfgs[PLUGIN_NAME] || {};
+  return { activeThemeId: cfg.activeThemeId || null, activeByRole: cfg.activeByRole || {},
+           activeHash: cfg.activeHash || "0" };
+}
+
+
+// Remove every activeByRole entry whose value === id, then persist the scrubbed map.
+async function dropRoleRefs(id) {
+  const { activeByRole } = getActivePointer();
+  const scrubbed = {};
+  for (const role of Object.keys(activeByRole)) {
+    if (activeByRole[role] !== id) scrubbed[role] = activeByRole[role];
+  }
+  return setActivePointer({ activeByRole: scrubbed });
+}
+
+
+module.exports = { setActivePointer, getActivePointer, findPluginRow, dropRoleRefs };
diff --git a/lib/apiHandlers.js b/lib/apiHandlers.js
new file mode 100644
index 0000000..ddcde4d
--- /dev/null
+++ b/lib/apiHandlers.js
@@ -0,0 +1,260 @@
+// lib/apiHandlers.js
+// The HTTP handlers referenced by routes(cfg) (ARCHITECTURE.md 6.5, 6.6, 9.5).
+// Each handler speaks the canonical ThemeDTO and the uniform error envelope
+// (httpUtils.jsonError). The public theme.css route NEVER 5xx's (degrades to
+// fallback CSS); every other route is admin-guarded and answers JSON.
+//
+// express req/res are the per-tenant router's standard objects (server/app.js
+// mounts plugin routes via plugin_routes_handler.js / error_catcher). Multipart
+// import uploads arrive on req.files (express-fileupload, useTempFiles) -- see
+// importTheme for the empty-truthy-Buffer fix.
+
+const fs = require("fs");
+
+const themeStore     = require("./themeStore");
+const activePointer  = require("./activePointer");
+const cssCache       = require("./cssCache");
+const { activeThemeIdForRole } = require("./cfgReaders");
+const activateEngine = require("./activate");          // activateEngine.activateTheme
+const { compileTheme } = require("./compile");
+const { normalizeTokens } = require("./themeSchema");
+const portability    = require("./portability");
+const builtins       = require("./builtins");
+const httpUtils      = require("./httpUtils");
+const apiState       = require("./apiState");
+const page           = require("./page");              // renderEditorShell
+const { ROLE_PUBLIC, MAX_IMPORT_BYTES } = require("./constants");
+
+const { guardAdmin, jsonError } = httpUtils;
+
+
+// --- PUBLIC: GET /theme.css (ARCHITECTURE.md 6.5, folded cache-poisoning fix) ---
+async function getThemeCss(req, res, cfg) {
+  const role = req.query.role ? Number(req.query.role) : (req.user?.role_id ?? ROLE_PUBLIC);
+  const themeId = activeThemeIdForRole(cfg, role);
+  res.set("Content-Type", "text/css; charset=utf-8");
+  if (!themeId) { res.set("Cache-Control", "no-store"); res.send("/* theme-builder: no active theme */"); return; }
+
+  const roleKey = (cfg.activeByRole && cfg.activeByRole[role]) ? role : null;
+  let entry = cssCache.getCached(themeId, roleKey);
+  let isReal = !!entry;
+  if (!entry) {                                     // lazy compile-on-miss
+    const theme = await themeStore.getById(themeId);
+    if (theme) {
+      const compiled = compileTheme(theme.tokens, { engine: theme.engine });
+      entry = { ...compiled, themeId, role: roleKey, builtAt: Date.now() };
+      cssCache.setCached(entry);
+      isReal = true;
+    }
+  }
+  if (!entry) {                                     // theme missing mid-activate, transient
+    res.set("Cache-Control", "no-store");          // FOLDED FIX: never memoize fallback under live hash
+    res.send(builtins.fallbackCss());
+    return;
+  }
+  // ETag always reflects the per-entry CONTENT hash, so the If-None-Match/304 path can correct
+  // stale CSS even when a ?v cache-buster failed to change. We keep `immutable` ONLY when the
+  // emitted link's ?v is guaranteed to change on re-activation. With the COMPOSITE activeHash
+  // (4.4/7.8) that guarantee now holds for the per-role link too, so `immutable` is safe here;
+  // were that guarantee ever weakened, drop `immutable` (keep ETag + must-revalidate) so the
+  // 304/If-None-Match path can still correct stale role CSS. (folded review fix)
+  res.set("ETag", `"${entry.hash}"`);
+  res.set("Cache-Control", isReal ? "public, max-age=31536000, immutable" : "no-store");
+  if (req.headers["if-none-match"] === `"${entry.hash}"`) { res.status(304).end(); return; }
+  res.send(entry.css);
+}
+
+
+// --- GET /editor: SPA shell ---
+async function getEditor(req, res) {
+  if (!guardAdmin(req, res)) return;                // GET -> redirect to login on failure
+  // page.renderEditorShell builds the SPA shell HTML (embeds the /state boot blob +
+  // csrf) and sends it via res.sendWrap (ARCHITECTURE.md 8.2).
+  return page.renderEditorShell(req, res);
+}
+
+
+// --- GET /api/state ---
+async function getState_(req, res) {
+  if (!guardAdmin(req, res)) return;
+  res.json(await apiState.buildState(req));
+}
+
+
+// --- GET /api/themes/:id ---
+async function loadTheme(req, res) {
+  if (!guardAdmin(req, res)) return;
+  const id = req.params.id;
+  const theme = await themeStore.getById(id);       // resolves rows AND builtins (SEAM FIX)
+  if (!theme) return jsonError(res, 404, "not_found", "Unknown theme");
+  // builtins are read-only: surface the flag so the SPA edits via duplicate-to-edit.
+  res.json({ theme, readOnly: !!theme.builtin });
+}
+
+
+// --- POST /api/themes: create blank, or clone a template (builtin/theme) ---
+async function createTheme(req, res) {
+  if (!guardAdmin(req, res)) return;
+  const { name, engine, fromTemplate } = req.body || {};
+  let theme;
+  if (fromTemplate) {
+    // fromTemplate names a builtin/theme id to seed from -> duplicate to a fresh row.
+    theme = await themeStore.duplicate(fromTemplate, name);
+    if (!theme) return jsonError(res, 404, "not_found", "Unknown template");
+  } else {
+    theme = await themeStore.create({ name, engine, tokens: {}, layoutTree: null });
+  }
+  res.json({ theme });
+}
+
+
+// --- POST /api/themes/:id/duplicate ---
+async function duplicateTheme(req, res) {
+  if (!guardAdmin(req, res)) return;
+  const id = req.params.id;
+  const name = req.body?.name;
+  const theme = await themeStore.duplicate(id, name); // resolves rows AND builtins
+  if (!theme) return jsonError(res, 404, "not_found", "Unknown theme");
+  res.json({ theme });
+}
+
+
+// --- POST /api/themes/:id/save: optimistic CAS on version (ARCHITECTURE.md 6.6) ---
+async function saveTheme(req, res) {
+  if (!guardAdmin(req, res)) return;
+  const id = req.params.id;
+  if (builtins.isBuiltinId(id)) return jsonError(res, 403, "builtin_immutable", "Built-in themes are read-only");
+  const { tokens, layoutTree = null, baseVersion, force } = req.body || {};
+  if (tokens == null) return jsonError(res, 400, "bad_request", "Missing tokens");
+  if (baseVersion == null && !force) return jsonError(res, 400, "bad_request", "Missing baseVersion");
+  const updated = force
+    ? await themeStore.forceUpdate(id, { tokens, layoutTree })
+    : await themeStore.casUpdate(id, baseVersion, { tokens, layoutTree }); // UPDATE ... WHERE theme_id=$ AND version=$base, version=version+1
+  if (!updated) {
+    const cur = await themeStore.getById(id);
+    if (!cur) return jsonError(res, 404, "not_found", "Unknown theme");
+    return jsonError(res, 409, "version_conflict", "Theme was modified by another session", { currentVersion: cur.version });
+  }
+  res.json({ theme: updated });                     // SAVE does NOT touch the live site
+}
+
+
+// --- POST /api/themes/:id/rename: name only, builtins blocked, de-dups (no 409) ---
+async function renameTheme(req, res) {
+  if (!guardAdmin(req, res)) return;
+  const id = req.params.id;
+  if (builtins.isBuiltinId(id)) return jsonError(res, 403, "builtin_immutable", "Built-in themes are read-only");
+  const name = req.body?.name;
+  if (name == null || String(name).trim() === "") return jsonError(res, 400, "bad_request", "Missing name");
+  const exists = await themeStore.getById(id);
+  if (!exists) return jsonError(res, 404, "not_found", "Unknown theme");
+  // store.rename de-dups ("Name (2)") rather than rejecting, so rename always succeeds.
+  const theme = await themeStore.rename(id, name);
+  res.json({ theme });
+}
+
+
+// --- POST /api/themes/:id/delete (ARCHITECTURE.md 6.6) ---
+async function deleteTheme(req, res) {
+  if (!guardAdmin(req, res)) return;
+  const id = req.params.id;
+  if (builtins.isBuiltinId(id)) return jsonError(res, 403, "builtin_immutable", "Cannot delete built-in");
+  const r = await themeStore.getById(id);
+  if (!r) return jsonError(res, 404, "not_found", "Unknown theme");
+  const { activeThemeId, activeByRole } = activePointer.getActivePointer();
+  const isActive = activeThemeId === id || Object.values(activeByRole).includes(id);
+  if (isActive) {
+    if (!req.body?.autoSwitch) return jsonError(res, 409, "active_theme", "Theme is active; pass autoSwitch to reassign first");
+    const successor = (await themeStore.firstOther(id))?.id || builtins.defaultId();
+    await activateEngine.activateTheme(successor);            // recompile + flip to successor FIRST
+    await activePointer.dropRoleRefs(id);                     // scrub activeByRole entries == id
+  }
+  await themeStore.remove(id);
+  res.json({ ok: true, switchedActiveTo: isActive ? undefined : null });
+}
+
+
+// --- POST /api/themes/:id/activate: the only live-mutating op (ARCHITECTURE.md 6.6) ---
+async function activateTheme(req, res) {
+  if (!guardAdmin(req, res)) return;
+  const id = req.params.id;
+  const exists = builtins.isBuiltinId(id) ? !!builtins.get(id) : !!(await themeStore.getById(id));
+  if (!exists) return jsonError(res, 404, "not_found", "Unknown theme");
+  try {
+    const out = await activateEngine.activateTheme(id, req.body?.role);
+    res.json({ ok: true, ...out });
+  } catch (e) {
+    if (e.stage === "compile") return jsonError(res, 500, "compile_failed", e.message);   // pointer untouched
+    return jsonError(res, 500, "activation_failed", e.message);                            // pointer write/propagate failed
+  }
+}
+
+
+// --- GET /api/themes/:id/export: JSON envelope as a download (works for builtins) ---
+async function exportTheme(req, res) {
+  if (!guardAdmin(req, res)) return;
+  const id = req.params.id;
+  const theme = await themeStore.getById(id);        // resolves rows AND builtins
+  if (!theme) return jsonError(res, 404, "not_found", "Unknown theme");
+  const envelope = portability.buildEnvelope(theme);
+  const slug = String(theme.name || "theme").replace(/[^a-zA-Z0-9._-]+/g, "_").slice(0, 64) || "theme";
+  res.set("Content-Type", "application/json; charset=utf-8");
+  res.set("Content-Disposition", `attachment; filename="${slug}.theme.json"`);
+  res.send(JSON.stringify(envelope, null, 2));
+}
+
+
+// --- POST /api/import (ARCHITECTURE.md 9.5, multipart source + fresh-id fixes) ---
+async function importTheme(req, res) {
+  if (!guardAdmin(req, res)) return;
+  let raw;
+  if (req.files && req.files.file) {
+    const f = req.files.file;
+    if (f.size > MAX_IMPORT_BYTES) return jsonError(res, 413, "too_large", "Theme file too large");
+    // FOLDED FIX: with useTempFiles, f.data is an EMPTY (truthy) Buffer -> branch on LENGTH, read tempFilePath.
+    raw = (f.data && f.data.length) ? f.data.toString("utf8") : fs.readFileSync(f.tempFilePath, "utf8");
+  } else if (req.body && (req.body.$schema || req.body.envelope)) {
+    raw = typeof req.body.envelope === "string" ? req.body.envelope : JSON.stringify(req.body.envelope || req.body);
+    if (Buffer.byteLength(raw) > MAX_IMPORT_BYTES) return jsonError(res, 413, "too_large", "Theme too large");
+  } else return jsonError(res, 400, "bad_request", "No theme file provided");
+
+  const parsed = await portability.parseEnvelope(raw);
+  if (!parsed.ok) return jsonError(res, parsed.error.includes("compile") ? 422 : 400,
+                                   parsed.error.includes("compile") ? "uncompilable" : "bad_format", parsed.error);
+  // (b) FRESH id + de-dup name via create() -> import NEVER overwrites
+  const theme = await themeStore.create({ name: parsed.draft.name, engine: parsed.draft.engine,
+                                          tokens: parsed.draft.tokens, layoutTree: parsed.draft.layoutTree });
+  res.json({ theme });
+}
+
+
+// --- POST /api/preview-css: compile DRAFT tokens for the editor's live preview ---
+// Uses the SAME server compiler as production (single source of truth -> the
+// preview's buttons/badges match exactly, including the deep overlay). Does NOT
+// save or activate; returns text/css with no-store.
+async function previewCss(req, res) {
+  if (!guardAdmin(req, res)) return;
+  const tokens = normalizeTokens((req.body && req.body.tokens) || {});
+  const engine = (req.body && req.body.engine) || undefined;
+  const compiled = compileTheme(tokens, { engine });
+  res.set("Content-Type", "text/css; charset=utf-8");
+  res.set("Cache-Control", "no-store");
+  res.send(compiled.css);
+}
+
+
+module.exports = {
+  getThemeCss,
+  getEditor,
+  getState_,
+  loadTheme,
+  createTheme,
+  duplicateTheme,
+  saveTheme,
+  renameTheme,
+  deleteTheme,
+  activateTheme,
+  exportTheme,
+  importTheme,
+  previewCss,
+};
diff --git a/lib/apiState.js b/lib/apiState.js
new file mode 100644
index 0000000..87fee7e
--- /dev/null
+++ b/lib/apiState.js
@@ -0,0 +1,114 @@
+// lib/apiState.js
+// GET /api/state payload builder (ARCHITECTURE.md 8.5).
+//
+// StateEnvelope = {
+//   themes: ThemeListItem[],                  // metadata only (NOT full token payloads)
+//   activeThemeId: string|null,
+//   activeByRole?: { [roleId:number]: string },
+//   manifest: TokenManifest,
+//   caps: { layoutMode, canImport, engine, formatVersion, sizeCap },
+//   ... plus active{}, layoutMode, csrfToken convenience fields for the shell.
+// }
+// ThemeListItem = { id, name, builtin, active, engine, updatedAt, hasLayoutTree }
+//
+// buildState merges builtins (builtin:true) + library rows (builtin:false) via
+// themeStore.list(), annotates `active` from the LIVE pointer (read via
+// getState().plugin_cfgs, no DB hit), and includes the token manifest. caps.layoutMode
+// toggles the SPA canvas panel.
+
+const { getState } = require("@saltcorn/data/db/state");
+
+const themeStore = require("./themeStore");
+const { TOKEN_SCHEMA, MAX_CSS_BYTES } = require("./tokenSchema");
+const { DEFAULT_TOKENS } = require("./themeSchema");
+const { PRESETS } = require("./layoutTree");
+const {
+  PLUGIN_NAME, API_VERSION, ENGINE, FORMAT_VERSION, MAX_IMPORT_BYTES, CFG,
+} = require("./constants");
+
+
+// Live merged plugin config for this tenant (no DB hit). Mirrors
+// activePointer.getActivePointer / cfgReaders resolution.
+function livePointer() {
+  const cfg = getState().plugin_cfgs[PLUGIN_NAME] || {};
+  return {
+    activeThemeId: cfg[CFG.ACTIVE] || null,
+    activeByRole:  cfg[CFG.BY_ROLE] || {},
+    layoutMode:    !!cfg[CFG.LAYOUT_MODE],
+  };
+}
+
+
+// The server-side TokenManifest: HOW each token maps to CSS, paired with its
+// default value. Structurally parallel to the SPA manifest; derived from the
+// single TOKEN_SCHEMA source of truth.
+function buildManifest() {
+  const flatDefaults = {};
+  for (const [sec, obj] of Object.entries(DEFAULT_TOKENS)) {
+    if (!obj || typeof obj !== "object") {
+      continue;
+    }
+    for (const [k, v] of Object.entries(obj)) {
+      // camelCase leaf -> kebab-case manifest key (matches compile.flattenTokens)
+      const kebab = k.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+      flatDefaults[kebab] = v;
+    }
+  }
+  const tokens = {};
+  for (const [key, spec] of Object.entries(TOKEN_SCHEMA)) {
+    tokens[key] = {
+      kind:     spec.kind,
+      cssVar:   spec.cssVar || null,
+      selector: spec.selector || null,
+      prop:     spec.prop || null,
+      derive:   spec.derive || null,
+      default:  flatDefaults[key] != null ? flatDefaults[key] : null,
+    };
+  }
+  return { engine: ENGINE, apiVersion: API_VERSION, tokens };
+}
+
+
+// stored row / builtin ThemeDTO -> compact ThemeListItem (metadata only).
+function toListItem(t, activeThemeId, activeByRole) {
+  const isActive = t.id === activeThemeId || Object.values(activeByRole).includes(t.id);
+  return {
+    id:            t.id,
+    name:          t.name,
+    builtin:       !!t.builtin,
+    active:        isActive,
+    engine:        t.engine,
+    updatedAt:     t.updated_at || null,
+    hasLayoutTree: !!t.layoutTree,
+  };
+}
+
+
+async function buildState(req) {
+  const { activeThemeId, activeByRole, layoutMode } = livePointer();
+  const all = await themeStore.list();
+  const themes = all.map((t) => toListItem(t, activeThemeId, activeByRole));
+  const csrfToken = (req && typeof req.csrfToken === "function") ? req.csrfToken() : "";
+
+  return {
+    themes,
+    activeThemeId,
+    activeByRole,
+    active: { activeThemeId, activeByRole },
+    layoutMode,
+    csrfToken,
+    manifest: buildManifest(),
+    layoutPresets: PRESETS.map((p) => ({ id: p.id, label: p.label, tree: structuredClone(p.tree) })),
+    caps: {
+      layoutMode,
+      canImport:     true,
+      engine:        ENGINE,
+      formatVersion: FORMAT_VERSION,
+      sizeCap:       MAX_IMPORT_BYTES,
+      maxCssBytes:   MAX_CSS_BYTES,
+    },
+  };
+}
+
+
+module.exports = { buildState, buildManifest };
diff --git a/lib/bootstrapColor.js b/lib/bootstrapColor.js
new file mode 100644
index 0000000..6808f08
--- /dev/null
+++ b/lib/bootstrapColor.js
@@ -0,0 +1,107 @@
+// Faithful JS port of the Bootstrap 5.3 Sass color functions the button-variant
+// mixin uses, so the "deep overlay" can recompute the per-component
+// --bs-btn-* variables Bootstrap bakes at compile time. Pure module.
+//
+//   shade-color(c, w%) = mix(black, c, w)   (darken)
+//   tint-color(c, w%)  = mix(white, c, w)   (lighten)
+//   color-contrast(bg) -> #ffffff or #000000  (WCAG, min ratio 4.5, white first)
+
+const WHITE = { r: 255, g: 255, b: 255 };
+const BLACK = { r: 0, g: 0, b: 0 };
+const MIN_CONTRAST_RATIO = 4.5;
+
+
+// "#rgb" / "#rrggbb" -> {r,g,b}; null for anything else (named/rgb()/var()).
+function parseHexColor(s) {
+    if (typeof s !== "string") {
+        return null;
+    }
+    const v = s.trim();
+    const m6 = /^#([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/.exec(v);
+    const m3 = /^#([0-9a-fA-F])([0-9a-fA-F])([0-9a-fA-F])$/.exec(v);
+    if (m6) {
+        return { r: parseInt(m6[1], 16), g: parseInt(m6[2], 16), b: parseInt(m6[3], 16) };
+    }
+    if (m3) {
+        return { r: parseInt(m3[1] + m3[1], 16), g: parseInt(m3[2] + m3[2], 16), b: parseInt(m3[3] + m3[3], 16) };
+    }
+    return null;
+}
+
+
+function clampByte(n) {
+    return Math.min(255, Math.max(0, Math.round(n)));
+}
+
+
+function toHex(c) {
+    return "#" + [c.r, c.g, c.b].map((n) => clampByte(n).toString(16).padStart(2, "0")).join("");
+}
+
+
+function toRgbString(c) {
+    return `${clampByte(c.r)}, ${clampByte(c.g)}, ${clampByte(c.b)}`;
+}
+
+
+// Sass mix($c1, $c2, $weight): each channel = c1*w + c2*(1-w). weight is a fraction.
+function mix(c1, c2, weight) {
+    return {
+        r: c1.r * weight + c2.r * (1 - weight),
+        g: c1.g * weight + c2.g * (1 - weight),
+        b: c1.b * weight + c2.b * (1 - weight),
+    };
+}
+
+
+function shade(c, percent) {
+    return mix(BLACK, c, percent / 100);
+}
+
+
+function tint(c, percent) {
+    return mix(WHITE, c, percent / 100);
+}
+
+
+function channelLuminance(c255) {
+    const c = c255 / 255;
+    return c <= 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+}
+
+
+function relLuminance(c) {
+    return 0.2126 * channelLuminance(c.r) + 0.7152 * channelLuminance(c.g) + 0.0722 * channelLuminance(c.b);
+}
+
+
+function contrastRatio(a, b) {
+    const la = relLuminance(a) + 0.05;
+    const lb = relLuminance(b) + 0.05;
+    return la > lb ? la / lb : lb / la;
+}
+
+
+// color-contrast($bg): Bootstrap checks white first then black, returning the
+// first foreground whose contrast exceeds the min ratio (4.5), else the higher.
+function colorContrast(bg) {
+    const c = typeof bg === "string" ? parseHexColor(bg) : bg;
+    if (!c) {
+        return "#000000";
+    }
+    const rw = contrastRatio(c, WHITE);
+    const rb = contrastRatio(c, BLACK);
+    if (rw > MIN_CONTRAST_RATIO) {
+        return "#ffffff";
+    }
+    if (rb > MIN_CONTRAST_RATIO) {
+        return "#000000";
+    }
+    return rw >= rb ? "#ffffff" : "#000000";
+}
+
+
+module.exports = {
+    WHITE, BLACK, parseHexColor, toHex, toRgbString, mix, shade, tint,
+    relLuminance, contrastRatio, colorContrast,
+};
diff --git a/lib/builtins/cosmo.js b/lib/builtins/cosmo.js
new file mode 100644
index 0000000..bf08a78
--- /dev/null
+++ b/lib/builtins/cosmo.js
@@ -0,0 +1,17 @@
+// Bootswatch-derived bright starter (frozen). See flatly.js for the built-in model.
+
+module.exports = Object.freeze({
+    id: "builtin:cosmo",
+    name: "Cosmo",
+    engine: "bootstrap5",
+    tokens: {
+        $tokensVersion: 1,
+        colors: {
+            primary:   "#2780e3", secondary: "#373a3c", success: "#3fb618",
+            info:      "#9954bb", warning:   "#ff7518", danger:  "#ff0039",
+            light:     "#f8f9fa", dark:      "#373a3c",
+            bodyBg:    "#ffffff", bodyColor: "#373a3c",
+        },
+    },
+    layoutTree: null,
+});
diff --git a/lib/builtins/darkly.js b/lib/builtins/darkly.js
new file mode 100644
index 0000000..eadbd12
--- /dev/null
+++ b/lib/builtins/darkly.js
@@ -0,0 +1,18 @@
+// Bootswatch-derived dark starter (frozen). See flatly.js for the built-in model.
+
+module.exports = Object.freeze({
+    id: "builtin:darkly",
+    name: "Darkly",
+    engine: "bootstrap5",
+    tokens: {
+        $tokensVersion: 1,
+        colors: {
+            primary:   "#375a7f", secondary: "#444444", success: "#00bc8c",
+            info:      "#3498db", warning:   "#f39c12", danger:  "#e74c3c",
+            light:     "#adb5bd", dark:      "#303030",
+            bodyBg:    "#222222", bodyColor: "#ffffff",
+        },
+        components: { linkColor: "#00bc8c" },
+    },
+    layoutTree: null,
+});
diff --git a/lib/builtins/flatly.js b/lib/builtins/flatly.js
new file mode 100644
index 0000000..2d0418d
--- /dev/null
+++ b/lib/builtins/flatly.js
@@ -0,0 +1,21 @@
+// Bootswatch-derived starter (frozen). Built-ins live in code, never in the DB:
+// upgrades ship new/updated starters with no migration, and a user can never
+// delete or rename them. The "builtin:" id namespace cannot collide with the
+// uuid v4 theme_ids of stored rows.
+
+module.exports = Object.freeze({
+    id: "builtin:flatly",
+    name: "Flatly",
+    engine: "bootstrap5",
+    tokens: {
+        $tokensVersion: 1,
+        colors: {
+            primary:   "#2c3e50", secondary: "#95a5a6", success: "#18bc9c",
+            info:      "#3498db", warning:   "#f39c12", danger:  "#e74c3c",
+            light:     "#ecf0f1", dark:      "#7b8a8b",
+            bodyBg:    "#ffffff", bodyColor: "#212529",
+        },
+        typography: { headingsFontFamily: "'Lato', sans-serif" },
+    },
+    layoutTree: null,
+});
diff --git a/lib/builtins/index.js b/lib/builtins/index.js
new file mode 100644
index 0000000..4519b58
--- /dev/null
+++ b/lib/builtins/index.js
@@ -0,0 +1,42 @@
+// Built-in theme registry. Starters ship as frozen code, are merged into list()
+// at read time, and are never inserted into the Table. They are not deletable,
+// renamable, or save-able; "loading" a built-in for edit duplicates it to a
+// fresh uuid row (handled in the store/handlers).
+
+const themes = [require("./flatly"), require("./darkly"), require("./cosmo")];
+const byId = Object.freeze(Object.fromEntries(themes.map((t) => [t.id, t])));
+
+
+function listBuiltins() {
+    return themes;
+}
+
+
+function getBuiltin(id) {
+    return byId[id] || null;
+}
+
+
+function isBuiltinId(id) {
+    return typeof id === "string" && id.startsWith("builtin:");
+}
+
+
+// The starter used as a last-resort successor (e.g. when the active theme is
+// deleted and no other stored theme exists).
+function defaultId() {
+    return "builtin:flatly";
+}
+
+
+// Valid, empty CSS served on a transient miss (table not yet created, theme
+// missing mid-activate). Never a white-screen; the active theme renders
+// unchanged. Always sent with Cache-Control: no-store by the route.
+function fallbackCss() {
+    return "/* theme-builder: fallback (no compiled theme) */\n";
+}
+
+
+module.exports = {
+    listBuiltins, getBuiltin, get: getBuiltin, isBuiltinId, defaultId, fallbackCss,
+};
diff --git a/lib/cfgReaders.js b/lib/cfgReaders.js
new file mode 100644
index 0000000..937d1a6
--- /dev/null
+++ b/lib/cfgReaders.js
@@ -0,0 +1,50 @@
+// lib/cfgReaders.js
+// Config readers -- one resolution rule (ARCHITECTURE.md 5.4)
+const { getState } = require("@saltcorn/data/db/state");
+const { PLUGIN_NAME, ROLE_PUBLIC } = require("./constants");
+const { DEFAULT_LAYOUT_TREE } = require("./layoutTree");
+
+function getActiveThemeId(cfg)      { return cfg?.activeThemeId || null; }
+function getActiveByRole(cfg)       { return cfg?.activeByRole || {}; }
+function activeThemeIdForRole(cfg, roleId) {            // role override then global
+  const byRole = getActiveByRole(cfg);
+  return byRole[roleId] != null ? byRole[roleId] : getActiveThemeId(cfg);
+}
+function isLayoutMode(cfg)          { return !!cfg?.layoutMode; }
+function activeHashHint(cfg, roleId){ return (cfg && cfg.activeHash) || "0"; }
+
+// SYNC resolution of the active layout tree (so wrap() stays synchronous): the
+// per-role tree, else the default tree, else the built-in default preset.
+// activate.js persists these into cfg alongside the pointer when layout mode is on.
+function activeLayoutTree(cfg, roleId) {
+  const byRole = (cfg && cfg.activeLayoutTreeByRole) || {};
+  const roleTree = roleId != null ? (byRole[roleId] ?? byRole[String(roleId)]) : null;
+  return roleTree || (cfg && cfg.activeLayoutTree) || DEFAULT_LAYOUT_TREE;
+}
+
+// Replicate getLayout's fallback precedence WITHOUT reading the pluginName field the
+// last-installed fallback omits (state.ts:419-425). A request renders via theme-builder when
+// layout_by_role[role] names us OR (no layout_by_role entry for that role AND theme-builder is
+// the last-installed/only registered layout). (folded review fix -- see 5.7/7.6)
+function requestRendersViaThemeBuilder(req) {
+  const state = getState();
+  if (!state.layouts[PLUGIN_NAME]) return false;        // not registered as a layout (Phase 1)
+  const role = req.user?.role_id ?? ROLE_PUBLIC;
+  const byRole = state.getConfig("layout_by_role", {}) || {};
+  const mapped = byRole[role] ?? byRole[String(role)];
+  if (mapped != null) return mapped === PLUGIN_NAME;     // role branch is authoritative
+  // no layout_by_role entry for this role -> falls through to per-user / last-installed.
+  // theme-builder is selected by the fallback iff it is the last-installed layout key.
+  const keys = Object.keys(state.layouts);
+  return keys.length > 0 && keys[keys.length - 1] === PLUGIN_NAME;
+}
+
+module.exports = {
+  getActiveThemeId,
+  getActiveByRole,
+  activeThemeIdForRole,
+  isLayoutMode,
+  activeHashHint,
+  activeLayoutTree,
+  requestRendersViaThemeBuilder,
+};
diff --git a/lib/compile.js b/lib/compile.js
new file mode 100644
index 0000000..28f4ae9
--- /dev/null
+++ b/lib/compile.js
@@ -0,0 +1,212 @@
+// Phase 1 overlay compiler: tokens -> CSS custom-property overlay that loads
+// AFTER Bootstrap and wins by cascade order. Pure and NEVER throws (a bad theme
+// degrades to empty-but-valid CSS = active theme renders unchanged = no
+// white-screen). The same compileTheme doubles as the import robustness check.
+
+const crypto = require("crypto");
+const { sanitizeValue, sanitizeSelector } = require("./sanitize");
+const { TOKEN_SCHEMA, TOKEN_KEY_RE, MAX_CSS_BYTES } = require("./tokenSchema");
+const deepOverlay = require("./deepOverlay");
+
+// Bound the emitted overlay so a pathological theme cannot balloon the output.
+const MAX_ROOT_DECLS = 2000;
+const MAX_RULES = 500;
+
+// Nested token sections flattened into the kebab-case keys TOKEN_SCHEMA uses.
+const FLAT_SECTIONS = ["colors", "typography", "borders", "components"];
+
+
+function camelToKebab(key) {
+    return String(key).replace(/[A-Z]/g, (m) => "-" + m.toLowerCase());
+}
+
+
+// Merge colors/typography/borders/components into one { kebabKey: value } map.
+// `custom` (raw "--var": value) is handled separately by emitOverlayCss.
+function flattenTokens(tokens) {
+    const flat = {};
+    if (!tokens || typeof tokens !== "object") {
+        return flat;
+    }
+    for (const sec of FLAT_SECTIONS) {
+        const obj = tokens[sec];
+        if (!obj || typeof obj !== "object") {
+            continue;
+        }
+        for (const [k, v] of Object.entries(obj)) {
+            if (v != null) {
+                flat[camelToKebab(k)] = v;
+            }
+        }
+    }
+    return flat;
+}
+
+
+// "#ff0000" / "#f00" -> "255, 0, 0" for the --bs-<x>-rgb companion. Returns null
+// for non-hex values (the companion is simply not emitted).
+function deriveRgb(value) {
+    if (typeof value !== "string") {
+        return null;
+    }
+    const s = value.trim();
+    const m6 = /^#([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/.exec(s);
+    const m3 = /^#([0-9a-fA-F])([0-9a-fA-F])([0-9a-fA-F])$/.exec(s);
+    let r;
+    let g;
+    let b;
+    if (m6) {
+        r = parseInt(m6[1], 16);
+        g = parseInt(m6[2], 16);
+        b = parseInt(m6[3], 16);
+    } else if (m3) {
+        r = parseInt(m3[1] + m3[1], 16);
+        g = parseInt(m3[2] + m3[2], 16);
+        b = parseInt(m3[3] + m3[3], 16);
+    } else {
+        return null;
+    }
+    return `${r}, ${g}, ${b}`;
+}
+
+
+// Build the overlay. Each --bs-x:v; is its own declaration and each targeted
+// rule is its own {} block, so the CSS parser's standard error recovery drops a
+// single bad declaration/rule without discarding siblings.
+function emitOverlayCss(tokens) {
+    const warnings = [];
+    const rootDecls = [];
+    const rules = [];
+    const flat = flattenTokens(tokens);
+
+    for (const [key, rawVal] of Object.entries(flat)) {
+        if (rootDecls.length >= MAX_ROOT_DECLS || rules.length >= MAX_RULES) {
+            warnings.push("token cap reached; remaining tokens dropped");
+            break;
+        }
+        if (!TOKEN_KEY_RE.test(key)) {
+            continue;
+        }
+        const sv = sanitizeValue(rawVal, warnings);
+        if (sv == null) {
+            continue;
+        }
+        const schema = TOKEN_SCHEMA[key];
+        if (schema && schema.kind === "bsvar") {
+            rootDecls.push(`--bs-${schema.cssVar}: ${sv};`);
+            if (Array.isArray(schema.derive)) {
+                const rgb = deriveRgb(sv);
+                if (rgb != null) {
+                    rootDecls.push(`--bs-${schema.cssVar}-rgb: ${rgb};`);
+                }
+            }
+        } else if (schema && schema.kind === "rule") {
+            const sel = sanitizeSelector(schema.selector);
+            if (sel != null) {
+                rules.push(`${sel}{${schema.prop}: ${sv};}`);
+            }
+        } else if (schema && schema.kind === "ignore") {
+            // known-but-not-emitted (forward-compat)
+        } else {
+            // unknown-but-valid token -> harmless passthrough custom property
+            rootDecls.push(`--tb-${key}: ${sv};`);
+        }
+    }
+
+    // raw custom CSS variables ("--my-var": "value")
+    const custom = tokens && tokens.custom;
+    if (custom && typeof custom === "object") {
+        for (const [k, v] of Object.entries(custom)) {
+            if (rootDecls.length >= MAX_ROOT_DECLS) {
+                break;
+            }
+            if (!/^--[-a-zA-Z0-9_]{1,64}$/.test(k)) {
+                continue;
+            }
+            const sv = sanitizeValue(v, warnings);
+            if (sv != null) {
+                rootDecls.push(`${k}: ${sv};`);
+            }
+        }
+    }
+
+    let css = "";
+    if (rootDecls.length > 0) {
+        css += `:root{${rootDecls.join("")}}\n`;
+    }
+    if (rules.length > 0) {
+        css += rules.join("\n") + "\n";
+    }
+
+    // DEEP OVERLAY: recompute the per-component --bs-btn-* variables Bootstrap
+    // bakes at compile time, so buttons actually recolor under the overlay. A
+    // plain :root{--bs-primary} override does NOT reach .btn-primary. Opt out
+    // with tokens.deepOverlay === false. Skipped silently for non-hex colors.
+    if (!tokens || tokens.deepOverlay !== false) {
+        const btnCss = deepOverlay.emitButtonRules((tokens && tokens.colors) || {});
+        if (btnCss) {
+            css += btnCss + "\n";
+        }
+    }
+    return { css, warnings };
+}
+
+
+// Final structural backstop. Bounds size and verifies balanced braces; on
+// failure degrades to an empty-but-valid sentinel rather than emitting CSS that
+// could break the whole page.
+function robustnessGuard(css, warnings) {
+    if (Buffer.byteLength(css, "utf8") > MAX_CSS_BYTES) {
+        warnings.push("css exceeds cap");
+        const rootLine = css.split("\n").find((l) => l.startsWith(":root{")) || "";
+        css = (rootLine && Buffer.byteLength(rootLine, "utf8") <= MAX_CSS_BYTES)
+            ? rootLine
+            : "/* theme-builder: empty (over cap) */";
+    }
+    let depth = 0;
+    let ok = true;
+    for (const ch of css) {
+        if (ch === "{") {
+            depth += 1;
+        } else if (ch === "}") {
+            depth -= 1;
+            if (depth < 0) {
+                ok = false;
+                break;
+            }
+        }
+    }
+    if (!ok || depth !== 0) {
+        warnings.push("unbalanced braces; emitting empty");
+        css = "/* theme-builder: empty (invalid) */";
+    }
+    return { css, warnings };
+}
+
+
+function contentHash(css) {
+    return crypto.createHash("sha1").update(css).digest("hex").slice(0, 8);
+}
+
+
+// Pure; never throws. opts.engine "sass" routes to the Phase-2 recompiler
+// (lazy-required), anything else to the overlay.
+function compileTheme(tokens, opts = {}) {
+    const engine = opts.engine === "sass" ? "sass" : "overlay";
+    let out;
+    try {
+        out = engine === "sass"
+            ? require("./sassCompile").compileSass(tokens, opts)
+            : emitOverlayCss(tokens);
+    } catch (e) {
+        out = { css: "/* theme-builder: empty (compile error) */", warnings: ["compile threw: " + e.message] };
+    }
+    const guarded = robustnessGuard(out.css, out.warnings || []);
+    return { css: guarded.css, hash: contentHash(guarded.css), warnings: guarded.warnings, engine };
+}
+
+
+module.exports = {
+    compileTheme, emitOverlayCss, robustnessGuard, contentHash, deriveRgb,
+    flattenTokens, camelToKebab,
+};
diff --git a/lib/configWorkflow.js b/lib/configWorkflow.js
new file mode 100644
index 0000000..8e3896b
--- /dev/null
+++ b/lib/configWorkflow.js
@@ -0,0 +1,112 @@
+// lib/configWorkflow.js
+// The presence of configuration_workflow is the single switch that makes every
+// facility (headers/routes/layout) a (cfg)=>value factory (ARCHITECTURE.md 3.1/5.1).
+// This workflow mounts:
+//   (1) an informational step linking to the builder SPA (URL_PREFIX + "/editor"), and
+//   (2) the layoutMode toggle, HARD-BLOCKED unless layout_by_role covers every live
+//       role so the last-installed fallback is never the live selector and per-request
+//       overlay suppression stays deterministic (ARCHITECTURE.md 5.7 / 12.3).
+const Workflow = require("@saltcorn/data/models/workflow");
+const Form     = require("@saltcorn/data/models/form");
+const Role     = require("@saltcorn/data/models/role");
+const { getState } = require("@saltcorn/data/db/state");
+const { PLUGIN_NAME, URL_PREFIX, CFG } = require("./constants");
+
+const EDITOR_URL = URL_PREFIX + "/editor";
+
+
+// Every role row in _sc_roles is a "live" role. A role is covered when
+// layout_by_role names theme-builder for it (keys are JSON strings, role.id is
+// numeric -> normalize to String on both sides). Returns the list of uncovered
+// role names; empty means full coverage (ARCHITECTURE.md 5.7 / 12.3).
+async function uncoveredRoles() {
+  const byRole = getState().getConfig("layout_by_role", {}) || {};
+  const roles  = await Role.find({}, { orderBy: "id" });
+  const out    = [];
+  for (const role of roles) {
+    const mapped = byRole[role.id] != null ? byRole[role.id] : byRole[String(role.id)];
+    if (mapped !== PLUGIN_NAME) {
+      out.push(role.role);
+    }
+  }
+  return out;
+}
+
+
+function configuration_workflow() {
+  return new Workflow({
+    steps: [
+      {
+        name: "Theme builder",
+        form: async () =>
+          new Form({
+            blurb:
+              "Design and manage themes in the visual builder, then activate one " +
+              "from the theme list. The builder opens in a full-page editor.",
+            fields: [
+              {
+                name: "_builder_link",
+                label: "Open the builder",
+                input_type: "custom_html",
+                attributes: {
+                  html:
+                    '<a class="btn btn-primary" target="_blank" rel="noopener" href="' +
+                    EDITOR_URL +
+                    '">Open theme builder &raquo;</a>',
+                },
+              },
+            ],
+          }),
+      },
+      {
+        name: "Layout mode",
+        form: async () => {
+          // Resolve coverage up front so the (synchronous) form validator can
+          // hard-block enabling layoutMode when any live role is uncovered.
+          const uncovered = await uncoveredRoles();
+          return new Form({
+            blurb:
+              "By default theme-builder only RECOLORS your current theme (a CSS " +
+              "overlay on top of your active layout). Turn this on to let " +
+              "theme-builder provide the PAGE LAYOUT itself (navbar / sidebar / " +
+              "content), making it a selectable site layout. It stays off until " +
+              "you opt in so that installing the plugin never changes your site's " +
+              "layout (Saltcorn uses the last-installed layout as the default). " +
+              "When on, assign theme-builder to roles under 'layout by role'; it " +
+              "must cover every role before this can be enabled." +
+              (uncovered.length
+                ? '<div class="alert alert-warning mt-2">Roles not yet mapped to ' +
+                  "theme-builder: " +
+                  uncovered.join(", ") +
+                  ". Map them under Settings -> Users and security -> Roles before " +
+                  "enabling layout mode.</div>"
+                : ""),
+            fields: [
+              {
+                name: CFG.LAYOUT_MODE,
+                label: "Use theme-builder as the page layout",
+                type: "Bool",
+                default: false,
+                sublabel:
+                  "Hard-blocked unless layout_by_role covers every live role.",
+              },
+            ],
+            validator(values) {
+              if (values[CFG.LAYOUT_MODE] && uncovered.length) {
+                return (
+                  "Cannot use theme-builder as the page layout yet: assign it to " +
+                  "every role under 'layout by role' first. Uncovered roles: " +
+                  uncovered.join(", ") +
+                  ". (This prevents some roles from silently falling back to a " +
+                  "different layout.)"
+                );
+              }
+            },
+          });
+        },
+      },
+    ],
+  });
+}
+
+module.exports = configuration_workflow;
diff --git a/lib/constants.js b/lib/constants.js
new file mode 100644
index 0000000..1216d0d
--- /dev/null
+++ b/lib/constants.js
@@ -0,0 +1,32 @@
+// One source of truth for plugin metadata, route paths, table name, caps, and
+// config keys. Pure module: imports nothing (so it is safe to require from the
+// unit-testable core as well as from the Saltcorn-dependent wiring).
+
+const PLUGIN_NAME      = "theme-builder";           // canonical plugin_name
+const API_VERSION      = 1;
+const THEME_TABLE      = "_themebuilder_themes";
+const URL_PREFIX       = "/theme-builder";          // top-level, NOT under core /admin
+const API_BASE         = `${URL_PREFIX}/api`;
+const CSS_ROUTE        = `${URL_PREFIX}/theme.css`;
+const FORMAT_VERSION   = 1;                          // export envelope formatVersion
+const SCHEMA_ID        = "saltcorn-theme";
+const ENGINE           = "bootstrap5";
+const MAX_IMPORT_BYTES = 2 * 1024 * 1024;           // 2 MiB
+const MAX_TOKENS       = 2000;
+const ROLE_ADMIN       = 1;
+const ROLE_PUBLIC      = 100;
+
+// config keys (live in plugin.configuration):
+const CFG = {
+    ACTIVE:      "activeThemeId",
+    BY_ROLE:     "activeByRole",
+    HASH:        "activeHash",
+    LAYOUT_MODE: "layoutMode",
+    SCHEMA_VER:  "schemaVersion",
+};
+
+module.exports = {
+    PLUGIN_NAME, API_VERSION, THEME_TABLE, URL_PREFIX, API_BASE, CSS_ROUTE,
+    FORMAT_VERSION, SCHEMA_ID, ENGINE, MAX_IMPORT_BYTES, MAX_TOKENS,
+    ROLE_ADMIN, ROLE_PUBLIC, CFG,
+};
diff --git a/lib/cssCache.js b/lib/cssCache.js
new file mode 100644
index 0000000..0f5b8f8
--- /dev/null
+++ b/lib/cssCache.js
@@ -0,0 +1,23 @@
+// lib/cssCache.js
+// Per-tenant compiled-CSS cache + cache-busting (ARCHITECTURE.md 7.7)
+const db = require("@saltcorn/data/db");
+const { compileTheme } = require("./compile");
+const themeStore = require("./themeStore");
+
+const cache = new Map(); // tenantSchema -> Map<`${themeId}:${role??"_"}`, CompiledEntry>
+function tkey() { return db.getTenantSchema(); }
+function ck(themeId, role) { return `${themeId}:${role ?? "_"}`; }
+function getCached(themeId, role) { return cache.get(tkey())?.get(ck(themeId, role)); }
+function setCached(e) { let t = cache.get(tkey()); if (!t) cache.set(tkey(), (t = new Map())); t.set(ck(e.themeId, e.role), e); }
+function bustTheme(themeId) { const t = cache.get(tkey()); if (t) for (const k of [...t.keys()]) if (k.startsWith(themeId + ":")) t.delete(k); }
+function bustAll() { cache.delete(tkey()); }
+async function warm(themeId, role) {                 // used by onLoad rehydration + activate
+  const theme = await themeStore.getById(themeId);   // resolves rows AND builtins (SEAM FIX)
+  if (!theme) return null;
+  const compiled = compileTheme(theme.tokens, { engine: theme.engine });
+  const entry = { ...compiled, themeId, role: role ?? null, builtAt: Date.now() };
+  setCached(entry);
+  return entry;
+}
+
+module.exports = { getCached, setCached, bustTheme, bustAll, warm };
diff --git a/lib/deepOverlay.js b/lib/deepOverlay.js
new file mode 100644
index 0000000..1ea7c1c
--- /dev/null
+++ b/lib/deepOverlay.js
@@ -0,0 +1,89 @@
+// The "deep overlay": emit the per-component --bs-btn-* variables that Bootstrap
+// 5.3 bakes at Sass compile time, recomputed from the theme's colors -- so solid
+// and outline BUTTONS actually recolor under the CSS-variable overlay (a plain
+// :root{--bs-primary} override does NOT recolor .btn-primary, whose colors are
+// build-time literals). Mirrors scss/_buttons.scss + mixins/_buttons.scss.
+
+const {
+    parseHexColor, toHex, toRgbString, mix, shade, tint, colorContrast,
+} = require("./bootstrapColor");
+
+// The themeable button variants, in Bootstrap order.
+const BTN_VARIANTS = ["primary", "secondary", "success", "info", "warning", "danger", "light", "dark"];
+
+// button-variant hover/active shade & tint amounts (scss/_variables.scss).
+const A = {
+    hoverBgShade: 15, hoverBgTint: 15,
+    hoverBorderShade: 20, hoverBorderTint: 10,
+    activeBgShade: 20, activeBgTint: 20,
+    activeBorderShade: 25, activeBorderTint: 10,
+};
+
+
+// One solid .btn-<name> rule. `name` selects the light/dark force-overrides:
+//   .btn-light  -> always SHADE; .btn-dark -> always TINT; else by text color.
+function solidButtonRule(name, color) {
+    const c = parseHexColor(color);
+    if (!c) {
+        return "";
+    }
+    const textColor = colorContrast(c);                 // "#ffffff" | "#000000"
+    const shadeMode = name === "light" ? true : name === "dark" ? false : textColor === "#ffffff";
+
+    const hoverBg = shadeMode ? shade(c, A.hoverBgShade) : tint(c, A.hoverBgTint);
+    const hoverBorder = shadeMode ? shade(c, A.hoverBorderShade) : tint(c, A.hoverBorderTint);
+    const activeBg = shadeMode ? shade(c, A.activeBgShade) : tint(c, A.activeBgTint);
+    const activeBorder = shadeMode ? shade(c, A.activeBorderShade) : tint(c, A.activeBorderTint);
+    const focusRgb = toRgbString(mix(parseHexColor(textColor), c, 0.15));
+
+    const bg = toHex(c);
+    return `.btn-${name}{`
+        + `--bs-btn-color:${textColor};--bs-btn-bg:${bg};--bs-btn-border-color:${bg};`
+        + `--bs-btn-hover-color:${colorContrast(hoverBg)};--bs-btn-hover-bg:${toHex(hoverBg)};--bs-btn-hover-border-color:${toHex(hoverBorder)};`
+        + `--bs-btn-focus-shadow-rgb:${focusRgb};`
+        + `--bs-btn-active-color:${colorContrast(activeBg)};--bs-btn-active-bg:${toHex(activeBg)};--bs-btn-active-border-color:${toHex(activeBorder)};`
+        + `--bs-btn-disabled-color:${textColor};--bs-btn-disabled-bg:${bg};--bs-btn-disabled-border-color:${bg};`
+        + `}`;
+}
+
+
+// One .btn-outline-<name> rule (button-outline-variant): transparent fill that
+// inverts to the variant color on hover/active.
+function outlineButtonRule(name, color) {
+    const c = parseHexColor(color);
+    if (!c) {
+        return "";
+    }
+    const hex = toHex(c);
+    const onColor = colorContrast(c);
+    return `.btn-outline-${name}{`
+        + `--bs-btn-color:${hex};--bs-btn-border-color:${hex};`
+        + `--bs-btn-hover-color:${onColor};--bs-btn-hover-bg:${hex};--bs-btn-hover-border-color:${hex};`
+        + `--bs-btn-focus-shadow-rgb:${toRgbString(c)};`
+        + `--bs-btn-active-color:${onColor};--bs-btn-active-bg:${hex};--bs-btn-active-border-color:${hex};`
+        + `--bs-btn-disabled-color:${hex};--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:${hex};`
+        + `}`;
+}
+
+
+// Emit the full deep-overlay CSS for the given color map { primary, secondary,
+// ... }. Variants whose value is not a hex color are skipped (the :root overlay
+// still sets --bs-<name> for them).
+function emitButtonRules(colors) {
+    if (!colors || typeof colors !== "object") {
+        return "";
+    }
+    const out = [];
+    for (const name of BTN_VARIANTS) {
+        const color = colors[name];
+        if (!color || !parseHexColor(color)) {
+            continue;
+        }
+        out.push(solidButtonRule(name, color));
+        out.push(outlineButtonRule(name, color));
+    }
+    return out.filter(Boolean).join("\n");
+}
+
+
+module.exports = { emitButtonRules, solidButtonRule, outlineButtonRule, BTN_VARIANTS };
diff --git a/lib/headers.js b/lib/headers.js
new file mode 100644
index 0000000..a00ae60
--- /dev/null
+++ b/lib/headers.js
@@ -0,0 +1,54 @@
+// lib/headers.js
+// headers(cfg) injection + per-role / layout-mode suppression (ARCHITECTURE.md 7.6)
+//
+// Grounding (real Saltcorn source under packages/):
+//   - server/wrapper.js:137 -- a header is emitted only when `h.only_if(req) === true`
+//     (strict equality), so every predicate here returns an explicit boolean.
+//   - saltcorn-data/db/state.ts:1122-1135 -- only `script` URLs are de-duped; `css`
+//     headers are not, so distinct per-role ?v/&theme/&role links coexist.
+const { CSS_ROUTE } = require("./constants");
+const {
+  getActiveThemeId,
+  getActiveByRole,
+  activeHashHint,
+  isLayoutMode,
+  requestRendersViaThemeBuilder,
+} = require("./cfgReaders");
+
+function headers(cfg) {
+  const def = getActiveThemeId(cfg);
+  const byRole = getActiveByRole(cfg);
+  const list = [];
+  if (!def) return list;
+
+  // ONE header; only_if decides per-request whether this role gets the overlay.
+  list.push({
+    css: `${CSS_ROUTE}?v=${activeHashHint(cfg)}`,
+    only_if: (req) => {
+      const role = req.user?.role_id ?? 100;
+      // LAYOUT MODE: suppress ONLY for requests that actually render via theme-builder.
+      // Detected by replicating getLayout's fallback precedence (cfgReaders), NOT by reading
+      // getLayout().pluginName -- the last-installed fallback omits pluginName, so an uncovered
+      // role would otherwise be double-themed (overlay + wrap()). (folded review fix)
+      if (isLayoutMode(cfg) && requestRendersViaThemeBuilder(req)) return false;
+      // role with an explicit override gets its own header below, not this one
+      return byRole[role] === undefined || byRole[role] === def;
+    },
+  });
+
+  // per-role overlays for explicit overrides (Phase 1)
+  for (const [roleStr, tid] of Object.entries(byRole)) {
+    if (tid === def) continue;
+    const role = Number(roleStr);
+    list.push({
+      css: `${CSS_ROUTE}?v=${activeHashHint(cfg)}&theme=${encodeURIComponent(tid)}&role=${role}`,
+      only_if: (req) => {
+        if (isLayoutMode(cfg) && requestRendersViaThemeBuilder(req)) return false;
+        return (req.user?.role_id ?? 100) === role;     // MUST strictly return true (wrapper.js:137)
+      },
+    });
+  }
+  return list;
+}
+
+module.exports = { headers };
diff --git a/lib/httpUtils.js b/lib/httpUtils.js
new file mode 100644
index 0000000..2decfbc
--- /dev/null
+++ b/lib/httpUtils.js
@@ -0,0 +1,27 @@
+// lib/httpUtils.js
+// Admin guard -- JSON-aware (ARCHITECTURE.md 6.4, folded review fix)
+//
+// Uniform error envelope: { error: { code, message, ...context } }, where
+//   code in { forbidden, not_found, version_conflict, name_taken, active_theme,
+//             builtin_immutable, bad_format, too_large, uncompilable,
+//             bad_request, compile_failed, activation_failed, initializing }.
+const db = require("@saltcorn/data/db");
+const { ROLE_ADMIN, API_BASE } = require("./constants");
+
+function isAdminReq(req) {                         // mirror core isAdmin (utils.js:85-100)
+  return !!(req.user && req.user.role_id === ROLE_ADMIN && req.user.tenant === db.getTenantSchema());
+}
+function wantsJson(req) {
+  return req.xhr
+    || (req.path || "").startsWith(API_BASE)       // API routes ALWAYS answer JSON (fixes multipart-import misclassify)
+    || (req.get("accept") || "").includes("application/json")
+    || (req.get("content-type") || "").includes("application/json");
+}
+function guardAdmin(req, res) {
+  if (isAdminReq(req)) return true;
+  if (wantsJson(req)) res.status(req.user ? 403 : 401).json({ error: { code: "forbidden", message: "Must be admin" } });
+  else res.redirect(req.user ? "/" : `/auth/login?dest=${encodeURIComponent(req.originalUrl)}`);
+  return false;
+}
+function jsonError(res, status, code, message, extra) { res.status(status).json({ error: { code, message, ...(extra || {}) } }); }
+module.exports = { isAdminReq, wantsJson, guardAdmin, jsonError };
diff --git a/lib/layout.js b/lib/layout.js
new file mode 100644
index 0000000..a36fefb
--- /dev/null
+++ b/lib/layout.js
@@ -0,0 +1,81 @@
+// lib/layout.js
+// layout(cfg) -- Phase-1 returns undefined; Phase-2 returns a real PluginLayout
+// (ARCHITECTURE.md 5.1, 7.10). When Phase 2 is enabled the plugin registers into
+// state.layouts["theme-builder"] (state.ts:1113-1117) and is selectable via
+// layout_by_role[role] === "theme-builder" (or user._attributes.layout).
+//
+// wrap() OWNS the document: it links the vendored stock Bootstrap CSS + the
+// theme overlay (var(--bs-*)) CSS, renders the page chrome from the active
+// layoutTree (renderTree.js), and threads Saltcorn's headersInHead/Body. Because
+// wrap() emits the token <link> itself, headers(cfg)'s only_if suppresses the
+// Phase-1 overlay header for theme-builder-served requests (7.6). Sass is the
+// documented opt-in; the default engine is the overlay on stock Bootstrap.
+
+const { PLUGIN_NAME, CSS_ROUTE } = require("./constants");
+const { isLayoutMode, activeHashHint, activeLayoutTree } = require("./cfgReaders");
+const { renderTreeToHtml, renderToasts, esc } = require("./renderTree");
+const { headersInHead, headersInBody } = require("@saltcorn/markup/layout_utils");
+const { renderForm } = require("@saltcorn/markup");
+
+const ASSET_BASE = `/plugins/public/${PLUGIN_NAME}`;
+const BOOTSTRAP_CSS = `${ASSET_BASE}/themeBootstrap.min.css`;
+const BOOTSTRAP_JS = `${ASSET_BASE}/themeBootstrap.bundle.min.js`;
+
+
+function headLinks(cfg, role, headers) {
+    const v = activeHashHint(cfg, role);
+    return `<meta charset="utf-8">`
+        + `<meta name="viewport" content="width=device-width, initial-scale=1">`
+        + `<link rel="stylesheet" href="${BOOTSTRAP_CSS}">`
+        + `<link rel="stylesheet" href="${CSS_ROUTE}?v=${v}">`
+        + headersInHead(headers || []);
+}
+
+
+function layout(cfg) {
+    if (!isLayoutMode(cfg)) {
+        return undefined;                               // falsy => not registered as a layout (layout mode off)
+    }
+    return {
+        pluginName: PLUGIN_NAME,
+
+        wrap: ({ title, body, brand, menu, alerts, headers, bodyClass, role, req, currentUrl } = {}) => {
+            const chrome = renderTreeToHtml(activeLayoutTree(cfg, role), {
+                title, body, brand, menu, alerts: alerts || [], role, req, currentUrl,
+            });
+            return `<!doctype html><html lang="en"><head>${headLinks(cfg, role, headers)}`
+                + `<title>${esc(title || "")}</title></head>`
+                + `<body class="${esc(bodyClass || "")}">${chrome}`
+                + `<script src="${BOOTSTRAP_JS}"></script>${headersInBody(headers || [])}`
+                + `</body></html>`;
+        },
+
+        // Auth pages (login/signup): a centered card. The login/signup FORM arrives
+        // as a Saltcorn Form OBJECT under `form` and MUST be rendered via
+        // renderForm(form, csrfToken) -- it carries the _csrf field. authLinks are
+        // the login/forgot/signup cross-links; afterForm is extra HTML.
+        authWrap: ({ title, form, afterForm, authLinks, alerts, headers, csrfToken, role, req } = {}) => {
+            const links = [];
+            if (authLinks) {
+                if (authLinks.login) links.push(`<a href="${esc(authLinks.login)}">Login</a>`);
+                if (authLinks.forgot) links.push(`<a href="${esc(authLinks.forgot)}">Forgot password?</a>`);
+                if (authLinks.signup) links.push(`<a href="${esc(authLinks.signup)}">Create an account</a>`);
+            }
+            const formHtml = form ? renderForm(form, csrfToken || "") : "";
+            return `<!doctype html><html lang="en"><head>${headLinks(cfg, role, headers)}`
+                + `<title>${esc(title || "")}</title></head>`
+                + `<body class="tb-auth"><div class="container" style="max-width:28rem"><div class="py-5">`
+                + `<div class="card shadow-sm"><div class="card-body p-4">`
+                + `<h1 class="h4 mb-3 text-center">${esc(title || "")}</h1>`
+                + `${formHtml}<div class="mt-3 text-center small">${links.join(" | ")}</div>${afterForm || ""}`
+                + `</div></div></div></div>${renderToasts(alerts || [])}`
+                + `<script src="${BOOTSTRAP_JS}"></script>${headersInBody(headers || [])}`
+                + `</body></html>`;
+        },
+
+        // renderBody: passthrough -- the body content is already rendered HTML.
+        renderBody: ({ body } = {}) => body || "",
+    };
+}
+
+module.exports = { layout };
diff --git a/lib/layoutTree.js b/lib/layoutTree.js
new file mode 100644
index 0000000..bdd02a8
--- /dev/null
+++ b/lib/layoutTree.js
@@ -0,0 +1,127 @@
+// Phase-2 layout "bones": the layoutTree schema, the structural node-type set
+// (the server-side resolver mirror), built-in PRESETS, and validation. A theme's
+// layout_tree (stored JSON) is one of these trees; renderTree.js emits HTML from
+// it. Pure module -- no @saltcorn, no DB.
+//
+// A node is { type, props?, children? }. Slots are filled at render time from the
+// wrap() context (brand/menu -> Navbar/Sidebar, body -> Content, alerts -> toasts).
+
+// The structural subset every serialized tree may use (resolver completeness:
+// renderTree must handle each of these or it falls back to a passthrough).
+const NODE_TYPES = ["Root", "Navbar", "Sidebar", "Content", "Footer", "Row", "Col", "Html", "AlertsSlot"];
+
+const MAX_NODES = 200;
+const MAX_DEPTH = 12;
+
+
+// ---- built-in presets ------------------------------------------------------
+
+const TOPNAV = Object.freeze({
+    type: "Root",
+    props: { className: "min-vh-100 d-flex flex-column" },
+    children: [
+        { type: "Navbar", props: { variant: "dark", bg: "primary", expand: "lg", brand: true, menu: true, fluid: false } },
+        { type: "Content", props: { container: "container" } },
+        { type: "Footer", props: { text: "" } },
+    ],
+});
+
+const SIDEBAR = Object.freeze({
+    type: "Root",
+    props: { className: "min-vh-100 d-flex" },
+    children: [
+        { type: "Sidebar", props: { variant: "dark", bg: "dark", brand: true, menu: true, width: "240px" } },
+        { type: "Content", props: { container: "fluid", grow: true } },
+    ],
+});
+
+const PRESETS = Object.freeze([
+    Object.freeze({ id: "topnav", label: "Top navbar", tree: TOPNAV }),
+    Object.freeze({ id: "sidebar", label: "Left sidebar", tree: SIDEBAR }),
+]);
+
+const DEFAULT_LAYOUT_TREE = TOPNAV;
+
+
+function listPresets() {
+    return PRESETS.map((p) => ({ id: p.id, label: p.label }));
+}
+
+
+function getPreset(id) {
+    const p = PRESETS.find((x) => x.id === id);
+    return p ? structuredClone(p.tree) : null;
+}
+
+
+// ---- validation ------------------------------------------------------------
+
+function isPlainObject(x) {
+    return !!x && typeof x === "object" && !Array.isArray(x);
+}
+
+
+// Walk the tree counting nodes / Content slots and checking node types + depth.
+function walk(node, depth, acc) {
+    if (!isPlainObject(node)) {
+        acc.errors.push("node is not an object");
+        return;
+    }
+    acc.count += 1;
+    if (acc.count > MAX_NODES) {
+        acc.errors.push("too many nodes");
+        return;
+    }
+    if (depth > MAX_DEPTH) {
+        acc.errors.push("tree too deep");
+        return;
+    }
+    if (!NODE_TYPES.includes(node.type)) {
+        acc.errors.push(`unknown node type: ${node.type}`);
+    }
+    if (node.type === "Content") {
+        acc.contentSlots += 1;
+    }
+    if (node.children != null) {
+        if (!Array.isArray(node.children)) {
+            acc.errors.push(`${node.type}.children must be an array`);
+        } else {
+            for (const c of node.children) {
+                walk(c, depth + 1, acc);
+            }
+        }
+    }
+}
+
+
+// Returns { ok, errors[] }. A valid tree has a Root, exactly one Content slot,
+// only known node types, and is within the size/depth caps.
+function validateLayoutTree(tree) {
+    const acc = { errors: [], count: 0, contentSlots: 0 };
+    if (!isPlainObject(tree)) {
+        return { ok: false, errors: ["layoutTree must be an object"] };
+    }
+    if (tree.type !== "Root") {
+        acc.errors.push("layoutTree root must be a Root node");
+    }
+    walk(tree, 0, acc);
+    if (acc.contentSlots !== 1) {
+        acc.errors.push(`exactly one Content slot required (found ${acc.contentSlots})`);
+    }
+    return { ok: acc.errors.length === 0, errors: acc.errors };
+}
+
+
+// Return the tree if it is valid, else the default preset (never white-screen).
+function normalizeLayoutTree(tree) {
+    if (tree == null) {
+        return structuredClone(DEFAULT_LAYOUT_TREE);
+    }
+    return validateLayoutTree(tree).ok ? tree : structuredClone(DEFAULT_LAYOUT_TREE);
+}
+
+
+module.exports = {
+    NODE_TYPES, MAX_NODES, MAX_DEPTH, PRESETS, DEFAULT_LAYOUT_TREE,
+    listPresets, getPreset, validateLayoutTree, normalizeLayoutTree,
+};
diff --git a/lib/onLoad.js b/lib/onLoad.js
new file mode 100644
index 0000000..a253735
--- /dev/null
+++ b/lib/onLoad.js
@@ -0,0 +1,35 @@
+// lib/onLoad.js
+// Idempotent per-tenant bootstrap + active-CSS rehydration (ARCHITECTURE.md 5.6).
+const db = require("@saltcorn/data/db");
+const { getState } = require("@saltcorn/data/db/state");
+const { eachTenant } = require("@saltcorn/admin-models/models/tenant");  // canonical (folded fix)
+const themeStore = require("./themeStore");
+const cssCache   = require("./cssCache");
+const { getActivePointer } = require("./activePointer");
+const { PLUGIN_NAME } = require("./constants");
+
+async function bootstrapTenant() {
+  // 1) HOT-PATH SHORT-CIRCUIT: if the table already exists for THIS tenant, skip all DDL
+  //    work cheaply (loadPlugin re-runs onLoad on every activate). (folded review fix)
+  await themeStore.ensureTableForCurrentTenant();   // Table.findOne first; Table.create only if null
+
+  // 2) Rehydrate the active-CSS cache from the persisted pointer so the live site is themed
+  //    immediately after a restart/new worker (folded review fix: rehydration was unowned).
+  try {
+    const { activeThemeId, activeByRole } = getActivePointer();
+    const keys = new Set();
+    if (activeThemeId) keys.add(null);                          // default key
+    for (const r of Object.keys(activeByRole)) keys.add(Number(r));
+    for (const roleKey of keys) {
+      const id = roleKey == null ? activeThemeId : activeByRole[roleKey];
+      if (id) await cssCache.warm(id, roleKey);                // recompile -> cache
+    }
+  } catch (e) { getState().log(3, `theme-builder rehydrate failed: ${e.message}`); }
+}
+
+// eachTenant self-selects single vs multi: it runs default_schema FIRST then iterates
+// DB-backed tenants only in MT mode. No hand-rolled is_it_multi_tenant branch. (folded fix)
+async function onLoad(/* rawCfg */) {
+  await eachTenant(bootstrapTenant);
+}
+module.exports = { onLoad, bootstrapTenant };
diff --git a/lib/page.js b/lib/page.js
new file mode 100644
index 0000000..c8bcd76
--- /dev/null
+++ b/lib/page.js
@@ -0,0 +1,112 @@
+// lib/page.js
+// The Builder SPA shell page (ARCHITECTURE.md 8.2).
+//
+// renderEditorShell(req, res) builds a COMPLETE, dependency-free HTML document
+// (no React in the served shell) that:
+//   (a) loads the compiled Phase-1 editor from the plugin's static public dir,
+//       /plugins/public/theme-builder/builderApp.js (plugins.js:1246-1276),
+//   (b) bootstraps window.__TB__ = { apiBase, cssRoute, csrfToken } -- the CSRF
+//       token is read from req exactly the way core does it (req.csrfToken(),
+//       e.g. server/wrapper.js:259, server/app.js:74 where it defaults to ""),
+//   (c) exposes a single mount point <div id="theme-builder-root"> the editor
+//       attaches to.
+//
+// The function RETURNS the complete document string; when a res is supplied
+// (the apiHandlers.getEditor path) it also res.send()s that document. We send a
+// standalone document rather than res.sendWrap()'ing a body fragment so the SPA
+// owns the whole page and stays free of the core React chrome -- per the task's
+// "COMPLETE HTML document / dependency-free shell" contract.
+
+const { API_BASE, CSS_ROUTE, URL_PREFIX, PLUGIN_NAME } = require("./constants");
+
+// The plugin's committed editor bundle, served by core's static plugin route.
+const BUNDLE_URL = `/plugins/public/${PLUGIN_NAME}/builderApp.js`;
+
+
+// Mirror core's CSRF read: req.csrfToken is a function (csurf adds it; in some
+// modes app.js stubs it to return ""). Guard so a missing token never throws.
+function readCsrfToken(req) {
+  if (req && typeof req.csrfToken === "function") {
+    try {
+      return req.csrfToken() || "";
+    } catch (e) {
+      return "";
+    }
+  }
+  return "";
+}
+
+
+// Minimal HTML-escaper for the <title> and any attribute text. The JSON blob is
+// emitted via JSON.stringify with "<" escaped so it cannot break out of the
+// <script> element.
+function escapeHtml(s) {
+  return String(s)
+    .replace(/&/g, "&amp;")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/"/g, "&quot;");
+}
+
+
+// JSON for inline <script>: prevent "</script>" / "<!--" from terminating the
+// element, and keep it ASCII-only.
+function safeJson(value) {
+  return JSON.stringify(value)
+    .replace(/</g, "\\u003c")
+    .replace(/>/g, "\\u003e")
+    .replace(/&/g, "\\u0026")
+    .replace(/[\u2028]/g, "\\u2028")
+    .replace(/[\u2029]/g, "\\u2029");
+}
+
+
+// Build the complete HTML document string. openThemeId (?id=) lets a deep-link
+// open straight into a theme; the editor reads it from the boot blob.
+function buildShellHtml(req) {
+  const csrfToken = readCsrfToken(req);
+  const openThemeId = (req && req.query && req.query.id) ? String(req.query.id) : null;
+  const boot = {
+    apiBase: API_BASE,
+    cssRoute: CSS_ROUTE,
+    base: URL_PREFIX,
+    csrfToken,
+    openThemeId,
+  };
+
+  return `<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<meta name="robots" content="noindex,nofollow">
+<title>${escapeHtml("Theme Builder")}</title>
+<style>
+  html, body { margin: 0; padding: 0; height: 100%; }
+  body { font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
+  #theme-builder-root { height: 100%; }
+  #theme-builder-root .tb-loading { padding: 2rem; color: #555; }
+</style>
+</head>
+<body>
+<div id="theme-builder-root"><div class="tb-loading">Loading Theme Builder...</div></div>
+<script>window.__TB__ = ${safeJson(boot)};</script>
+<script src="${BUNDLE_URL}" defer></script>
+</body>
+</html>
+`;
+}
+
+
+// Public entry point. Returns the document string; if res is provided, sends it.
+function renderEditorShell(req, res) {
+  const html = buildShellHtml(req);
+  if (res && typeof res.send === "function") {
+    res.set("Content-Type", "text/html; charset=utf-8");
+    res.send(html);
+  }
+  return html;
+}
+
+
+module.exports = { renderEditorShell, buildShellHtml, BUNDLE_URL };
diff --git a/lib/portability.js b/lib/portability.js
new file mode 100644
index 0000000..b2b095e
--- /dev/null
+++ b/lib/portability.js
@@ -0,0 +1,119 @@
+// Export/import as a versioned, self-describing JSON envelope. Import is
+// admin-only and performs NO security sanitization (an admin already owns site
+// CSS/JS via page_custom_css / custom headers / plugin install -- see README
+// SECURITY). Only four ROBUSTNESS checks run: size cap, format+version upcast,
+// shape validation, and a "won't white-screen" compile check.
+//
+// CONTINGENCY: if a non-admin role is ever allowed to import/manage themes,
+// real sanitization (CSS/selector/@import/url()/expression filtering, layoutTree
+// resolver allow-listing) MUST be reintroduced before that capability ships.
+
+const {
+    SCHEMA_ID, FORMAT_VERSION, ENGINE, MAX_IMPORT_BYTES, MAX_TOKENS,
+} = require("./constants");
+const { normalizeTokens, tokensAreValid } = require("./themeSchema");
+const { compileTheme } = require("./compile");
+
+
+class ImportError extends Error {}
+
+
+// The export envelope carries NO id, version, timestamps, or compiled CSS --
+// identity is instance-local (import mints fresh), so import is structurally
+// non-destructive.
+function buildEnvelope(theme) {
+    const env = {
+        $schema: SCHEMA_ID,
+        formatVersion: FORMAT_VERSION,
+        name: theme.name,
+        engine: theme.engine || ENGINE,
+        tokens: theme.tokens,
+    };
+    if (theme.layoutTree) {
+        env.layoutTree = theme.layoutTree;
+    }
+    return env;
+}
+
+
+// Envelope-axis upcasters (formatVersion). The token-shape axis
+// (tokens.$tokensVersion) is handled separately by normalizeTokens.
+const FORMAT_UPCASTERS = {
+    0: (e) => ({
+        $schema: SCHEMA_ID, formatVersion: 1, name: e.name || "Imported",
+        engine: e.engine || ENGINE, tokens: e.vars || e.tokens || {}, layoutTree: e.layoutTree || null,
+    }),
+    // future: 1 -> 2 here
+};
+
+
+function upcastEnvelope(e) {
+    let cur = e;
+    let v = typeof e.formatVersion === "number" ? e.formatVersion : 0;
+    while (v < FORMAT_VERSION) {
+        if (!FORMAT_UPCASTERS[v]) {
+            throw new ImportError(`no upcaster for formatVersion ${v}`);
+        }
+        cur = FORMAT_UPCASTERS[v](cur);
+        v = cur.formatVersion;
+    }
+    if (v > FORMAT_VERSION) {
+        throw new ImportError(`formatVersion ${v} newer than supported ${FORMAT_VERSION}`);
+    }
+    return cur;
+}
+
+
+async function parseEnvelope(rawText) {
+    // (d) size cap -- operational hygiene, BEFORE parse
+    if (Buffer.byteLength(rawText, "utf8") > MAX_IMPORT_BYTES) {
+        return { ok: false, error: "Theme file exceeds size limit" };
+    }
+    let parsed;
+    try {
+        parsed = JSON.parse(rawText);
+    } catch {
+        return { ok: false, error: "Not valid JSON" };
+    }
+    // (a) format + discriminator + upcast
+    if (!parsed || parsed.$schema !== SCHEMA_ID) {
+        return { ok: false, error: "Not a saltcorn-theme file" };
+    }
+    let env;
+    try {
+        env = upcastEnvelope(parsed);
+    } catch (e) {
+        return { ok: false, error: e.message };
+    }
+    if (env.engine && env.engine !== ENGINE) {
+        return { ok: false, error: `Unsupported engine: ${env.engine}` };
+    }
+
+    const tokens = normalizeTokens(env.tokens);
+    if (Object.keys(tokens).length > MAX_TOKENS) {
+        return { ok: false, error: "Too many tokens" };
+    }
+    const tv = tokensAreValid(tokens);
+    if (!tv.ok) {
+        return { ok: false, error: tv.errors.join("; ") };
+    }
+
+    // (c) light "won't white-screen" check: actually compile + verify balanced braces.
+    const compiled = compileTheme(tokens, { engine: env.engine || ENGINE });
+    if (compiled.warnings.some((w) => /unbalanced|empty \(invalid\)/.test(w))) {
+        return { ok: false, error: "Theme tokens do not compile to valid CSS" };
+    }
+
+    return {
+        ok: true,
+        draft: {
+            name: (env.name || "Imported Theme").trim(),
+            engine: env.engine || ENGINE,
+            tokens,
+            layoutTree: env.layoutTree ?? null,
+        },
+    };
+}
+
+
+module.exports = { ImportError, buildEnvelope, upcastEnvelope, FORMAT_UPCASTERS, parseEnvelope };
diff --git a/lib/renderTree.js b/lib/renderTree.js
new file mode 100644
index 0000000..d7c6f6f
--- /dev/null
+++ b/lib/renderTree.js
@@ -0,0 +1,154 @@
+// Phase-2 server-side tree -> HTML emitter. Walks a layoutTree (see layoutTree.js)
+// and produces the page chrome, filling slots from the wrap() context:
+//   brand/menu -> Navbar/Sidebar, body -> Content, alerts -> toasts.
+//
+// body/menu/brand are server-generated HTML from Saltcorn (trusted) and are NOT
+// escaped; only admin/user TEXT (brand name, footer text) is escaped. Pure module.
+
+const { normalizeLayoutTree } = require("./layoutTree");
+
+
+function esc(s) {
+    return String(s == null ? "" : s)
+        .replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;")
+        .replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+}
+
+
+function bsAlertType(t) {
+    const map = { error: "danger", danger: "danger", success: "success", warning: "warning", info: "info", primary: "primary" };
+    return map[t] || "info";
+}
+
+
+function renderBrand(brand) {
+    if (!brand) {
+        return "";
+    }
+    if (typeof brand === "string") {
+        return brand;                                   // already HTML
+    }
+    const logo = brand.logo ? `<img src="${esc(brand.logo)}" height="30" class="me-2" alt="">` : "";
+    return `<a class="navbar-brand" href="/">${logo}${esc(brand.name || "")}</a>`;
+}
+
+
+// Render Saltcorn's menu array into Bootstrap nav markup. Defensive about shape:
+// menu is an array of sections, each with an `items` array (or an item itself).
+function renderMenu(menu, variant, ctx) {
+    if (!Array.isArray(menu) || menu.length === 0) {
+        return "";
+    }
+    const ulClass = variant === "sidebar" ? "nav flex-column" : "navbar-nav me-auto mb-2 mb-lg-0";
+    const items = [];
+    for (const section of menu) {
+        const list = Array.isArray(section?.items) ? section.items : [section];
+        for (const it of list) {
+            if (!it || (it.label == null && it.link == null)) {
+                continue;
+            }
+            const icon = it.icon ? `<i class="${esc(it.icon)}"></i> ` : "";
+            const active = it.link && it.link === ctx.currentUrl ? " active" : "";
+            if (Array.isArray(it.subitems) && it.subitems.length) {
+                const sub = it.subitems
+                    .filter((s) => s && (s.label != null || s.link != null))
+                    .map((s) => `<li><a class="dropdown-item" href="${esc(s.link || "#")}">${esc(s.label || "")}</a></li>`)
+                    .join("");
+                items.push(
+                    `<li class="nav-item dropdown"><a class="nav-link dropdown-toggle${active}" href="#" role="button" data-bs-toggle="dropdown">${icon}${esc(it.label || "")}</a><ul class="dropdown-menu">${sub}</ul></li>`
+                );
+            } else {
+                items.push(`<li class="nav-item"><a class="nav-link${active}" href="${esc(it.link || "#")}">${icon}${esc(it.label || "")}</a></li>`);
+            }
+        }
+    }
+    return `<ul class="${ulClass}">${items.join("")}</ul>`;
+}
+
+
+function renderToasts(alerts) {
+    if (!Array.isArray(alerts) || alerts.length === 0) {
+        return "";
+    }
+    const items = alerts
+        .map((a) => `<div class="alert alert-${bsAlertType(a.type)} shadow-sm" role="alert">${a.msg || ""}</div>`)
+        .join("");
+    return `<div class="tb-alerts position-fixed top-0 end-0 p-3" style="z-index:1080;max-width:90vw">${items}</div>`;
+}
+
+
+function renderChildren(node, ctx) {
+    if (!Array.isArray(node.children)) {
+        return "";
+    }
+    return node.children.map((c) => renderNode(c, ctx)).join("");
+}
+
+
+function renderNode(node, ctx) {
+    const p = node.props || {};
+    switch (node.type) {
+        case "Root":
+            return `<div id="tb-root" class="${esc(p.className || "")}">${renderChildren(node, ctx)}</div>`;
+        case "Navbar": {
+            const variantClass = p.variant === "light" ? "navbar-light" : "navbar-dark";
+            const expand = `navbar-expand-${p.expand || "lg"}`;
+            const bg = p.bg ? `bg-${esc(p.bg)}` : "";
+            const brand = p.brand ? renderBrand(ctx.brand) : "";
+            const menu = p.menu
+                ? `<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#tbNav" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>`
+                  + `<div class="collapse navbar-collapse" id="tbNav">${renderMenu(ctx.menu, "navbar", ctx)}</div>`
+                : "";
+            return `<nav class="navbar ${expand} ${variantClass} ${bg}"><div class="container${p.fluid ? "-fluid" : ""}">${brand}${menu}</div></nav>`;
+        }
+        case "Sidebar": {
+            const variantClass = p.variant === "light" ? "navbar-light" : "navbar-dark";
+            const bg = p.bg ? `bg-${esc(p.bg)}` : "bg-dark";
+            const brand = p.brand ? `<div class="mb-3">${renderBrand(ctx.brand)}</div>` : "";
+            const menu = p.menu ? renderMenu(ctx.menu, "sidebar", ctx) : "";
+            return `<aside class="tb-sidebar ${variantClass} ${bg} p-3" style="width:${esc(p.width || "240px")};min-height:100vh">${brand}${menu}</aside>`;
+        }
+        case "Content": {
+            ctx._bodyEmitted = true;
+            const container = p.container === "fluid" ? "container-fluid" : "container";
+            const grow = p.grow ? " flex-grow-1" : "";
+            return `<main class="tb-content${grow}" style="min-width:0"><div class="${container} py-3">${ctx.body || ""}</div></main>`;
+        }
+        case "Footer": {
+            const inner = p.html != null ? String(p.html) : esc(p.text || "");
+            return `<footer class="tb-footer border-top py-3 mt-auto text-center text-muted small"><div class="container">${inner}</div></footer>`;
+        }
+        case "Row":
+            return `<div class="row ${esc(p.className || "")}">${renderChildren(node, ctx)}</div>`;
+        case "Col":
+            return `<div class="col ${esc(p.className || "")}">${renderChildren(node, ctx)}</div>`;
+        case "Html":
+            return p.html != null ? String(p.html) : "";
+        case "AlertsSlot":
+            ctx._alertsEmitted = true;
+            return renderToasts(ctx.alerts);
+        default:
+            // resolver fallback: render children so an unknown wrapper never drops the body
+            return renderChildren(node, ctx);
+    }
+}
+
+
+// renderTreeToHtml(tree, ctx) -> HTML string. ctx = {title, body, brand, menu,
+// alerts, role, req, currentUrl}. Guarantees the body and alerts are emitted even
+// if the tree omits a Content/AlertsSlot node (never silently drop page content).
+function renderTreeToHtml(tree, ctx) {
+    const t = normalizeLayoutTree(tree);
+    const c = { ...ctx, _bodyEmitted: false, _alertsEmitted: false };
+    let html = renderNode(t, c);
+    if (!c._bodyEmitted) {
+        html += `<div class="container py-3">${ctx.body || ""}</div>`;
+    }
+    if (!c._alertsEmitted) {
+        html += renderToasts(ctx.alerts);
+    }
+    return html;
+}
+
+
+module.exports = { renderTreeToHtml, renderMenu, renderBrand, renderToasts, esc };
diff --git a/lib/routes.js b/lib/routes.js
new file mode 100644
index 0000000..aa25e95
--- /dev/null
+++ b/lib/routes.js
@@ -0,0 +1,23 @@
+// lib/routes.js
+// routes(cfg) factory (ARCHITECTURE.md 6.3)
+const { URL_PREFIX, API_BASE, CSS_ROUTE } = require("./constants");
+const h = require("./apiHandlers");
+
+function routes(cfg) {
+  return [
+    { url: CSS_ROUTE,                          method: "get",  callback: (req, res) => h.getThemeCss(req, res, cfg) }, // PUBLIC
+    { url: `${URL_PREFIX}/editor`,             method: "get",  callback: h.getEditor },
+    { url: `${API_BASE}/state`,                method: "get",  callback: h.getState_ },
+    { url: `${API_BASE}/themes/:id`,           method: "get",  callback: h.loadTheme },
+    { url: `${API_BASE}/themes`,               method: "post", callback: h.createTheme },
+    { url: `${API_BASE}/themes/:id/duplicate`, method: "post", callback: h.duplicateTheme },
+    { url: `${API_BASE}/themes/:id/save`,      method: "post", callback: h.saveTheme },
+    { url: `${API_BASE}/themes/:id/rename`,    method: "post", callback: h.renameTheme },
+    { url: `${API_BASE}/themes/:id/delete`,    method: "post", callback: h.deleteTheme },
+    { url: `${API_BASE}/themes/:id/activate`,  method: "post", callback: h.activateTheme },
+    { url: `${API_BASE}/themes/:id/export`,    method: "get",  callback: h.exportTheme },
+    { url: `${API_BASE}/import`,               method: "post", callback: h.importTheme },
+    { url: `${API_BASE}/preview-css`,          method: "post", callback: h.previewCss }, // editor WYSIWYG (no save/activate)
+  ];
+}
+module.exports = { routes };
diff --git a/lib/sanitize.js b/lib/sanitize.js
new file mode 100644
index 0000000..33c01e4
--- /dev/null
+++ b/lib/sanitize.js
@@ -0,0 +1,57 @@
+// Robustness guards shared by compile.js (overlay) AND sassCompile.js (Phase 2).
+// NOT a security boundary (see README SECURITY section): an admin can already
+// inject site CSS/JS by other means. These exist solely so a single malformed
+// token value cannot white-screen every page -- a value that could close a CSS
+// block early ("}"), terminate a declaration (";"), or open/close a comment is
+// DROPPED from output (not escaped), confining each token to its own declaration.
+
+const { MAX_VALUE_LEN } = require("./tokenSchema");
+
+// Substrings that would let a value escape its own declaration/block.
+const BAD_SUBSTRINGS = ["{", "}", ";", "</", "/*", "*/"];
+
+
+// Returns the value unchanged if safe to emit, or null if it must be dropped.
+// When dropped, pushes a human-readable note onto the optional warnings array.
+function sanitizeValue(value, warnings) {
+    if (value == null) {
+        return null;
+    }
+    const v = String(value);
+    if (v.length > MAX_VALUE_LEN) {
+        if (warnings) {
+            warnings.push(`value dropped (too long): ${v.slice(0, 24)}...`);
+        }
+        return null;
+    }
+    for (const bad of BAD_SUBSTRINGS) {
+        if (v.includes(bad)) {
+            if (warnings) {
+                warnings.push(`value dropped (illegal "${bad}")`);
+            }
+            return null;
+        }
+    }
+    return v;
+}
+
+
+// Returns a conservative selector unchanged, or null if it could break out of a
+// rule block. Selectors come only from TOKEN_SCHEMA (trusted), but we guard
+// anyway so a future data-driven selector cannot escape.
+function sanitizeSelector(selector) {
+    if (selector == null) {
+        return null;
+    }
+    const s = String(selector);
+    if (s.length > 256) {
+        return null;
+    }
+    if (/[{};<>]/.test(s) || s.includes("/*") || s.includes("*/")) {
+        return null;
+    }
+    return s;
+}
+
+
+module.exports = { sanitizeValue, sanitizeSelector };
diff --git a/lib/sassCompile.js b/lib/sassCompile.js
new file mode 100644
index 0000000..151b361
--- /dev/null
+++ b/lib/sassCompile.js
@@ -0,0 +1,41 @@
+// Phase 2 dart-sass recompile (ARCHITECTURE.md 7.5). Lazy and defensive: the
+// `sass` dependency and the vendored Bootstrap SCSS under ../scss are Phase-2
+// only, so a missing dep or compile error degrades to the Phase-1 overlay
+// rather than white-screening. Only ever reached for engine:"sass" themes.
+
+const path = require("path");
+const { sanitizeValue } = require("./sanitize");        // shared guard (folded fix)
+
+
+function compileSass(tokens, opts = {}) {
+    const warnings = [];
+    try {
+        const sass = require("sass");                       // lazy; Phase-2 dep
+        const flat = require("./compile").flattenTokens(tokens);
+        const varBlock = Object.entries(flat)
+            .filter(([k]) => /^[-a-zA-Z0-9_]{1,64}$/.test(k))
+            .map(([k, v]) => {
+                const sv = sanitizeValue(v, warnings);
+                return sv == null ? "" : `$${k}: ${sv};`;
+            })
+            .filter(Boolean)
+            .join("\n");
+        const scssDir = path.join(__dirname, "..", "scss");
+        // relative module id resolved via loadPaths; no absolute @import string.
+        const entry = `@use "bootstrap/bootstrap" with (\n${varBlock}\n);\n`;
+        const result = sass.compileString(entry, {
+            loadPaths: [scssDir],
+            style: "compressed",
+            logger: { warn: (m) => warnings.push(m), debug: () => {} },
+        });
+        return { css: result.css, warnings };
+    } catch (e) {
+        warnings.push("sass compile unavailable/failed: " + e.message);
+        // fall back to the overlay; never white-screen.
+        const overlay = require("./compile").emitOverlayCss(tokens);
+        return { css: overlay.css, warnings: warnings.concat(overlay.warnings || []) };
+    }
+}
+
+
+module.exports = { compileSass };
diff --git a/lib/themeSchema.js b/lib/themeSchema.js
new file mode 100644
index 0000000..894b0d1
--- /dev/null
+++ b/lib/themeSchema.js
@@ -0,0 +1,101 @@
+// Token shape: defaults, deep-merge-on-read normalization, and validation.
+// Pure module (only depends on constants for the token-count cap). `tokens` is
+// the SINGLE SOURCE OF TRUTH for a theme; every read passes through
+// normalizeTokens so the compiler always receives a fully-populated, current
+// shape (a sparse/empty theme can never white-screen).
+
+const { MAX_TOKENS } = require("./constants");
+
+const DEFAULT_TOKENS = Object.freeze({
+    $tokensVersion: 1,
+    colors: {
+        primary:   "#0d6efd", secondary: "#6c757d", success: "#198754",
+        info:      "#0dcaf0", warning:   "#ffc107", danger:  "#dc3545",
+        light:     "#f8f9fa", dark:      "#212529",
+        bodyBg:    "#ffffff", bodyColor: "#212529",
+    },
+    typography: {
+        rootFontSize: "16px", bodyFontSize: "1rem",
+        bodyFontWeight: "400", bodyLineHeight: "1.5",
+    },
+    borders: { borderRadius: "0.375rem", borderWidth: "1px" },
+    components: {},
+    custom: {},
+});
+
+
+function isPlainObject(x) {
+    return !!x && typeof x === "object" && !Array.isArray(x);
+}
+
+
+// Recursive merge; `over` wins. Non-object values are replaced wholesale.
+function deepMerge(base, over) {
+    const out = isPlainObject(base) ? { ...base } : {};
+    if (!isPlainObject(over)) {
+        return out;
+    }
+    for (const [k, v] of Object.entries(over)) {
+        if (isPlainObject(v) && isPlainObject(out[k])) {
+            out[k] = deepMerge(out[k], v);
+        } else {
+            out[k] = v;
+        }
+    }
+    return out;
+}
+
+
+// The single chokepoint every token read passes through. v1: validate + deep-
+// merge over DEFAULT_TOKENS (no transform yet). Future: a TOKEN_UPCASTERS chain
+// keyed on $tokensVersion can be added here, mirroring the envelope upcaster.
+function normalizeTokens(raw) {
+    const merged = deepMerge(structuredClone(DEFAULT_TOKENS), isPlainObject(raw) ? raw : {});
+    merged.$tokensVersion = 1;
+    return merged;
+}
+
+
+function emptyTokens() {
+    return structuredClone(DEFAULT_TOKENS);
+}
+
+
+// Shape check used by import. Returns { ok, errors[] }. Every leaf under a known
+// section must be a string; the token count is capped.
+function tokensAreValid(tokens) {
+    const errors = [];
+    if (!isPlainObject(tokens)) {
+        return { ok: false, errors: ["tokens must be an object"] };
+    }
+    if (tokens.$tokensVersion != null && typeof tokens.$tokensVersion !== "number") {
+        errors.push("$tokensVersion must be a number");
+    }
+    if (tokens.sass != null && typeof tokens.sass !== "string") {
+        errors.push("sass must be a string");
+    }
+    let leafCount = 0;
+    for (const sec of ["colors", "typography", "borders", "components", "custom"]) {
+        const obj = tokens[sec];
+        if (obj == null) {
+            continue;
+        }
+        if (!isPlainObject(obj)) {
+            errors.push(`${sec} must be an object`);
+            continue;
+        }
+        for (const [k, v] of Object.entries(obj)) {
+            leafCount += 1;
+            if (typeof v !== "string") {
+                errors.push(`${sec}.${k} must be a string`);
+            }
+        }
+    }
+    if (leafCount > MAX_TOKENS) {
+        errors.push("too many tokens");
+    }
+    return { ok: errors.length === 0, errors };
+}
+
+
+module.exports = { DEFAULT_TOKENS, deepMerge, normalizeTokens, emptyTokens, tokensAreValid };
diff --git a/lib/themeStore.js b/lib/themeStore.js
new file mode 100644
index 0000000..d0397d7
--- /dev/null
+++ b/lib/themeStore.js
@@ -0,0 +1,308 @@
+// The ONLY module that touches the themes Table or treats builtins as themes.
+// All theme persistence (per-tenant Table CRUD) and the builtins-as-themes merge
+// live here; everything above this layer speaks the canonical ThemeDTO and never
+// sees a raw row. See ARCHITECTURE.md 4.1 (schema), 4.2 (builtins merge),
+// 4.6 (multi-tenant), 6.6 (save CAS + delete semantics).
+//
+// ThemeDTO:
+//   { id, name, engine, tokens(object, normalized), layoutTree(object|null),
+//     version(>=1 rows, 0 builtins), builtin(bool), created_at?, updated_at? }
+
+const crypto = require("crypto");
+
+const db      = require("@saltcorn/data/db");
+const Table   = require("@saltcorn/data/models/table");
+const Field   = require("@saltcorn/data/models/field");
+
+const { THEME_TABLE, ENGINE } = require("./constants");
+const { normalizeTokens }     = require("./themeSchema");
+const builtins                = require("./builtins");
+
+
+// --- column model (ARCHITECTURE.md 4.1) ------------------------------------
+// id (serial pk) is created automatically by Table.create; the stable theme
+// identity is the separate theme_id String column. JSON columns are String
+// (text) because the base plugin registers no JSON type; the store does the
+// stringify/parse itself.
+const FIELD_DEFS = [
+    { name: "theme_id",    type: "String",  required: true, is_unique: true },
+    { name: "name",        type: "String",  required: true },
+    { name: "engine",      type: "String",  required: true },
+    { name: "tokens",      type: "String",  required: true },
+    { name: "layout_tree", type: "String",  required: false },
+    { name: "version",     type: "Integer", required: true },
+    { name: "created_at",  type: "Date",    required: true },
+    { name: "updated_at",  type: "Date",    required: true },
+];
+
+
+function nowIso() {
+    return new Date().toISOString();
+}
+
+
+// Coerce a stored timestamp (Date on PG, text on SQLite) to an ISO string.
+function toIso(v) {
+    if (v == null) {
+        return undefined;
+    }
+    if (v instanceof Date) {
+        return v.toISOString();
+    }
+    return new Date(v).toISOString();
+}
+
+
+// Normalize a builtin's frozen definition into the canonical ThemeDTO. Builtins
+// carry version 0, builtin:true, and no timestamps.
+function builtinToTheme(b) {
+    return {
+        id:         b.id,
+        name:       b.name,
+        engine:     b.engine || ENGINE,
+        tokens:     normalizeTokens(b.tokens),
+        layoutTree: b.layoutTree || null,
+        version:    0,
+        builtin:    true,
+    };
+}
+
+
+// Create the per-tenant Table once. Cheap fast-path when it already exists.
+// All CRUD is tenant-implicit (the Table model schema-qualifies from
+// async-local storage); ensureTable is iterated per tenant by onLoad.
+async function ensureTableForCurrentTenant() {
+    const existing = Table.findOne({ name: THEME_TABLE });
+    if (existing) {
+        return existing;
+    }
+    const table = await Table.create(THEME_TABLE, { min_role_read: 1, min_role_write: 1 });
+    for (const f of FIELD_DEFS) {
+        await Field.create({
+            table:     table,
+            name:      f.name,
+            label:     f.name,
+            type:      f.type,
+            required:  !!f.required,
+            is_unique: !!f.is_unique,
+        });
+    }
+    // Namespacing makes a collision impossible (row ids are uuid v4, builtin
+    // ids are "builtin:<slug>"); assert it so a stored "builtin:" id can never
+    // shadow a code-shipped builtin in list()/getById().
+    const rows = await db.select(THEME_TABLE, {});
+    const clash = rows.find((r) => typeof r.theme_id === "string" && r.theme_id.startsWith("builtin:"));
+    if (clash) {
+        throw new Error(`themeStore: stored theme_id may not start with "builtin:" (${clash.theme_id})`);
+    }
+    return table;
+}
+
+
+// Raw row (stored theme) -> canonical ThemeDTO. JSON columns are parsed here;
+// tokens always pass through normalizeTokens so the compiler sees a current,
+// fully-populated shape. builtin:false for every stored row.
+function rowToTheme(row) {
+    let tokens = {};
+    try {
+        tokens = row.tokens ? JSON.parse(row.tokens) : {};
+    } catch (e) {
+        tokens = {};
+    }
+    let layoutTree = null;
+    if (row.layout_tree) {
+        try {
+            layoutTree = JSON.parse(row.layout_tree);
+        } catch (e) {
+            layoutTree = null;
+        }
+    }
+    return {
+        id:         row.theme_id,
+        name:       row.name,
+        engine:     row.engine || ENGINE,
+        tokens:     normalizeTokens(tokens),
+        layoutTree: layoutTree,
+        version:    row.version,
+        builtin:    false,
+        created_at: toIso(row.created_at),
+        updated_at: toIso(row.updated_at),
+    };
+}
+
+
+// All themes visible to the admin: stored rows PLUS the code-shipped builtins.
+// Builtins are merged at read time so they appear even on a fresh, empty install.
+async function list() {
+    const rows = await db.select(THEME_TABLE, {}, { orderBy: "name" });
+    const stored = rows.map(rowToTheme);
+    const builtinThemes = builtins.listBuiltins().map(builtinToTheme);
+    return [...stored, ...builtinThemes];
+}
+
+
+// Resolve a theme by its public id. SEAM FIX: builtin ids resolve too, so
+// getThemeCss / cssCache.warm / activate handle ANY active theme uniformly
+// (activating a builtin is allowed; ARCHITECTURE.md 4.2).
+async function getById(id) {
+    if (builtins.isBuiltinId(id)) {
+        const b = builtins.get(id);
+        return b ? builtinToTheme(b) : null;
+    }
+    const row = await db.selectMaybeOne(THEME_TABLE, { theme_id: id });
+    return row ? rowToTheme(row) : null;
+}
+
+
+// App-enforced name uniqueness (no DB constraint). Returns the input name if
+// free, else the first available "Name (2)", "Name (3)", ... suffix.
+async function dedupName(name) {
+    const base = (name == null ? "" : String(name)).trim() || "Untitled";
+    const rows = await db.select(THEME_TABLE, {});
+    const taken = new Set(rows.map((r) => r.name));
+    if (!taken.has(base)) {
+        return base;
+    }
+    let n = 2;
+    while (taken.has(`${base} (${n})`)) {
+        n += 1;
+    }
+    return `${base} (${n})`;
+}
+
+
+// Insert a fresh stored theme (uuid theme_id, version 1, timestamps).
+async function create({ name, engine, tokens, layoutTree }) {
+    const themeId = crypto.randomUUID();
+    const finalName = await dedupName(name);
+    const ts = nowIso();
+    await db.insert(THEME_TABLE, {
+        theme_id:    themeId,
+        name:        finalName,
+        engine:      engine || ENGINE,
+        tokens:      JSON.stringify(normalizeTokens(tokens)),
+        layout_tree: layoutTree == null ? null : JSON.stringify(layoutTree),
+        version:     1,
+        created_at:  ts,
+        updated_at:  ts,
+    });
+    return getById(themeId);
+}
+
+
+// Copy an existing theme (stored OR builtin) into a fresh stored row. This is
+// the "load a builtin for edit = duplicate-to-edit" path.
+async function duplicate(id, name) {
+    const src = await getById(id);
+    if (!src) {
+        return null;
+    }
+    const dupName = name != null ? name : `${src.name} copy`;
+    return create({
+        name:       dupName,
+        engine:     src.engine,
+        tokens:     src.tokens,
+        layoutTree: src.layoutTree,
+    });
+}
+
+
+// Positional placeholder for raw parameterized SQL ("$1" on PG, "?" on SQLite).
+// mkWhere is dialect-aware but cannot express version=version+1, so the two
+// version-mutating updates issue raw SQL and pick the placeholder here.
+function ph(n) {
+    return db.isSQLite ? "?" : `$${n}`;
+}
+
+
+// Optimistic compare-and-swap on version: UPDATE ... WHERE theme_id=$ AND
+// version=$base, SET version=version+1. Returns the updated ThemeDTO, or null
+// when no row matched (stale baseVersion / unknown id) so the handler can 409.
+// RETURNING + rows.length is the matched-row count (portable; rowCount is
+// PG-only and absent from the SQLite driver's {rows} result).
+async function casUpdate(id, baseVersion, { tokens, layoutTree }) {
+    const schema = db.getTenantSchemaPrefix();
+    const ts = nowIso();
+    const sql = `update ${schema}"${THEME_TABLE}" `
+        + `set tokens=${ph(1)}, layout_tree=${ph(2)}, version=version+1, updated_at=${ph(3)} `
+        + `where theme_id=${ph(4)} and version=${ph(5)} returning theme_id`;
+    const params = [
+        JSON.stringify(normalizeTokens(tokens)),
+        layoutTree == null ? null : JSON.stringify(layoutTree),
+        ts,
+        id,
+        baseVersion,
+    ];
+    const result = await db.query(sql, params);
+    if (!result || !result.rows || result.rows.length === 0) {
+        return null;
+    }
+    return getById(id);
+}
+
+
+// Unconditional save (force overwrite): bumps version, ignores baseVersion.
+async function forceUpdate(id, { tokens, layoutTree }) {
+    const schema = db.getTenantSchemaPrefix();
+    const ts = nowIso();
+    const sql = `update ${schema}"${THEME_TABLE}" `
+        + `set tokens=${ph(1)}, layout_tree=${ph(2)}, version=version+1, updated_at=${ph(3)} `
+        + `where theme_id=${ph(4)}`;
+    await db.query(sql, [
+        JSON.stringify(normalizeTokens(tokens)),
+        layoutTree == null ? null : JSON.stringify(layoutTree),
+        ts,
+        id,
+    ]);
+    return getById(id);
+}
+
+
+// Rename: name only, app-enforced uniqueness, NO version bump (rename does not
+// touch the optimistic-lock counter; ARCHITECTURE.md 6.7).
+async function rename(id, name) {
+    const finalName = await dedupName(name);
+    const ts = nowIso();
+    await db.updateWhere(THEME_TABLE, { name: finalName, updated_at: ts }, { theme_id: id });
+    return getById(id);
+}
+
+
+// Delete a stored theme by theme_id. Returns whether a row was removed.
+async function remove(id) {
+    const before = await db.selectMaybeOne(THEME_TABLE, { theme_id: id });
+    if (!before) {
+        return false;
+    }
+    await db.deleteWhere(THEME_TABLE, { theme_id: id });
+    return true;
+}
+
+
+// First stored theme that is NOT id, used as a delete-of-active successor.
+// Returns a ThemeDTO or null (caller falls back to builtins.defaultId()).
+async function firstOther(id) {
+    const rows = await db.select(THEME_TABLE, {}, { orderBy: "name" });
+    for (const r of rows) {
+        if (r.theme_id !== id) {
+            return rowToTheme(r);
+        }
+    }
+    return null;
+}
+
+
+module.exports = {
+    ensureTableForCurrentTenant,
+    rowToTheme,
+    list,
+    getById,
+    create,
+    duplicate,
+    casUpdate,
+    forceUpdate,
+    rename,
+    remove,
+    firstOther,
+    dedupName,
+};
diff --git a/lib/tokenSchema.js b/lib/tokenSchema.js
new file mode 100644
index 0000000..5c5a1a9
--- /dev/null
+++ b/lib/tokenSchema.js
@@ -0,0 +1,43 @@
+// The single server-side source of truth for HOW a token maps to CSS. Kept
+// structurally parallel to the SPA TokenManifest. Pure data + caps; no imports.
+//
+//   kind:"bsvar"  -> :root { --bs-<cssVar>: <value>; }   (+ optional --bs-<x>-rgb companion)
+//   kind:"rule"   -> a targeted  selector { prop: value; }  for things --bs-* can't reach
+//   kind:"ignore" -> known-but-not-emitted (forward-compat)
+//
+// Keys are the FLATTENED, kebab-case token names (see compile.flattenTokens,
+// which camel->kebab maps the nested tokens object onto these keys).
+
+const TOKEN_SCHEMA = {
+    primary:           { kind: "bsvar", cssVar: "primary",     derive: ["primary-rgb"] },
+    secondary:         { kind: "bsvar", cssVar: "secondary",   derive: ["secondary-rgb"] },
+    success:           { kind: "bsvar", cssVar: "success",     derive: ["success-rgb"] },
+    info:              { kind: "bsvar", cssVar: "info",        derive: ["info-rgb"] },
+    warning:           { kind: "bsvar", cssVar: "warning",     derive: ["warning-rgb"] },
+    danger:            { kind: "bsvar", cssVar: "danger",      derive: ["danger-rgb"] },
+    light:             { kind: "bsvar", cssVar: "light",       derive: ["light-rgb"] },
+    dark:              { kind: "bsvar", cssVar: "dark",        derive: ["dark-rgb"] },
+    "body-bg":         { kind: "bsvar", cssVar: "body-bg",     derive: ["body-bg-rgb"] },
+    "body-color":      { kind: "bsvar", cssVar: "body-color",  derive: ["body-color-rgb"] },
+    "font-sans-serif": { kind: "bsvar", cssVar: "font-sans-serif" },
+    "font-monospace":  { kind: "bsvar", cssVar: "font-monospace" },
+    "root-font-size":  { kind: "bsvar", cssVar: "root-font-size" },
+    "body-font-size":  { kind: "bsvar", cssVar: "body-font-size" },
+    "body-font-weight":{ kind: "bsvar", cssVar: "body-font-weight" },
+    "body-line-height":{ kind: "bsvar", cssVar: "body-line-height" },
+    "headings-font-family": { kind: "bsvar", cssVar: "headings-font-family" },
+    "border-radius":   { kind: "bsvar", cssVar: "border-radius" },
+    "border-width":    { kind: "bsvar", cssVar: "border-width" },
+    "border-color":    { kind: "bsvar", cssVar: "border-color" },
+    "link-color":      { kind: "bsvar", cssVar: "link-color",  derive: ["link-color-rgb"] },
+    "link-hover-color":{ kind: "bsvar", cssVar: "link-hover-color" },
+    "navbar-bg":       { kind: "rule", selector: ".navbar", prop: "--bs-navbar-bg" },
+    "card-bg":         { kind: "rule", selector: ".card", prop: "--bs-card-bg" },
+    "sidebar-bg":      { kind: "rule", selector: ".sidebar, #accordionSidebar", prop: "background-color" },
+};
+
+const TOKEN_KEY_RE = /^[-a-zA-Z0-9_]{1,64}$/;
+const MAX_VALUE_LEN = 2048;
+const MAX_CSS_BYTES = 512 * 1024;
+
+module.exports = { TOKEN_SCHEMA, TOKEN_KEY_RE, MAX_VALUE_LEN, MAX_CSS_BYTES };
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..580c2fc
--- /dev/null
+++ b/package.json
@@ -0,0 +1,18 @@
+{
+  "name": "theme-builder",
+  "version": "0.0.1",
+  "description": "Saltcorn plugin: visual theme builder (Phase 1 Bootstrap-5 skin overlay; Phase 2 Craft.js layout + optional dart-sass).",
+  "main": "index.js",
+  "scripts": {
+    "test": "node --test test/*.test.js",
+    "test:integration": "./test/runIntegration.sh",
+    "build:ui": "webpack --config builder/webpack.config.js --mode production",
+    "watch:ui": "webpack --config builder/webpack.config.js --watch --mode development"
+  },
+  "engines": { "node": ">=20" },
+  "comment": "@saltcorn/* are provided by the host at runtime (see dev-deploy/idp convention) and are intentionally NOT declared as dependencies. Phase 1 has no third-party runtime deps; Phase 2 adds sass + bootstrap.",
+  "dependencies": {},
+  "devDependencies": {},
+  "author": "Scott Duensing",
+  "license": "MIT"
+}
diff --git a/public/builderApp.js b/public/builderApp.js
new file mode 100644
index 0000000..a7ea77f
--- /dev/null
+++ b/public/builderApp.js
@@ -0,0 +1,1346 @@
+/* theme-builder / public/builderApp.js
+ *
+ * BUILDLESS, dependency-free Phase-1 editor (vanilla ES2020, no React, no build
+ * step). This is the shipping Phase-1 UI: the committed artifact served at
+ * /plugins/public/theme-builder/builderApp.js. The Phase-2 React + Craft.js
+ * source tree (builder/src) compiles into this same path later; until then this
+ * hand-written file IS the bundle.
+ *
+ * Contract (ARCHITECTURE.md 8):
+ *  - window.__TB__ = { apiBase, cssRoute, csrfToken, base, openThemeId } is set
+ *    by the shell (lib/page.js).
+ *  - MANAGER panel: GET /api/state -> list themes (active + builtin badges);
+ *    buttons New, Duplicate, Rename, Delete, Activate, Export, Import-file
+ *    (8.8). Top toolbar: New, Import.
+ *  - TOKEN panel: color/font/spacing inputs rendered FROM the manifest, with a
+ *    LIVE PREVIEW iframe whose --bs-* custom properties (and rule-based tokens)
+ *    are rewritten on every edit -- the SAME overlay mechanism production uses
+ *    on activate, so WYSIWYG with zero compile (8.6).
+ *  - Save (POST /api/themes/:id/save {tokens, layoutTree, baseVersion}) and
+ *    Activate (POST /api/themes/:id/activate {role}) are SEPARATE actions: load
+ *    and edit NEVER touch the live site; only Activate publishes (1.4 / 8.3).
+ *  - CSRF: sent as the "CSRF-Token" header on every POST (8.2 / api.js 8.4).
+ *
+ * The server TokenManifest is flat, kebab-keyed:
+ *   manifest.tokens[<kebabKey>] = { kind, cssVar, selector, prop, derive[], default }
+ * (lib/apiState.buildManifest). A theme's `tokens` is NESTED + camelCase by
+ * section: { colors:{primary,...}, typography:{...}, borders:{...},
+ * components:{...}, custom:{...} } (lib/themeSchema.DEFAULT_TOKENS). The editor
+ * works in the flat space for editing/preview and round-trips into the nested
+ * shape on read/save, matching compile.flattenTokens (camel<->kebab).
+ */
+(function () {
+  "use strict";
+
+  var TB = window.__TB__ || {};
+  var API = TB.apiBase || "/theme-builder/api";
+  var CSS_ROUTE = TB.cssRoute || "/theme-builder/theme.css";
+  var CSRF = TB.csrfToken || "";
+
+  // ---- token <-> manifest mapping -----------------------------------------
+
+  // The nested-token sections the compiler flattens (compile.FLAT_SECTIONS).
+  var FLAT_SECTIONS = ["colors", "typography", "borders", "components"];
+
+  // Explicit section for each known kebab token key. Mirrors the shape of
+  // DEFAULT_TOKENS + TOKEN_SCHEMA so that a value edited in the flat space lands
+  // in the correct nested section on save. Keys not listed here fall back to the
+  // classifier below.
+  var SECTION_OF = {
+    "primary": "colors", "secondary": "colors", "success": "colors",
+    "info": "colors", "warning": "colors", "danger": "colors",
+    "light": "colors", "dark": "colors",
+    "body-bg": "colors", "body-color": "colors",
+    "link-color": "colors", "link-hover-color": "colors", "border-color": "colors",
+    "font-sans-serif": "typography", "font-monospace": "typography",
+    "root-font-size": "typography", "body-font-size": "typography",
+    "body-font-weight": "typography", "body-line-height": "typography",
+    "headings-font-family": "typography",
+    "border-radius": "borders", "border-width": "borders",
+    "navbar-bg": "components", "card-bg": "components", "sidebar-bg": "components"
+  };
+
+  // kebab-case -> camelCase (inverse of compile.camelToKebab).
+  function kebabToCamel(key) {
+    return String(key).replace(/-([a-z0-9])/g, function (_m, c) {
+      return c.toUpperCase();
+    });
+  }
+
+  // camelCase -> kebab-case (compile.camelToKebab).
+  function camelToKebab(key) {
+    return String(key).replace(/[A-Z]/g, function (m) {
+      return "-" + m.toLowerCase();
+    });
+  }
+
+  // Decide the nested section for a flat key. Rule/components first, then color
+  // pickers, then anything font/size/weight/line -> typography, border ->
+  // borders, default colors.
+  function sectionForKey(key, desc) {
+    if (SECTION_OF[key]) return SECTION_OF[key];
+    if (desc && desc.kind === "rule") return "components";
+    if (/font|size|weight|line|family/.test(key)) return "typography";
+    if (/^border/.test(key)) return "borders";
+    if (/(color|bg)$/.test(key) || /^(color|bg)/.test(key)) return "colors";
+    return "components";
+  }
+
+  // Flatten a nested+camel tokens object into a flat kebab map (mirrors
+  // compile.flattenTokens). custom/$tokensVersion are left out of the editor.
+  function flatten(tokens) {
+    var flat = {};
+    if (!tokens || typeof tokens !== "object") return flat;
+    for (var i = 0; i < FLAT_SECTIONS.length; i++) {
+      var sec = tokens[FLAT_SECTIONS[i]];
+      if (!sec || typeof sec !== "object") continue;
+      for (var k in sec) {
+        if (!Object.prototype.hasOwnProperty.call(sec, k)) continue;
+        if (sec[k] != null) flat[camelToKebab(k)] = sec[k];
+      }
+    }
+    return flat;
+  }
+
+  // Rebuild a nested+camel tokens object from a flat kebab map, preserving the
+  // base theme's custom/$tokensVersion and any sections we don't edit.
+  function nest(flat, base, manifest) {
+    var out = {};
+    // shallow-clone the base so custom/$tokensVersion/etc survive a save.
+    if (base && typeof base === "object") {
+      for (var bk in base) {
+        if (!Object.prototype.hasOwnProperty.call(base, bk)) continue;
+        if (typeof base[bk] === "object" && base[bk] !== null) {
+          out[bk] = {};
+          for (var bj in base[bk]) {
+            if (Object.prototype.hasOwnProperty.call(base[bk], bj)) out[bk][bj] = base[bk][bj];
+          }
+        } else {
+          out[bk] = base[bk];
+        }
+      }
+    }
+    for (var key in flat) {
+      if (!Object.prototype.hasOwnProperty.call(flat, key)) continue;
+      var desc = manifest && manifest.tokens ? manifest.tokens[key] : null;
+      var sec = sectionForKey(key, desc);
+      if (!out[sec] || typeof out[sec] !== "object") out[sec] = {};
+      out[sec][kebabToCamel(key)] = flat[key];
+    }
+    return out;
+  }
+
+  // ---- live-preview overlay (PRODUCTION PARITY) ---------------------------
+  // Replicates compile.emitOverlayCss exactly: bsvar -> :root{--bs-<cssVar>:v}
+  // (+ --bs-<cssVar>-rgb companion when the token derives and the value is a
+  // hex color), rule -> <selector>{<prop>: v}. No compile, no network.
+
+  function deriveRgb(value) {
+    if (typeof value !== "string") return null;
+    var s = value.trim();
+    var m6 = /^#([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/.exec(s);
+    var m3 = /^#([0-9a-fA-F])([0-9a-fA-F])([0-9a-fA-F])$/.exec(s);
+    var r, g, b;
+    if (m6) {
+      r = parseInt(m6[1], 16); g = parseInt(m6[2], 16); b = parseInt(m6[3], 16);
+    } else if (m3) {
+      r = parseInt(m3[1] + m3[1], 16); g = parseInt(m3[2] + m3[2], 16); b = parseInt(m3[3] + m3[3], 16);
+    } else {
+      return null;
+    }
+    return r + ", " + g + ", " + b;
+  }
+
+  // Build the overlay CSS text from the flat tokens + manifest.
+  function overlayCss(flat, manifest) {
+    var rootDecls = [];
+    var rules = [];
+    var tokens = (manifest && manifest.tokens) || {};
+    for (var key in flat) {
+      if (!Object.prototype.hasOwnProperty.call(flat, key)) continue;
+      var v = flat[key];
+      if (v == null || v === "") continue;
+      var desc = tokens[key];
+      if (desc && desc.kind === "bsvar" && desc.cssVar) {
+        rootDecls.push("--bs-" + desc.cssVar + ": " + v + ";");
+        if (desc.derive && desc.derive.length) {
+          var rgb = deriveRgb(v);
+          if (rgb != null) rootDecls.push("--bs-" + desc.cssVar + "-rgb: " + rgb + ";");
+        }
+      } else if (desc && desc.kind === "rule" && desc.selector && desc.prop) {
+        rules.push(desc.selector + "{" + desc.prop + ": " + v + ";}");
+      } else if (!desc) {
+        rootDecls.push("--tb-" + key + ": " + v + ";");
+      }
+    }
+    var css = "";
+    if (rootDecls.length) css += ":root, [data-bs-theme]{" + rootDecls.join("") + "}\n";
+    if (rules.length) css += rules.join("\n") + "\n";
+    return css;
+  }
+
+  // ---- tiny DOM helpers ----------------------------------------------------
+
+  function el(tag, attrs, children) {
+    var node = document.createElement(tag);
+    if (attrs) {
+      for (var a in attrs) {
+        if (!Object.prototype.hasOwnProperty.call(attrs, a)) continue;
+        if (a === "class") node.className = attrs[a];
+        else if (a === "text") node.textContent = attrs[a];
+        else if (a === "html") node.innerHTML = attrs[a];
+        else if (a.slice(0, 2) === "on" && typeof attrs[a] === "function") node.addEventListener(a.slice(2).toLowerCase(), attrs[a]);
+        else if (attrs[a] != null && attrs[a] !== false) node.setAttribute(a, attrs[a] === true ? "" : attrs[a]);
+      }
+    }
+    if (children != null) {
+      var list = Array.isArray(children) ? children : [children];
+      for (var i = 0; i < list.length; i++) {
+        var c = list[i];
+        if (c == null) continue;
+        node.appendChild(typeof c === "string" ? document.createTextNode(c) : c);
+      }
+    }
+    return node;
+  }
+
+  function clear(node) {
+    while (node.firstChild) node.removeChild(node.firstChild);
+  }
+
+  // ---- REST adapter (8.4) --------------------------------------------------
+  // CSRF is sent as the "CSRF-Token" header on every request; X-Requested-With +
+  // Accept force JSON handling server-side. POSTs never run unless the user
+  // explicitly clicks Save/Activate/etc -- editing is purely local.
+
+  function request(method, path, body) {
+    var headers = {
+      "Content-Type": "application/json",
+      "X-Requested-With": "XMLHttpRequest",
+      "Accept": "application/json",
+      "CSRF-Token": CSRF
+    };
+    return fetch(API + path, {
+      method: method,
+      headers: headers,
+      credentials: "same-origin",
+      body: body ? JSON.stringify(body) : undefined
+    }).then(function (r) {
+      var ct = r.headers.get("content-type") || "";
+      var parse = ct.indexOf("json") >= 0 ? r.json() : r.text();
+      return parse.then(function (data) {
+        if (!r.ok) {
+          var msg = (data && data.error && data.error.message) || r.statusText || ("HTTP " + r.status);
+          var err = new Error(msg);
+          err.status = r.status;
+          err.body = data;
+          throw err;
+        }
+        return data;
+      }, function () {
+        if (!r.ok) throw new Error(r.statusText || ("HTTP " + r.status));
+        return null;
+      });
+    });
+  }
+
+  var api = {
+    state: function () { return request("GET", "/state"); },
+    load: function (id) { return request("GET", "/themes/" + encodeURIComponent(id)); },
+    create: function (b) { return request("POST", "/themes", b); },
+    duplicate: function (id, b) { return request("POST", "/themes/" + encodeURIComponent(id) + "/duplicate", b); },
+    save: function (id, b) { return request("POST", "/themes/" + encodeURIComponent(id) + "/save", b); },
+    rename: function (id, name) { return request("POST", "/themes/" + encodeURIComponent(id) + "/rename", { name: name }); },
+    remove: function (id, autoSwitch) { return request("POST", "/themes/" + encodeURIComponent(id) + "/delete", { autoSwitch: autoSwitch }); },
+    activate: function (id, role) { return request("POST", "/themes/" + encodeURIComponent(id) + "/activate", { role: role }); },
+    exportUrl: function (id) { return API + "/themes/" + encodeURIComponent(id) + "/export"; }
+  };
+
+  // Compile the draft tokens to the FULL production overlay CSS server-side, so
+  // the preview is WYSIWYG -- including the deep button rules (.btn-primary etc.)
+  // the client-side overlayCss() cannot synthesize. POSTs { tokens } and returns
+  // the text/css body. CSRF + X-Requested-With as on every POST; this is preview
+  // only -- it never saves or activates.
+  function previewCss(tokens) {
+    return fetch(API + "/preview-css", {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        "X-Requested-With": "XMLHttpRequest",
+        "CSRF-Token": CSRF
+      },
+      credentials: "same-origin",
+      body: JSON.stringify({ tokens: tokens })
+    }).then(function (r) {
+      if (!r.ok) throw new Error(r.statusText || ("HTTP " + r.status));
+      return r.text();
+    });
+  }
+
+  // multipart import: file field "file", CSRF header, JSON response.
+  function importFile(file) {
+    var fd = new FormData();
+    fd.append("file", file, file.name || "theme.json");
+    return fetch(API + "/import", {
+      method: "POST",
+      headers: { "X-Requested-With": "XMLHttpRequest", "Accept": "application/json", "CSRF-Token": CSRF },
+      credentials: "same-origin",
+      body: fd
+    }).then(function (r) {
+      return r.json().catch(function () { return {}; }).then(function (data) {
+        if (!r.ok) throw new Error((data && data.error && data.error.message) || r.statusText);
+        return data;
+      });
+    });
+  }
+
+  // ---- application state ---------------------------------------------------
+
+  var state = {
+    view: "manager",          // "manager" | "editor"
+    panel: "tokens",          // "tokens" | "layout" -- "layout" only when caps.layoutMode (8.3)
+    themes: [],
+    activeThemeId: null,
+    manifest: { tokens: {} },
+    caps: { layoutMode: false },
+    layoutMode: false,
+    layoutPresets: [],        // [{ id, label, tree }] full layout-tree JSON per preset (8.5)
+    open: null                // { id, name, builtin, baseFlat, draftFlat, baseTokens, layoutTree, baseLayoutTree, version, dirty }
+  };
+
+  var root = null;
+  var statusBar = null;
+
+  function setStatus(msg, kind) {
+    if (!statusBar) return;
+    statusBar.textContent = msg || "";
+    statusBar.className = "tb-status" + (kind ? " tb-status-" + kind : "");
+  }
+
+  function fail(e) {
+    setStatus((e && e.message) || "Request failed", "error");
+  }
+
+  // ---- data loads ----------------------------------------------------------
+
+  function refreshState() {
+    return api.state().then(function (s) {
+      state.themes = s.themes || [];
+      state.activeThemeId = s.activeThemeId || null;
+      state.manifest = s.manifest || { tokens: {} };
+      state.caps = s.caps || { layoutMode: false };
+      state.layoutMode = !!s.layoutMode || !!state.caps.layoutMode;
+      state.layoutPresets = s.layoutPresets || [];
+      render();
+      return s;
+    }).catch(fail);
+  }
+
+  function openTheme(id) {
+    return api.load(id).then(function (res) {
+      var t = res.theme;
+      var flat = flatten(t.tokens);
+      state.open = {
+        id: t.id,
+        name: t.name,
+        builtin: !!t.builtin,
+        readOnly: !!res.readOnly,
+        baseTokens: t.tokens,
+        baseFlat: flat,
+        draftFlat: copyFlat(flat),
+        // working layout tree (deep copy) + a base snapshot for save/dirty tracking.
+        layoutTree: deepCopy(t.layoutTree) || null,
+        baseLayoutTree: deepCopy(t.layoutTree) || null,
+        version: t.version,
+        dirty: false
+      };
+      state.panel = "tokens";
+      state.view = "editor";
+      render();
+      setStatus(state.open.builtin
+        ? "Opened built-in (read-only) -- first Save creates an editable copy."
+        : "Opened \"" + t.name + "\".");
+    }).catch(fail);
+  }
+
+  function copyFlat(flat) {
+    var out = {};
+    for (var k in flat) {
+      if (Object.prototype.hasOwnProperty.call(flat, k)) out[k] = flat[k];
+    }
+    return out;
+  }
+
+  // structural deep copy for layout trees (plain JSON: object/array/scalar). Used
+  // so selecting a preset hands the open theme an independent copy of its tree.
+  function deepCopy(value) {
+    if (value == null) return value;
+    if (typeof structuredClone === "function") return structuredClone(value);
+    return JSON.parse(JSON.stringify(value));
+  }
+
+  // structural equality for layout trees (order-sensitive JSON compare). Used to
+  // tell which preset (if any) matches the open theme's current layoutTree.
+  function treesEqual(a, b) {
+    if (a == null && b == null) return true;
+    if (a == null || b == null) return false;
+    return JSON.stringify(a) === JSON.stringify(b);
+  }
+
+  // ---- editor: save & activate (SEPARATE actions) --------------------------
+
+  function doSave(thenActivate) {
+    var o = state.open;
+    if (!o) return;
+    var nestedTokens = nest(o.draftFlat, o.baseTokens, state.manifest);
+
+    function persist(targetId, baseVersion, force) {
+      return api.save(targetId, {
+        tokens: nestedTokens,
+        // the chosen layout (preset deep-copy or the theme's original) persists
+        // here alongside tokens; null when the theme has no layout tree (8.3 / 8.7).
+        layoutTree: o.layoutTree || null,
+        baseVersion: baseVersion,
+        force: force || undefined
+      });
+    }
+
+    var chain;
+    if (o.builtin) {
+      // builtin is read-only: duplicate to an editable row, then save into it.
+      setStatus("Creating an editable copy...");
+      chain = api.duplicate(o.id, { name: o.name + " (copy)" }).then(function (res) {
+        var nt = res.theme;
+        o.id = nt.id;
+        o.builtin = false;
+        o.readOnly = false;
+        o.name = nt.name;
+        o.version = nt.version;
+        return persist(nt.id, nt.version);
+      });
+    } else {
+      chain = persist(o.id, o.version);
+    }
+
+    chain.then(function (res) {
+      var t = res.theme;
+      o.version = t.version;
+      o.name = t.name;
+      o.baseTokens = t.tokens;
+      o.baseFlat = flatten(t.tokens);
+      o.draftFlat = copyFlat(o.baseFlat);
+      o.layoutTree = deepCopy(t.layoutTree) || null;
+      o.baseLayoutTree = deepCopy(t.layoutTree) || null;
+      o.dirty = false;
+      setStatus("Saved \"" + t.name + "\" (v" + t.version + "). The live site is unchanged.", "ok");
+      render();
+      if (thenActivate) doActivate();
+      else refreshState();
+    }).catch(function (e) {
+      if (e.status === 409 && e.body && e.body.error) {
+        var cur = e.body.error.currentVersion;
+        if (window.confirm("This theme was changed elsewhere (current v" + cur +
+          ", you have v" + o.version + ").\nOK = overwrite with your edits, Cancel = reload theirs.")) {
+          persist(o.id, o.version, true).then(function (res2) {
+            var t2 = res2.theme;
+            o.version = t2.version;
+            o.baseTokens = t2.tokens;
+            o.baseFlat = flatten(t2.tokens);
+            o.draftFlat = copyFlat(o.baseFlat);
+            o.layoutTree = deepCopy(t2.layoutTree) || null;
+            o.baseLayoutTree = deepCopy(t2.layoutTree) || null;
+            o.dirty = false;
+            setStatus("Overwrote with your edits (v" + t2.version + ").", "ok");
+            render();
+            if (thenActivate) doActivate();
+            else refreshState();
+          }).catch(fail);
+        } else {
+          openTheme(o.id);
+        }
+      } else {
+        fail(e);
+      }
+    });
+  }
+
+  // The ONLY action that publishes to the live site.
+  function doActivate(id) {
+    var targetId = id || (state.open && state.open.id);
+    if (!targetId) return;
+    setStatus("Activating...");
+    return api.activate(targetId, null).then(function () {
+      setStatus("Activated. The live site now serves this theme.", "ok");
+      return refreshState();
+    }).catch(fail);
+  }
+
+  // ---- manager actions -----------------------------------------------------
+
+  function actNew() {
+    var name = window.prompt("Name for the new theme:", "New theme");
+    if (name == null) return;
+    name = name.trim();
+    if (!name) return;
+    api.create({ name: name, engine: state.caps.engine }).then(function (res) {
+      return refreshState().then(function () { return openTheme(res.theme.id); });
+    }).catch(fail);
+  }
+
+  function actDuplicate(item) {
+    var name = window.prompt("Name for the duplicate:", item.name + " (copy)");
+    if (name == null) return;
+    api.duplicate(item.id, { name: name.trim() || undefined }).then(function () {
+      return refreshState();
+    }).catch(fail);
+  }
+
+  function actRename(item) {
+    if (item.builtin) { setStatus("Built-in themes cannot be renamed.", "error"); return; }
+    var name = window.prompt("Rename theme:", item.name);
+    if (name == null) return;
+    name = name.trim();
+    if (!name) return;
+    api.rename(item.id, name).then(function () { return refreshState(); }).catch(fail);
+  }
+
+  function actDelete(item) {
+    if (item.builtin) { setStatus("Built-in themes cannot be deleted.", "error"); return; }
+    var autoSwitch = false;
+    if (item.active) {
+      if (!window.confirm("\"" + item.name + "\" is ACTIVE. Deleting it will switch the live site to another theme first. Continue?")) return;
+      autoSwitch = true;
+    } else if (!window.confirm("Delete \"" + item.name + "\"? This cannot be undone.")) {
+      return;
+    }
+    api.remove(item.id, autoSwitch).then(function () {
+      setStatus("Deleted \"" + item.name + "\".", "ok");
+      return refreshState();
+    }).catch(fail);
+  }
+
+  function actImport(file) {
+    if (!file) return;
+    setStatus("Importing " + file.name + "...");
+    importFile(file).then(function () {
+      setStatus("Imported \"" + file.name + "\".", "ok");
+      return refreshState();
+    }).catch(fail);
+  }
+
+  // ---- rendering -----------------------------------------------------------
+
+  function badge(text, cls) {
+    return el("span", { "class": "tb-badge tb-badge-" + cls, text: text });
+  }
+
+  function button(label, onClick, opts) {
+    opts = opts || {};
+    var attrs = { "class": "tb-btn" + (opts.primary ? " tb-btn-primary" : "") + (opts.danger ? " tb-btn-danger" : ""), type: "button" };
+    if (opts.disabled) attrs.disabled = true;
+    if (opts.title) attrs.title = opts.title;
+    var b = el("button", attrs, label);
+    if (!opts.disabled) b.addEventListener("click", onClick);
+    return b;
+  }
+
+  function renderManager() {
+    var wrap = el("div", { "class": "tb-manager" });
+
+    // top toolbar: New + Import (8.8)
+    var toolbar = el("div", { "class": "tb-toolbar" });
+    toolbar.appendChild(el("h1", { "class": "tb-title", text: "Theme Builder" }));
+    var spacer = el("div", { "class": "tb-spacer" });
+    toolbar.appendChild(spacer);
+    toolbar.appendChild(button("New", actNew, { primary: true }));
+
+    var fileInput = el("input", { type: "file", accept: ".json,application/json", "class": "tb-file" });
+    fileInput.addEventListener("change", function () {
+      if (fileInput.files && fileInput.files[0]) actImport(fileInput.files[0]);
+      fileInput.value = "";
+    });
+    var importBtn = button("Import...", function () { fileInput.click(); });
+    toolbar.appendChild(importBtn);
+    toolbar.appendChild(fileInput);
+    wrap.appendChild(toolbar);
+
+    // theme table
+    var table = el("table", { "class": "tb-table" });
+    var thead = el("thead", null, el("tr", null, [
+      el("th", { text: "Theme" }),
+      el("th", { text: "Engine" }),
+      el("th", { "class": "tb-actions-col", text: "Actions" })
+    ]));
+    table.appendChild(thead);
+    var tbody = el("tbody");
+
+    state.themes.forEach(function (item) {
+      var nameCell = el("td", null);
+      nameCell.appendChild(el("span", { "class": "tb-name", text: item.name }));
+      if (item.active) nameCell.appendChild(badge("active", "active"));
+      if (item.builtin) nameCell.appendChild(badge("built-in", "builtin"));
+
+      var actions = el("td", { "class": "tb-actions" });
+      // Activate -- always (8.8). The only publishing action.
+      actions.appendChild(button("Activate", function () { doActivate(item.id); }, {
+        disabled: item.active, title: item.active ? "Already active" : "Make this the live theme"
+      }));
+      // Load/Edit -- always; builtin opens read-only.
+      actions.appendChild(button(item.builtin ? "Edit (copy)" : "Edit", function () { openTheme(item.id); }));
+      // Duplicate -- always.
+      actions.appendChild(button("Duplicate", function () { actDuplicate(item); }));
+      // Rename -- not builtin.
+      actions.appendChild(button("Rename", function () { actRename(item); }, { disabled: item.builtin }));
+      // Delete -- not builtin (active needs autoSwitch confirm).
+      actions.appendChild(button("Delete", function () { actDelete(item); }, { disabled: item.builtin, danger: true }));
+      // Export -- always, plain download link.
+      actions.appendChild(el("a", { "class": "tb-btn tb-btn-link", href: api.exportUrl(item.id), download: "" }, "Export"));
+
+      var tr = el("tr", { "class": item.active ? "tb-row-active" : "" }, [nameCell,
+        el("td", { text: item.engine || "" }), actions]);
+      tbody.appendChild(tr);
+    });
+
+    if (!state.themes.length) {
+      tbody.appendChild(el("tr", null, el("td", { colspan: "3", "class": "tb-empty", text: "No themes yet. Click New or Import." })));
+    }
+    table.appendChild(tbody);
+    wrap.appendChild(table);
+    return wrap;
+  }
+
+  // group flat manifest keys into UI sections for the token panel.
+  function manifestGroups() {
+    var groups = { colors: [], fonts: [], spacing: [], other: [] };
+    var tokens = state.manifest.tokens || {};
+    for (var key in tokens) {
+      if (!Object.prototype.hasOwnProperty.call(tokens, key)) continue;
+      var desc = tokens[key];
+      var g;
+      if (/color|bg|primary|secondary|success|info|warning|danger|light|dark|link/.test(key)) g = "colors";
+      else if (/font|family|weight/.test(key)) g = "fonts";
+      else if (/size|line|radius|width|spac/.test(key)) g = "spacing";
+      else g = "other";
+      groups[g].push({ key: key, desc: desc });
+    }
+    return [
+      { id: "colors", label: "Colors", items: groups.colors },
+      { id: "fonts", label: "Typography", items: groups.fonts },
+      { id: "spacing", label: "Spacing & borders", items: groups.spacing },
+      { id: "other", label: "Other", items: groups.other }
+    ].filter(function (s) { return s.items.length; });
+  }
+
+  function pickerKind(key, desc) {
+    if (/color|bg$|^bg/.test(key) || (desc && desc.derive && desc.derive.length)) {
+      // colors are hex pickers; but font/family keys never are
+      if (!/font|family/.test(key)) return "color";
+    }
+    if (/font|family/.test(key)) return "font";
+    return "text";
+  }
+
+  function tokenInput(key, desc) {
+    var o = state.open;
+    var current = o.draftFlat[key];
+    if (current == null) current = (desc && desc.default != null) ? desc.default : "";
+    var kind = pickerKind(key, desc);
+    var label = el("label", { "class": "tb-field" });
+    label.appendChild(el("span", { "class": "tb-field-label", text: prettyLabel(key) }));
+
+    var row = el("div", { "class": "tb-field-row" });
+    var textInput = el("input", { type: "text", "class": "tb-input", value: current });
+
+    function commit(val) {
+      setToken(key, val);
+      if (textInput.value !== val) textInput.value = val;
+    }
+
+    if (kind === "color") {
+      var hex = /^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(current) ? current : "#000000";
+      var colorInput = el("input", { type: "color", "class": "tb-color", value: hex });
+      colorInput.addEventListener("input", function () { commit(colorInput.value); });
+      row.appendChild(colorInput);
+      textInput.addEventListener("input", function () {
+        commit(textInput.value);
+        if (/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(textInput.value)) colorInput.value = textInput.value;
+      });
+    } else {
+      textInput.addEventListener("input", function () { commit(textInput.value); });
+    }
+    row.appendChild(textInput);
+
+    if (desc && (desc.cssVar || desc.prop)) {
+      var hint = desc.kind === "rule"
+        ? (desc.selector + " { " + desc.prop + " }")
+        : ("--bs-" + desc.cssVar);
+      label.appendChild(el("span", { "class": "tb-field-hint", text: hint }));
+    }
+    label.appendChild(row);
+    return label;
+  }
+
+  function prettyLabel(key) {
+    return String(key).replace(/-/g, " ").replace(/\b\w/g, function (c) { return c.toUpperCase(); });
+  }
+
+  function setToken(key, value) {
+    var o = state.open;
+    if (!o) return;
+    if (value === "" || value == null) delete o.draftFlat[key];
+    else o.draftFlat[key] = value;
+    o.dirty = true;
+    applyPreview();
+    syncEditorChrome();
+  }
+
+  // find the preset (if any) whose tree matches the open theme's current
+  // layoutTree; returns the preset id, or null for custom/none.
+  function matchedPresetId() {
+    var o = state.open;
+    if (!o || o.layoutTree == null) return null;
+    for (var i = 0; i < state.layoutPresets.length; i++) {
+      if (treesEqual(state.layoutPresets[i].tree, o.layoutTree)) return state.layoutPresets[i].id;
+    }
+    return null;
+  }
+
+  // Apply a preset to the OPEN theme: working layoutTree = deep copy of the
+  // preset tree, mark dirty. Does NOT save or activate (8.3 / 8.7).
+  function setLayoutPreset(presetId) {
+    var o = state.open;
+    if (!o) return;
+    var preset = null;
+    for (var i = 0; i < state.layoutPresets.length; i++) {
+      if (state.layoutPresets[i].id === presetId) { preset = state.layoutPresets[i]; break; }
+    }
+    if (!preset) return;
+    o.layoutTree = deepCopy(preset.tree);
+    o.dirty = true;
+    render();
+    setStatus("Layout set to \"" + preset.label + "\". Save to persist; the live site is unchanged.");
+  }
+
+  // a single panel-selector tab; switching panels keeps all working edits.
+  function panelTab(id, label) {
+    var active = state.panel === id;
+    var attrs = { "class": "tb-tab" + (active ? " tb-tab-active" : ""), type: "button" };
+    if (active) attrs["aria-current"] = "true";
+    var b = el("button", attrs, label);
+    b.addEventListener("click", function () {
+      if (state.panel === id) return;
+      state.panel = id;
+      render();
+    });
+    return b;
+  }
+
+  // the Phase-1 token editor panel (color/font/spacing inputs from the manifest).
+  function renderTokenPanel() {
+    var o = state.open;
+    var panel = el("div", { "class": "tb-token-panel" });
+    if (o.builtin) {
+      panel.appendChild(el("div", { "class": "tb-readonly-note",
+        text: "This is a built-in theme. Editing is allowed; your first Save creates an editable copy and leaves the original untouched." }));
+    }
+    manifestGroups().forEach(function (sec) {
+      var fs = el("fieldset", { "class": "tb-section" });
+      fs.appendChild(el("legend", { text: sec.label }));
+      sec.items.forEach(function (it) { fs.appendChild(tokenInput(it.key, it.desc)); });
+      panel.appendChild(fs);
+    });
+    return panel;
+  }
+
+  // ---- structural region editor (layout mode) -----------------------------
+  // The region node types the admin may compose into Root.children, each with the
+  // exact props the resolver understands (layoutTree.js schema). The order here is
+  // the order offered in the "Add region" dropdown.
+
+  var REGION_TYPES = ["Navbar", "Sidebar", "Content", "Footer"];
+
+  // The Bootstrap contextual colors a Navbar/Sidebar bg may use; "" = none (omit).
+  var BG_COLORS = ["primary", "secondary", "success", "info", "warning", "danger", "light", "dark"];
+
+  // A sensible-default node for each region type (mirrors the preset defaults in
+  // layoutTree.js). Returned fresh per call so each Add gets its own props object.
+  function defaultRegion(type) {
+    if (type === "Navbar") {
+      return { type: "Navbar", props: { variant: "dark", bg: "primary", expand: "lg", brand: true, menu: true, fluid: false } };
+    }
+    if (type === "Sidebar") {
+      return { type: "Sidebar", props: { variant: "dark", bg: "dark", brand: true, menu: true, width: "240px" } };
+    }
+    if (type === "Content") {
+      return { type: "Content", props: { container: "container", grow: false } };
+    }
+    if (type === "Footer") {
+      return { type: "Footer", props: { text: "" } };
+    }
+    return { type: type, props: {} };
+  }
+
+  // The PROP CONTROLS each region type exposes, in render order. control is one of
+  // "select" (with options), "check" (boolean), or "text". This single table drives
+  // the inline settings UI so the rendering loop stays declarative.
+  function regionFields(type) {
+    if (type === "Navbar") {
+      return [
+        { key: "variant", control: "select", options: ["light", "dark"] },
+        { key: "bg", control: "select", options: BG_COLORS, allowNone: true },
+        { key: "expand", control: "select", options: ["sm", "md", "lg", "xl", "xxl"] },
+        { key: "brand", control: "check" },
+        { key: "menu", control: "check" },
+        { key: "fluid", control: "check" }
+      ];
+    }
+    if (type === "Sidebar") {
+      return [
+        { key: "variant", control: "select", options: ["light", "dark"] },
+        { key: "bg", control: "select", options: BG_COLORS, allowNone: true },
+        { key: "brand", control: "check" },
+        { key: "menu", control: "check" },
+        { key: "width", control: "text", placeholder: "240px" }
+      ];
+    }
+    if (type === "Content") {
+      return [
+        { key: "container", control: "select", options: ["container", "fluid"] },
+        { key: "grow", control: "check" }
+      ];
+    }
+    if (type === "Footer") {
+      return [
+        { key: "text", control: "text", placeholder: "Footer text" }
+      ];
+    }
+    return [];
+  }
+
+  // The working list of region nodes (Root.children) for the open theme, always an
+  // array. Edits mutate these node objects in place; rebuildLayoutTree() then wraps
+  // them back into a fresh Root with the derived className.
+  function layoutChildren() {
+    var o = state.open;
+    if (!o || !o.layoutTree || !Array.isArray(o.layoutTree.children)) return [];
+    return o.layoutTree.children;
+  }
+
+  // Count Content regions in the working children -- used to enforce exactly one.
+  function contentCount() {
+    var kids = layoutChildren();
+    var n = 0;
+    for (var i = 0; i < kids.length; i++) {
+      if (kids[i] && kids[i].type === "Content") n += 1;
+    }
+    return n;
+  }
+
+  // Rebuild open.layoutTree from a children array: a fresh Root whose className is
+  // derived from the regions (a Sidebar => horizontal flex, else vertical column),
+  // mark the editor dirty (same path setToken uses). Never saves/activates (8.7).
+  function rebuildLayoutTree(children) {
+    var o = state.open;
+    if (!o) return;
+    var hasSidebar = false;
+    for (var i = 0; i < children.length; i++) {
+      if (children[i] && children[i].type === "Sidebar") { hasSidebar = true; break; }
+    }
+    var className = hasSidebar ? "min-vh-100 d-flex" : "min-vh-100 d-flex flex-column";
+    o.layoutTree = { type: "Root", props: { className: className }, children: children };
+    o.dirty = true;
+  }
+
+  // Set one prop on a region node, then rebuild + re-render. Empty string clears
+  // the prop (so an omitted bg / blank footer text drops out of the node).
+  function setRegionProp(node, key, value) {
+    if (!node.props || typeof node.props !== "object") node.props = {};
+    if (value === "" || value == null) delete node.props[key];
+    else node.props[key] = value;
+    rebuildLayoutTree(layoutChildren());
+    render();
+  }
+
+  // Move a region up/down within Root.children (dir = -1 or +1), then rebuild.
+  function moveRegion(index, dir) {
+    var kids = layoutChildren().slice();
+    var target = index + dir;
+    if (target < 0 || target >= kids.length) return;
+    var tmp = kids[index];
+    kids[index] = kids[target];
+    kids[target] = tmp;
+    rebuildLayoutTree(kids);
+    render();
+  }
+
+  // Remove a region. Refuses to remove the last Content (the resolver requires
+  // exactly one); warns instead, leaving the tree untouched.
+  function removeRegion(index) {
+    var kids = layoutChildren().slice();
+    var node = kids[index];
+    if (!node) return;
+    if (node.type === "Content" && contentCount() <= 1) {
+      setStatus("A layout needs exactly one Content region; it cannot be removed.", "error");
+      return;
+    }
+    kids.splice(index, 1);
+    rebuildLayoutTree(kids);
+    render();
+  }
+
+  // Append a default region of the chosen type. A second Content is rejected (the
+  // resolver requires exactly one); warns instead.
+  function addRegion(type) {
+    if (type === "Content" && contentCount() >= 1) {
+      setStatus("Only one Content region is allowed.", "error");
+      return;
+    }
+    var kids = layoutChildren().slice();
+    kids.push(defaultRegion(type));
+    rebuildLayoutTree(kids);
+    render();
+  }
+
+  // one inline prop control (select / checkbox / text) for a region node.
+  function regionPropControl(node, field) {
+    var val = node.props ? node.props[field.key] : undefined;
+    var labelText = prettyLabel(field.key);
+
+    if (field.control === "check") {
+      var wrap = el("label", { "class": "tb-region-check" });
+      var cb = el("input", { type: "checkbox", "class": "tb-region-checkbox" });
+      cb.checked = !!val;
+      cb.addEventListener("change", function () { setRegionProp(node, field.key, cb.checked); });
+      wrap.appendChild(cb);
+      wrap.appendChild(el("span", { "class": "tb-region-field-label", text: labelText }));
+      return wrap;
+    }
+
+    var field2 = el("label", { "class": "tb-region-field" });
+    field2.appendChild(el("span", { "class": "tb-region-field-label", text: labelText }));
+
+    if (field.control === "select") {
+      var sel = el("select", { "class": "tb-region-select" });
+      if (field.allowNone) {
+        var none = el("option", { value: "", text: "(none)" });
+        if (val == null || val === "") none.selected = true;
+        sel.appendChild(none);
+      }
+      field.options.forEach(function (opt) {
+        var o2 = el("option", { value: opt, text: opt });
+        if (val === opt) o2.selected = true;
+        sel.appendChild(o2);
+      });
+      sel.addEventListener("change", function () { setRegionProp(node, field.key, sel.value); });
+      field2.appendChild(sel);
+    } else {
+      var inp = el("input", { type: "text", "class": "tb-input", value: val == null ? "" : val });
+      if (field.placeholder) inp.setAttribute("placeholder", field.placeholder);
+      inp.addEventListener("input", function () { setRegionProp(node, field.key, inp.value); });
+      field2.appendChild(inp);
+    }
+    return field2;
+  }
+
+  // one region row: header (type + Up/Down/Remove) and the inline settings grid.
+  function regionRow(node, index, total) {
+    var row = el("div", { "class": "tb-region" });
+
+    var head = el("div", { "class": "tb-region-head" });
+    head.appendChild(el("span", { "class": "tb-region-type", text: node.type }));
+    var ctrls = el("div", { "class": "tb-region-ctrls" });
+    ctrls.appendChild(button("Move up", function () { moveRegion(index, -1); }, {
+      disabled: index === 0, title: "Move up"
+    }));
+    ctrls.appendChild(button("Move down", function () { moveRegion(index, 1); }, {
+      disabled: index === total - 1, title: "Move down"
+    }));
+    var lastContent = node.type === "Content" && contentCount() <= 1;
+    ctrls.appendChild(button("Remove", function () { removeRegion(index); }, {
+      danger: true, disabled: lastContent,
+      title: lastContent ? "A layout needs exactly one Content region" : "Remove this region"
+    }));
+    head.appendChild(ctrls);
+    row.appendChild(head);
+
+    var fields = regionFields(node.type);
+    if (fields.length) {
+      var grid = el("div", { "class": "tb-region-fields" });
+      fields.forEach(function (f) { grid.appendChild(regionPropControl(node, f)); });
+      row.appendChild(grid);
+    }
+    return row;
+  }
+
+  // the Phase-2 layout panel: a VISUAL STRUCTURAL EDITOR. The admin starts from a
+  // preset, then composes Root.children as an ordered list of regions -- each row
+  // reorders, removes, and edits that region's props inline. Every change rebuilds
+  // open.layoutTree (with the derived Root className) and marks the editor dirty;
+  // it never saves or activates (8.7). If the open theme has no layoutTree yet, the
+  // panel seeds the first preset (topnav) as a starting point WITHOUT mutating the
+  // theme -- nothing persists until the user makes a change.
+  function renderLayoutPanel() {
+    var o = state.open;
+
+    // seed a starting layout (first preset) for a theme that has none yet, so the
+    // structural editor has something to show. This is display-only: o.dirty stays
+    // false and nothing is saved until the user actually edits.
+    if (o.layoutTree == null && state.layoutPresets.length) {
+      o.layoutTree = deepCopy(state.layoutPresets[0].tree);
+    }
+
+    var panel = el("div", { "class": "tb-token-panel tb-layout-panel" });
+    if (o.builtin) {
+      panel.appendChild(el("div", { "class": "tb-readonly-note",
+        text: "This is a built-in theme. Editing the layout is allowed; your first Save creates an editable copy and leaves the original untouched." }));
+    }
+
+    // ---- start from preset (loads a deep copy into the working tree) ----
+    var presetFs = el("fieldset", { "class": "tb-section" });
+    presetFs.appendChild(el("legend", { text: "Start from preset" }));
+
+    var matchId = matchedPresetId();
+    var currentLabel;
+    if (matchId == null) {
+      currentLabel = o.layoutTree == null ? "none" : "custom";
+    } else {
+      currentLabel = "preset";
+      for (var i = 0; i < state.layoutPresets.length; i++) {
+        if (state.layoutPresets[i].id === matchId) { currentLabel = state.layoutPresets[i].label; break; }
+      }
+    }
+    presetFs.appendChild(el("div", { "class": "tb-field-hint tb-layout-current",
+      text: "Current layout: " + currentLabel }));
+
+    if (!state.layoutPresets.length) {
+      presetFs.appendChild(el("div", { "class": "tb-empty", text: "No layout presets available." }));
+    } else {
+      var presetRow = el("div", { "class": "tb-region-add" });
+      var presetSel = el("select", { "class": "tb-region-select" });
+      state.layoutPresets.forEach(function (preset) {
+        var opt = el("option", { value: preset.id, text: preset.label });
+        if (preset.id === matchId) opt.selected = true;
+        presetSel.appendChild(opt);
+      });
+      presetRow.appendChild(presetSel);
+      presetRow.appendChild(button("Load preset", function () {
+        if (presetSel.value) setLayoutPreset(presetSel.value);
+      }, { title: "Replace the working layout with a copy of this preset" }));
+      presetFs.appendChild(presetRow);
+    }
+    panel.appendChild(presetFs);
+
+    // ---- regions: ordered list of Root.children ----
+    var regionsFs = el("fieldset", { "class": "tb-section" });
+    regionsFs.appendChild(el("legend", { text: "Regions" }));
+
+    var kids = layoutChildren();
+    if (!kids.length) {
+      regionsFs.appendChild(el("div", { "class": "tb-empty", text: "No regions yet. Add one below." }));
+    } else {
+      kids.forEach(function (node, idx) {
+        regionsFs.appendChild(regionRow(node, idx, kids.length));
+      });
+    }
+
+    // ---- add region ----
+    var addRow = el("div", { "class": "tb-region-add" });
+    var addSel = el("select", { "class": "tb-region-select" });
+    var haveContent = contentCount() >= 1;
+    REGION_TYPES.forEach(function (type) {
+      var attrs = { value: type, text: type };
+      // a second Content cannot be added -- disable the option so it is never picked.
+      if (type === "Content" && haveContent) attrs.disabled = true;
+      addSel.appendChild(el("option", attrs));
+    });
+    addRow.appendChild(addSel);
+    addRow.appendChild(button("Add region", function () { addRegion(addSel.value); }, {
+      title: "Append a region of the selected type"
+    }));
+    regionsFs.appendChild(addRow);
+    if (haveContent) {
+      regionsFs.appendChild(el("div", { "class": "tb-field-hint",
+        text: "Exactly one Content region is required, so a second cannot be added." }));
+    }
+    panel.appendChild(regionsFs);
+
+    panel.appendChild(el("div", { "class": "tb-field-hint",
+      text: "Layout changes apply when the theme is Activated; the live preview shows token colors, not the page chrome. Edits update this theme only and are not published until you Save and Activate." }));
+    return panel;
+  }
+
+  function renderEditor() {
+    var o = state.open;
+    var wrap = el("div", { "class": "tb-editor" });
+
+    // header bar
+    var bar = el("div", { "class": "tb-toolbar" });
+    bar.appendChild(button("\u2190 Back", function () {
+      if (o.dirty && !window.confirm("Discard unsaved edits?")) return;
+      state.open = null; state.view = "manager"; refreshState();
+    }));
+    var titleWrap = el("div", { "class": "tb-editor-title" });
+    titleWrap.appendChild(el("span", { "class": "tb-name", text: o.name }));
+    if (o.builtin) titleWrap.appendChild(badge("read-only", "builtin"));
+    state._dirtyBadge = badge("unsaved", "dirty");
+    if (!o.dirty) state._dirtyBadge.style.display = "none";
+    titleWrap.appendChild(state._dirtyBadge);
+    bar.appendChild(titleWrap);
+    bar.appendChild(el("div", { "class": "tb-spacer" }));
+
+    // Save and Activate are SEPARATE buttons (1.4 / 8.3).
+    bar.appendChild(button("Save", function () { doSave(false); }, {
+      title: "Persist edits. Does NOT change the live site."
+    }));
+    bar.appendChild(button("Save & Activate", function () { doSave(true); }, {
+      title: "Save, then publish to the live site."
+    }));
+    bar.appendChild(button("Activate", function () { doActivate(o.id); }, {
+      primary: true, disabled: o.builtin,
+      title: o.builtin ? "Save a copy first" : "Publish the SAVED theme to the live site"
+    }));
+    wrap.appendChild(bar);
+
+    // two columns: token/layout panel + live preview
+    var cols = el("div", { "class": "tb-cols" });
+
+    var panelWrap = el("div", { "class": "tb-panel-wrap" });
+    // Layout-mode only: tab strip to switch the left column between Tokens and Layout
+    // (8.3). With layout mode off, the token panel shows alone, no tabs.
+    var showLayout = state.layoutMode || state.caps.layoutMode;
+    if (showLayout) {
+      var tabs = el("div", { "class": "tb-tabs" });
+      tabs.appendChild(panelTab("tokens", "Tokens"));
+      tabs.appendChild(panelTab("layout", "Layout"));
+      panelWrap.appendChild(tabs);
+    } else if (state.panel === "layout") {
+      // never leave a stale "layout" selection active when phase drops to 1.
+      state.panel = "tokens";
+    }
+    panelWrap.appendChild(state.panel === "layout" && showLayout ? renderLayoutPanel() : renderTokenPanel());
+    cols.appendChild(panelWrap);
+
+    var preview = el("div", { "class": "tb-preview-wrap" });
+    preview.appendChild(el("div", { "class": "tb-preview-label", text: "Live preview (not published until you Activate)" }));
+    var frame = el("iframe", { "class": "tb-preview", sandbox: "allow-same-origin", title: "Theme preview" });
+    state._frame = frame;
+    frame.addEventListener("load", applyPreview);
+    preview.appendChild(frame);
+    cols.appendChild(preview);
+
+    wrap.appendChild(cols);
+
+    // seed the preview document (srcdoc parses async -> applyPreview also on load)
+    frame.srcdoc = previewSrcdoc();
+    return wrap;
+  }
+
+  // keep the dirty badge + chrome in sync without a full re-render on each keystroke.
+  function syncEditorChrome() {
+    if (state._dirtyBadge) state._dirtyBadge.style.display = state.open && state.open.dirty ? "" : "none";
+  }
+
+  // Locate the live <style id="tb-overlay"> inside the preview iframe, or null
+  // when the frame/document/overlay is not ready yet.
+  function overlayStyleNode() {
+    var frame = state._frame;
+    if (!frame) return null;
+    var doc = frame.contentDocument;
+    if (!doc) return null;
+    return doc.getElementById("tb-overlay") || null;
+  }
+
+  // Debounce + stale-guard state for the server-compiled preview. _previewSeq is
+  // bumped per request; a response is only applied when its captured sequence is
+  // still the latest, so an out-of-order (slow) response can never clobber a
+  // newer one.
+  var PREVIEW_DEBOUNCE_MS = 150;
+  state._previewTimer = null;
+  state._previewSeq = 0;
+
+  // write the instant client-side overlay into the preview iframe -- snappy
+  // feedback that covers --bs-* custom properties (production parity for those),
+  // then kick the debounced server compile for FULL fidelity (button rules etc).
+  function applyPreview() {
+    var o = state.open;
+    var style = overlayStyleNode();
+    if (!o || !style) return;
+    style.textContent = overlayCss(o.draftFlat, state.manifest);
+    schedulePreviewCss();
+  }
+
+  // Debounced server-compiled preview. ~150ms after the last token change, POST
+  // the current draft (nested) tokens to /preview-css and inject the returned
+  // CSS into the overlay <style> -- giving WYSIWYG parity with production,
+  // including the deep button rules client overlayCss() cannot emit. Stale
+  // responses are ignored (sequence check); any fetch/compile failure is
+  // swallowed, leaving the instant --bs-* overlay in place. Never throws.
+  function schedulePreviewCss() {
+    if (state._previewTimer) clearTimeout(state._previewTimer);
+    state._previewTimer = setTimeout(runPreviewCss, PREVIEW_DEBOUNCE_MS);
+  }
+
+  // Fire one server compile immediately (used by the debounce + initial open).
+  function runPreviewCss() {
+    state._previewTimer = null;
+    var o = state.open;
+    if (!o) return;
+    var seq = ++state._previewSeq;
+    var nestedTokens = nest(o.draftFlat, o.baseTokens, state.manifest);
+    previewCss(nestedTokens).then(function (css) {
+      // ignore a stale response if a newer request started since this one.
+      if (seq !== state._previewSeq) return;
+      var style = overlayStyleNode();
+      if (!style) return;
+      if (typeof css === "string") style.textContent = css;
+    }).catch(function () {
+      // fall back to the instant --bs-* overlay already in place; never throw.
+    });
+  }
+
+  // the sample page loaded into the preview iframe. Loads the live theme.css so
+  // the baseline matches production, plus an empty <style id="tb-overlay"> we
+  // rewrite on every edit. No allow-scripts: the preview cannot run code.
+  function previewSrcdoc() {
+    var css = CSS_ROUTE;
+    return "" +
+      "<!DOCTYPE html><html><head><meta charset=\"utf-8\">" +
+      "<link rel=\"stylesheet\" href=\"" + css + "\">" +
+      "<style id=\"tb-overlay\"></style>" +
+      "<style>body{padding:1rem;background:var(--bs-body-bg,#fff);color:var(--bs-body-color,#212529);" +
+      "font-family:var(--bs-body-font-family,system-ui),sans-serif;font-size:var(--bs-body-font-size,1rem);" +
+      "line-height:var(--bs-body-line-height,1.5);}" +
+      ".sw{border:var(--bs-border-width,1px) solid var(--bs-border-color,#dee2e6);" +
+      "border-radius:var(--bs-border-radius,.375rem);padding:1rem;margin-bottom:1rem;background:var(--bs-card-bg,#fff);}" +
+      ".bar{padding:.5rem 1rem;margin-bottom:1rem;border-radius:var(--bs-border-radius,.375rem);" +
+      "background:var(--bs-navbar-bg,var(--bs-primary,#0d6efd));color:#fff;}" +
+      ".btn{display:inline-block;padding:.375rem .75rem;margin:.25rem;border-radius:var(--bs-border-radius,.375rem);" +
+      "border:var(--bs-border-width,1px) solid transparent;color:#fff;}" +
+      ".btn-p{background:var(--bs-primary,#0d6efd);}.btn-s{background:var(--bs-secondary,#6c757d);}" +
+      ".btn-su{background:var(--bs-success,#198754);}.btn-d{background:var(--bs-danger,#dc3545);}" +
+      ".btn-w{background:var(--bs-warning,#ffc107);color:#000;}.btn-i{background:var(--bs-info,#0dcaf0);color:#000;}" +
+      "a{color:var(--bs-link-color,var(--bs-primary,#0d6efd));}" +
+      "h1,h2,h3{font-family:var(--bs-headings-font-family,inherit);}</style></head><body>" +
+      "<div class=\"bar\">Navbar</div>" +
+      "<h1>Heading 1</h1><h2>Heading 2</h2>" +
+      "<p>Body text with a <a href=\"#\">sample link</a>. The quick brown fox jumps over the lazy dog.</p>" +
+      "<div>" +
+      "<span class=\"btn btn-p\">Primary</span><span class=\"btn btn-s\">Secondary</span>" +
+      "<span class=\"btn btn-su\">Success</span><span class=\"btn btn-d\">Danger</span>" +
+      "<span class=\"btn btn-w\">Warning</span><span class=\"btn btn-i\">Info</span>" +
+      "</div>" +
+      "<div class=\"sw\"><strong>Card</strong><p>A representative card surface.</p>" +
+      "<code>code sample</code></div>" +
+      "</body></html>";
+  }
+
+  function render() {
+    if (!root) return;
+    clear(root);
+    var shell = el("div", { "class": "tb-app" });
+    shell.appendChild(state.view === "editor" && state.open ? renderEditor() : renderManager());
+    statusBar = el("div", { "class": "tb-status" });
+    shell.appendChild(statusBar);
+    root.appendChild(shell);
+  }
+
+  // ---- styles --------------------------------------------------------------
+
+  function injectStyles() {
+    if (document.getElementById("tb-app-styles")) return;
+    var s = document.createElement("style");
+    s.id = "tb-app-styles";
+    s.textContent = [
+      ".tb-app{font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:#1f2330;height:100%;display:flex;flex-direction:column;}",
+      ".tb-toolbar{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;border-bottom:1px solid #e3e6ec;background:#f7f8fa;flex-wrap:wrap;}",
+      ".tb-title{font-size:1.15rem;margin:0;}",
+      ".tb-spacer{flex:1;}",
+      ".tb-btn{font:inherit;padding:.35rem .7rem;border:1px solid #c7ccd6;border-radius:.35rem;background:#fff;cursor:pointer;color:#1f2330;text-decoration:none;display:inline-block;line-height:1.2;}",
+      ".tb-btn:hover{background:#eef1f6;}",
+      ".tb-btn[disabled]{opacity:.45;cursor:not-allowed;}",
+      ".tb-btn-primary{background:#0d6efd;border-color:#0d6efd;color:#fff;}",
+      ".tb-btn-primary:hover{background:#0b5ed7;}",
+      ".tb-btn-danger{color:#b02a37;border-color:#e0aeb4;}",
+      ".tb-btn-link{}",
+      ".tb-file{display:none;}",
+      ".tb-table{width:100%;border-collapse:collapse;}",
+      ".tb-table th,.tb-table td{text-align:left;padding:.6rem .75rem;border-bottom:1px solid #eceef2;vertical-align:middle;}",
+      ".tb-table th{font-size:.8rem;text-transform:uppercase;letter-spacing:.03em;color:#6b7280;}",
+      ".tb-row-active{background:#f1f7ff;}",
+      ".tb-name{font-weight:600;margin-right:.5rem;}",
+      ".tb-actions{display:flex;gap:.35rem;flex-wrap:wrap;}",
+      ".tb-actions-col{width:1px;white-space:nowrap;}",
+      ".tb-empty{color:#6b7280;text-align:center;padding:2rem;}",
+      ".tb-badge{display:inline-block;font-size:.7rem;padding:.1rem .4rem;border-radius:.3rem;margin-right:.35rem;vertical-align:middle;}",
+      ".tb-badge-active{background:#198754;color:#fff;}",
+      ".tb-badge-builtin{background:#6c757d;color:#fff;}",
+      ".tb-badge-dirty{background:#ffc107;color:#000;}",
+      ".tb-cols{display:flex;flex:1;min-height:0;}",
+      ".tb-panel-wrap{width:380px;max-width:45%;display:flex;flex-direction:column;min-height:0;border-right:1px solid #e3e6ec;}",
+      ".tb-tabs{display:flex;gap:.25rem;padding:.5rem .75rem 0;background:#f7f8fa;border-bottom:1px solid #e3e6ec;}",
+      ".tb-tab{font:inherit;padding:.4rem .8rem;border:1px solid #e3e6ec;border-bottom:0;border-radius:.35rem .35rem 0 0;background:#eef1f6;color:#445;cursor:pointer;}",
+      ".tb-tab:hover{background:#e3e8f0;}",
+      ".tb-tab-active{background:#fff;color:#1f2330;font-weight:600;margin-bottom:-1px;}",
+      ".tb-panel-wrap .tb-token-panel{flex:1;border-right:0;}",
+      ".tb-token-panel{width:380px;max-width:45%;overflow:auto;padding:1rem;border-right:1px solid #e3e6ec;}",
+      ".tb-layout-current{margin-bottom:.6rem;color:#445;}",
+      ".tb-layout-option{display:flex;align-items:center;gap:.5rem;padding:.45rem .5rem;margin:.3rem 0;border:1px solid #e3e6ec;border-radius:.4rem;cursor:pointer;}",
+      ".tb-layout-option:hover{background:#f4f6fa;}",
+      ".tb-layout-option-selected{border-color:#0d6efd;background:#f1f7ff;}",
+      ".tb-layout-option-label{font-weight:600;}",
+      ".tb-layout-radio{margin:0;}",
+      ".tb-region{border:1px solid #e3e6ec;border-radius:.45rem;margin:.5rem 0;padding:.5rem .6rem;background:#fbfcfe;}",
+      ".tb-region-head{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;}",
+      ".tb-region-type{font-weight:600;flex:1;}",
+      ".tb-region-ctrls{display:flex;gap:.3rem;flex-wrap:wrap;}",
+      ".tb-region-fields{display:flex;flex-direction:column;gap:.4rem;margin-top:.5rem;}",
+      ".tb-region-field{display:flex;flex-direction:column;gap:.15rem;}",
+      ".tb-region-field-label{font-size:.78rem;font-weight:600;color:#445;}",
+      ".tb-region-check{display:flex;align-items:center;gap:.4rem;}",
+      ".tb-region-checkbox{margin:0;}",
+      ".tb-region-select{font:inherit;padding:.3rem .45rem;border:1px solid #c7ccd6;border-radius:.3rem;background:#fff;min-width:0;}",
+      ".tb-region-add{display:flex;gap:.4rem;align-items:center;margin-top:.5rem;flex-wrap:wrap;}",
+      ".tb-section{border:1px solid #e3e6ec;border-radius:.5rem;margin:0 0 1rem;padding:.5rem .75rem 1rem;}",
+      ".tb-section legend{font-weight:600;padding:0 .35rem;font-size:.95rem;}",
+      ".tb-field{display:block;margin:.6rem 0;}",
+      ".tb-field-label{display:block;font-size:.85rem;font-weight:600;margin-bottom:.2rem;}",
+      ".tb-field-hint{display:block;font-size:.72rem;color:#8a90a0;font-family:ui-monospace,Menlo,Consolas,monospace;margin-bottom:.2rem;}",
+      ".tb-field-row{display:flex;gap:.4rem;align-items:center;}",
+      ".tb-input{font:inherit;flex:1;padding:.3rem .45rem;border:1px solid #c7ccd6;border-radius:.3rem;min-width:0;}",
+      ".tb-color{width:38px;height:32px;padding:0;border:1px solid #c7ccd6;border-radius:.3rem;background:#fff;cursor:pointer;}",
+      ".tb-preview-wrap{flex:1;display:flex;flex-direction:column;min-width:0;}",
+      ".tb-preview-label{padding:.5rem 1rem;font-size:.8rem;color:#6b7280;background:#f7f8fa;border-bottom:1px solid #e3e6ec;}",
+      ".tb-preview{flex:1;width:100%;border:0;background:#fff;}",
+      ".tb-editor{display:flex;flex-direction:column;flex:1;min-height:0;}",
+      ".tb-editor-title{display:flex;align-items:center;gap:.4rem;}",
+      ".tb-readonly-note{background:#fff8e1;border:1px solid #ffe7a0;border-radius:.4rem;padding:.6rem;margin-bottom:1rem;font-size:.85rem;}",
+      ".tb-status{padding:.5rem 1rem;font-size:.85rem;color:#444;border-top:1px solid #e3e6ec;min-height:1.2rem;background:#fafbfc;}",
+      ".tb-status-ok{color:#0f5132;background:#d1e7dd;}",
+      ".tb-status-error{color:#842029;background:#f8d7da;}"
+    ].join("");
+    document.head.appendChild(s);
+  }
+
+  // ---- boot ----------------------------------------------------------------
+
+  function mount(elementId) {
+    root = document.getElementById(elementId || "theme-builder-root");
+    if (!root) return;
+    injectStyles();
+    clear(root);
+    root.appendChild(el("div", { "class": "tb-loading", text: "Loading themes..." }));
+    refreshState().then(function () {
+      if (TB.openThemeId) openTheme(TB.openThemeId);
+    });
+  }
+
+  // expose a small API (mirrors the Phase-2 themeBuilder.mount contract).
+  window.themeBuilder = { mount: mount };
+
+  // auto-mount when the shell's div exists.
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", function () { mount("theme-builder-root"); });
+  } else {
+    mount("theme-builder-root");
+  }
+})();
diff --git a/public/themeBootstrap.bundle.min.js b/public/themeBootstrap.bundle.min.js
new file mode 100644
index 0000000..04e9185
--- /dev/null
+++ b/public/themeBootstrap.bundle.min.js
@@ -0,0 +1,7 @@
+/*!
+  * Bootstrap v5.3.3 (https://getbootstrap.com/)
+  * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+  */
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).bootstrap=e()}(this,(function(){"use strict";const t=new Map,e={set(e,i,n){t.has(e)||t.set(e,new Map);const s=t.get(e);s.has(i)||0===s.size?s.set(i,n):console.error(`Bootstrap doesn't allow more than one instance per element. Bound instance: ${Array.from(s.keys())[0]}.`)},get:(e,i)=>t.has(e)&&t.get(e).get(i)||null,remove(e,i){if(!t.has(e))return;const n=t.get(e);n.delete(i),0===n.size&&t.delete(e)}},i="transitionend",n=t=>(t&&window.CSS&&window.CSS.escape&&(t=t.replace(/#([^\s"#']+)/g,((t,e)=>`#${CSS.escape(e)}`))),t),s=t=>{t.dispatchEvent(new Event(i))},o=t=>!(!t||"object"!=typeof t)&&(void 0!==t.jquery&&(t=t[0]),void 0!==t.nodeType),r=t=>o(t)?t.jquery?t[0]:t:"string"==typeof t&&t.length>0?document.querySelector(n(t)):null,a=t=>{if(!o(t)||0===t.getClientRects().length)return!1;const e="visible"===getComputedStyle(t).getPropertyValue("visibility"),i=t.closest("details:not([open])");if(!i)return e;if(i!==t){const e=t.closest("summary");if(e&&e.parentNode!==i)return!1;if(null===e)return!1}return e},l=t=>!t||t.nodeType!==Node.ELEMENT_NODE||!!t.classList.contains("disabled")||(void 0!==t.disabled?t.disabled:t.hasAttribute("disabled")&&"false"!==t.getAttribute("disabled")),c=t=>{if(!document.documentElement.attachShadow)return null;if("function"==typeof t.getRootNode){const e=t.getRootNode();return e instanceof ShadowRoot?e:null}return t instanceof ShadowRoot?t:t.parentNode?c(t.parentNode):null},h=()=>{},d=t=>{t.offsetHeight},u=()=>window.jQuery&&!document.body.hasAttribute("data-bs-no-jquery")?window.jQuery:null,f=[],p=()=>"rtl"===document.documentElement.dir,m=t=>{var e;e=()=>{const e=u();if(e){const i=t.NAME,n=e.fn[i];e.fn[i]=t.jQueryInterface,e.fn[i].Constructor=t,e.fn[i].noConflict=()=>(e.fn[i]=n,t.jQueryInterface)}},"loading"===document.readyState?(f.length||document.addEventListener("DOMContentLoaded",(()=>{for(const t of f)t()})),f.push(e)):e()},g=(t,e=[],i=t)=>"function"==typeof t?t(...e):i,_=(t,e,n=!0)=>{if(!n)return void g(t);const o=(t=>{if(!t)return 0;let{transitionDuration:e,transitionDelay:i}=window.getComputedStyle(t);const n=Number.parseFloat(e),s=Number.parseFloat(i);return n||s?(e=e.split(",")[0],i=i.split(",")[0],1e3*(Number.parseFloat(e)+Number.parseFloat(i))):0})(e)+5;let r=!1;const a=({target:n})=>{n===e&&(r=!0,e.removeEventListener(i,a),g(t))};e.addEventListener(i,a),setTimeout((()=>{r||s(e)}),o)},b=(t,e,i,n)=>{const s=t.length;let o=t.indexOf(e);return-1===o?!i&&n?t[s-1]:t[0]:(o+=i?1:-1,n&&(o=(o+s)%s),t[Math.max(0,Math.min(o,s-1))])},v=/[^.]*(?=\..*)\.|.*/,y=/\..*/,w=/::\d+$/,A={};let E=1;const T={mouseenter:"mouseover",mouseleave:"mouseout"},C=new Set(["click","dblclick","mouseup","mousedown","contextmenu","mousewheel","DOMMouseScroll","mouseover","mouseout","mousemove","selectstart","selectend","keydown","keypress","keyup","orientationchange","touchstart","touchmove","touchend","touchcancel","pointerdown","pointermove","pointerup","pointerleave","pointercancel","gesturestart","gesturechange","gestureend","focus","blur","change","reset","select","submit","focusin","focusout","load","unload","beforeunload","resize","move","DOMContentLoaded","readystatechange","error","abort","scroll"]);function O(t,e){return e&&`${e}::${E++}`||t.uidEvent||E++}function x(t){const e=O(t);return t.uidEvent=e,A[e]=A[e]||{},A[e]}function k(t,e,i=null){return Object.values(t).find((t=>t.callable===e&&t.delegationSelector===i))}function L(t,e,i){const n="string"==typeof e,s=n?i:e||i;let o=I(t);return C.has(o)||(o=t),[n,s,o]}function S(t,e,i,n,s){if("string"!=typeof e||!t)return;let[o,r,a]=L(e,i,n);if(e in T){const t=t=>function(e){if(!e.relatedTarget||e.relatedTarget!==e.delegateTarget&&!e.delegateTarget.contains(e.relatedTarget))return t.call(this,e)};r=t(r)}const l=x(t),c=l[a]||(l[a]={}),h=k(c,r,o?i:null);if(h)return void(h.oneOff=h.oneOff&&s);const d=O(r,e.replace(v,"")),u=o?function(t,e,i){return function n(s){const o=t.querySelectorAll(e);for(let{target:r}=s;r&&r!==this;r=r.parentNode)for(const a of o)if(a===r)return P(s,{delegateTarget:r}),n.oneOff&&N.off(t,s.type,e,i),i.apply(r,[s])}}(t,i,r):function(t,e){return function i(n){return P(n,{delegateTarget:t}),i.oneOff&&N.off(t,n.type,e),e.apply(t,[n])}}(t,r);u.delegationSelector=o?i:null,u.callable=r,u.oneOff=s,u.uidEvent=d,c[d]=u,t.addEventListener(a,u,o)}function D(t,e,i,n,s){const o=k(e[i],n,s);o&&(t.removeEventListener(i,o,Boolean(s)),delete e[i][o.uidEvent])}function $(t,e,i,n){const s=e[i]||{};for(const[o,r]of Object.entries(s))o.includes(n)&&D(t,e,i,r.callable,r.delegationSelector)}function I(t){return t=t.replace(y,""),T[t]||t}const N={on(t,e,i,n){S(t,e,i,n,!1)},one(t,e,i,n){S(t,e,i,n,!0)},off(t,e,i,n){if("string"!=typeof e||!t)return;const[s,o,r]=L(e,i,n),a=r!==e,l=x(t),c=l[r]||{},h=e.startsWith(".");if(void 0===o){if(h)for(const i of Object.keys(l))$(t,l,i,e.slice(1));for(const[i,n]of Object.entries(c)){const s=i.replace(w,"");a&&!e.includes(s)||D(t,l,r,n.callable,n.delegationSelector)}}else{if(!Object.keys(c).length)return;D(t,l,r,o,s?i:null)}},trigger(t,e,i){if("string"!=typeof e||!t)return null;const n=u();let s=null,o=!0,r=!0,a=!1;e!==I(e)&&n&&(s=n.Event(e,i),n(t).trigger(s),o=!s.isPropagationStopped(),r=!s.isImmediatePropagationStopped(),a=s.isDefaultPrevented());const l=P(new Event(e,{bubbles:o,cancelable:!0}),i);return a&&l.preventDefault(),r&&t.dispatchEvent(l),l.defaultPrevented&&s&&s.preventDefault(),l}};function P(t,e={}){for(const[i,n]of Object.entries(e))try{t[i]=n}catch(e){Object.defineProperty(t,i,{configurable:!0,get:()=>n})}return t}function j(t){if("true"===t)return!0;if("false"===t)return!1;if(t===Number(t).toString())return Number(t);if(""===t||"null"===t)return null;if("string"!=typeof t)return t;try{return JSON.parse(decodeURIComponent(t))}catch(e){return t}}function M(t){return t.replace(/[A-Z]/g,(t=>`-${t.toLowerCase()}`))}const F={setDataAttribute(t,e,i){t.setAttribute(`data-bs-${M(e)}`,i)},removeDataAttribute(t,e){t.removeAttribute(`data-bs-${M(e)}`)},getDataAttributes(t){if(!t)return{};const e={},i=Object.keys(t.dataset).filter((t=>t.startsWith("bs")&&!t.startsWith("bsConfig")));for(const n of i){let i=n.replace(/^bs/,"");i=i.charAt(0).toLowerCase()+i.slice(1,i.length),e[i]=j(t.dataset[n])}return e},getDataAttribute:(t,e)=>j(t.getAttribute(`data-bs-${M(e)}`))};class H{static get Default(){return{}}static get DefaultType(){return{}}static get NAME(){throw new Error('You have to implement the static method "NAME", for each component!')}_getConfig(t){return t=this._mergeConfigObj(t),t=this._configAfterMerge(t),this._typeCheckConfig(t),t}_configAfterMerge(t){return t}_mergeConfigObj(t,e){const i=o(e)?F.getDataAttribute(e,"config"):{};return{...this.constructor.Default,..."object"==typeof i?i:{},...o(e)?F.getDataAttributes(e):{},..."object"==typeof t?t:{}}}_typeCheckConfig(t,e=this.constructor.DefaultType){for(const[n,s]of Object.entries(e)){const e=t[n],r=o(e)?"element":null==(i=e)?`${i}`:Object.prototype.toString.call(i).match(/\s([a-z]+)/i)[1].toLowerCase();if(!new RegExp(s).test(r))throw new TypeError(`${this.constructor.NAME.toUpperCase()}: Option "${n}" provided type "${r}" but expected type "${s}".`)}var i}}class W extends H{constructor(t,i){super(),(t=r(t))&&(this._element=t,this._config=this._getConfig(i),e.set(this._element,this.constructor.DATA_KEY,this))}dispose(){e.remove(this._element,this.constructor.DATA_KEY),N.off(this._element,this.constructor.EVENT_KEY);for(const t of Object.getOwnPropertyNames(this))this[t]=null}_queueCallback(t,e,i=!0){_(t,e,i)}_getConfig(t){return t=this._mergeConfigObj(t,this._element),t=this._configAfterMerge(t),this._typeCheckConfig(t),t}static getInstance(t){return e.get(r(t),this.DATA_KEY)}static getOrCreateInstance(t,e={}){return this.getInstance(t)||new this(t,"object"==typeof e?e:null)}static get VERSION(){return"5.3.3"}static get DATA_KEY(){return`bs.${this.NAME}`}static get EVENT_KEY(){return`.${this.DATA_KEY}`}static eventName(t){return`${t}${this.EVENT_KEY}`}}const B=t=>{let e=t.getAttribute("data-bs-target");if(!e||"#"===e){let i=t.getAttribute("href");if(!i||!i.includes("#")&&!i.startsWith("."))return null;i.includes("#")&&!i.startsWith("#")&&(i=`#${i.split("#")[1]}`),e=i&&"#"!==i?i.trim():null}return e?e.split(",").map((t=>n(t))).join(","):null},z={find:(t,e=document.documentElement)=>[].concat(...Element.prototype.querySelectorAll.call(e,t)),findOne:(t,e=document.documentElement)=>Element.prototype.querySelector.call(e,t),children:(t,e)=>[].concat(...t.children).filter((t=>t.matches(e))),parents(t,e){const i=[];let n=t.parentNode.closest(e);for(;n;)i.push(n),n=n.parentNode.closest(e);return i},prev(t,e){let i=t.previousElementSibling;for(;i;){if(i.matches(e))return[i];i=i.previousElementSibling}return[]},next(t,e){let i=t.nextElementSibling;for(;i;){if(i.matches(e))return[i];i=i.nextElementSibling}return[]},focusableChildren(t){const e=["a","button","input","textarea","select","details","[tabindex]",'[contenteditable="true"]'].map((t=>`${t}:not([tabindex^="-"])`)).join(",");return this.find(e,t).filter((t=>!l(t)&&a(t)))},getSelectorFromElement(t){const e=B(t);return e&&z.findOne(e)?e:null},getElementFromSelector(t){const e=B(t);return e?z.findOne(e):null},getMultipleElementsFromSelector(t){const e=B(t);return e?z.find(e):[]}},R=(t,e="hide")=>{const i=`click.dismiss${t.EVENT_KEY}`,n=t.NAME;N.on(document,i,`[data-bs-dismiss="${n}"]`,(function(i){if(["A","AREA"].includes(this.tagName)&&i.preventDefault(),l(this))return;const s=z.getElementFromSelector(this)||this.closest(`.${n}`);t.getOrCreateInstance(s)[e]()}))},q=".bs.alert",V=`close${q}`,K=`closed${q}`;class Q extends W{static get NAME(){return"alert"}close(){if(N.trigger(this._element,V).defaultPrevented)return;this._element.classList.remove("show");const t=this._element.classList.contains("fade");this._queueCallback((()=>this._destroyElement()),this._element,t)}_destroyElement(){this._element.remove(),N.trigger(this._element,K),this.dispose()}static jQueryInterface(t){return this.each((function(){const e=Q.getOrCreateInstance(this);if("string"==typeof t){if(void 0===e[t]||t.startsWith("_")||"constructor"===t)throw new TypeError(`No method named "${t}"`);e[t](this)}}))}}R(Q,"close"),m(Q);const X='[data-bs-toggle="button"]';class Y extends W{static get NAME(){return"button"}toggle(){this._element.setAttribute("aria-pressed",this._element.classList.toggle("active"))}static jQueryInterface(t){return this.each((function(){const e=Y.getOrCreateInstance(this);"toggle"===t&&e[t]()}))}}N.on(document,"click.bs.button.data-api",X,(t=>{t.preventDefault();const e=t.target.closest(X);Y.getOrCreateInstance(e).toggle()})),m(Y);const U=".bs.swipe",G=`touchstart${U}`,J=`touchmove${U}`,Z=`touchend${U}`,tt=`pointerdown${U}`,et=`pointerup${U}`,it={endCallback:null,leftCallback:null,rightCallback:null},nt={endCallback:"(function|null)",leftCallback:"(function|null)",rightCallback:"(function|null)"};class st extends H{constructor(t,e){super(),this._element=t,t&&st.isSupported()&&(this._config=this._getConfig(e),this._deltaX=0,this._supportPointerEvents=Boolean(window.PointerEvent),this._initEvents())}static get Default(){return it}static get DefaultType(){return nt}static get NAME(){return"swipe"}dispose(){N.off(this._element,U)}_start(t){this._supportPointerEvents?this._eventIsPointerPenTouch(t)&&(this._deltaX=t.clientX):this._deltaX=t.touches[0].clientX}_end(t){this._eventIsPointerPenTouch(t)&&(this._deltaX=t.clientX-this._deltaX),this._handleSwipe(),g(this._config.endCallback)}_move(t){this._deltaX=t.touches&&t.touches.length>1?0:t.touches[0].clientX-this._deltaX}_handleSwipe(){const t=Math.abs(this._deltaX);if(t<=40)return;const e=t/this._deltaX;this._deltaX=0,e&&g(e>0?this._config.rightCallback:this._config.leftCallback)}_initEvents(){this._supportPointerEvents?(N.on(this._element,tt,(t=>this._start(t))),N.on(this._element,et,(t=>this._end(t))),this._element.classList.add("pointer-event")):(N.on(this._element,G,(t=>this._start(t))),N.on(this._element,J,(t=>this._move(t))),N.on(this._element,Z,(t=>this._end(t))))}_eventIsPointerPenTouch(t){return this._supportPointerEvents&&("pen"===t.pointerType||"touch"===t.pointerType)}static isSupported(){return"ontouchstart"in document.documentElement||navigator.maxTouchPoints>0}}const ot=".bs.carousel",rt=".data-api",at="next",lt="prev",ct="left",ht="right",dt=`slide${ot}`,ut=`slid${ot}`,ft=`keydown${ot}`,pt=`mouseenter${ot}`,mt=`mouseleave${ot}`,gt=`dragstart${ot}`,_t=`load${ot}${rt}`,bt=`click${ot}${rt}`,vt="carousel",yt="active",wt=".active",At=".carousel-item",Et=wt+At,Tt={ArrowLeft:ht,ArrowRight:ct},Ct={interval:5e3,keyboard:!0,pause:"hover",ride:!1,touch:!0,wrap:!0},Ot={interval:"(number|boolean)",keyboard:"boolean",pause:"(string|boolean)",ride:"(boolean|string)",touch:"boolean",wrap:"boolean"};class xt extends W{constructor(t,e){super(t,e),this._interval=null,this._activeElement=null,this._isSliding=!1,this.touchTimeout=null,this._swipeHelper=null,this._indicatorsElement=z.findOne(".carousel-indicators",this._element),this._addEventListeners(),this._config.ride===vt&&this.cycle()}static get Default(){return Ct}static get DefaultType(){return Ot}static get NAME(){return"carousel"}next(){this._slide(at)}nextWhenVisible(){!document.hidden&&a(this._element)&&this.next()}prev(){this._slide(lt)}pause(){this._isSliding&&s(this._element),this._clearInterval()}cycle(){this._clearInterval(),this._updateInterval(),this._interval=setInterval((()=>this.nextWhenVisible()),this._config.interval)}_maybeEnableCycle(){this._config.ride&&(this._isSliding?N.one(this._element,ut,(()=>this.cycle())):this.cycle())}to(t){const e=this._getItems();if(t>e.length-1||t<0)return;if(this._isSliding)return void N.one(this._element,ut,(()=>this.to(t)));const i=this._getItemIndex(this._getActive());if(i===t)return;const n=t>i?at:lt;this._slide(n,e[t])}dispose(){this._swipeHelper&&this._swipeHelper.dispose(),super.dispose()}_configAfterMerge(t){return t.defaultInterval=t.interval,t}_addEventListeners(){this._config.keyboard&&N.on(this._element,ft,(t=>this._keydown(t))),"hover"===this._config.pause&&(N.on(this._element,pt,(()=>this.pause())),N.on(this._element,mt,(()=>this._maybeEnableCycle()))),this._config.touch&&st.isSupported()&&this._addTouchEventListeners()}_addTouchEventListeners(){for(const t of z.find(".carousel-item img",this._element))N.on(t,gt,(t=>t.preventDefault()));const t={leftCallback:()=>this._slide(this._directionToOrder(ct)),rightCallback:()=>this._slide(this._directionToOrder(ht)),endCallback:()=>{"hover"===this._config.pause&&(this.pause(),this.touchTimeout&&clearTimeout(this.touchTimeout),this.touchTimeout=setTimeout((()=>this._maybeEnableCycle()),500+this._config.interval))}};this._swipeHelper=new st(this._element,t)}_keydown(t){if(/input|textarea/i.test(t.target.tagName))return;const e=Tt[t.key];e&&(t.preventDefault(),this._slide(this._directionToOrder(e)))}_getItemIndex(t){return this._getItems().indexOf(t)}_setActiveIndicatorElement(t){if(!this._indicatorsElement)return;const e=z.findOne(wt,this._indicatorsElement);e.classList.remove(yt),e.removeAttribute("aria-current");const i=z.findOne(`[data-bs-slide-to="${t}"]`,this._indicatorsElement);i&&(i.classList.add(yt),i.setAttribute("aria-current","true"))}_updateInterval(){const t=this._activeElement||this._getActive();if(!t)return;const e=Number.parseInt(t.getAttribute("data-bs-interval"),10);this._config.interval=e||this._config.defaultInterval}_slide(t,e=null){if(this._isSliding)return;const i=this._getActive(),n=t===at,s=e||b(this._getItems(),i,n,this._config.wrap);if(s===i)return;const o=this._getItemIndex(s),r=e=>N.trigger(this._element,e,{relatedTarget:s,direction:this._orderToDirection(t),from:this._getItemIndex(i),to:o});if(r(dt).defaultPrevented)return;if(!i||!s)return;const a=Boolean(this._interval);this.pause(),this._isSliding=!0,this._setActiveIndicatorElement(o),this._activeElement=s;const l=n?"carousel-item-start":"carousel-item-end",c=n?"carousel-item-next":"carousel-item-prev";s.classList.add(c),d(s),i.classList.add(l),s.classList.add(l),this._queueCallback((()=>{s.classList.remove(l,c),s.classList.add(yt),i.classList.remove(yt,c,l),this._isSliding=!1,r(ut)}),i,this._isAnimated()),a&&this.cycle()}_isAnimated(){return this._element.classList.contains("slide")}_getActive(){return z.findOne(Et,this._element)}_getItems(){return z.find(At,this._element)}_clearInterval(){this._interval&&(clearInterval(this._interval),this._interval=null)}_directionToOrder(t){return p()?t===ct?lt:at:t===ct?at:lt}_orderToDirection(t){return p()?t===lt?ct:ht:t===lt?ht:ct}static jQueryInterface(t){return this.each((function(){const e=xt.getOrCreateInstance(this,t);if("number"!=typeof t){if("string"==typeof t){if(void 0===e[t]||t.startsWith("_")||"constructor"===t)throw new TypeError(`No method named "${t}"`);e[t]()}}else e.to(t)}))}}N.on(document,bt,"[data-bs-slide], [data-bs-slide-to]",(function(t){const e=z.getElementFromSelector(this);if(!e||!e.classList.contains(vt))return;t.preventDefault();const i=xt.getOrCreateInstance(e),n=this.getAttribute("data-bs-slide-to");return n?(i.to(n),void i._maybeEnableCycle()):"next"===F.getDataAttribute(this,"slide")?(i.next(),void i._maybeEnableCycle()):(i.prev(),void i._maybeEnableCycle())})),N.on(window,_t,(()=>{const t=z.find('[data-bs-ride="carousel"]');for(const e of t)xt.getOrCreateInstance(e)})),m(xt);const kt=".bs.collapse",Lt=`show${kt}`,St=`shown${kt}`,Dt=`hide${kt}`,$t=`hidden${kt}`,It=`click${kt}.data-api`,Nt="show",Pt="collapse",jt="collapsing",Mt=`:scope .${Pt} .${Pt}`,Ft='[data-bs-toggle="collapse"]',Ht={parent:null,toggle:!0},Wt={parent:"(null|element)",toggle:"boolean"};class Bt extends W{constructor(t,e){super(t,e),this._isTransitioning=!1,this._triggerArray=[];const i=z.find(Ft);for(const t of i){const e=z.getSelectorFromElement(t),i=z.find(e).filter((t=>t===this._element));null!==e&&i.length&&this._triggerArray.push(t)}this._initializeChildren(),this._config.parent||this._addAriaAndCollapsedClass(this._triggerArray,this._isShown()),this._config.toggle&&this.toggle()}static get Default(){return Ht}static get DefaultType(){return Wt}static get NAME(){return"collapse"}toggle(){this._isShown()?this.hide():this.show()}show(){if(this._isTransitioning||this._isShown())return;let t=[];if(this._config.parent&&(t=this._getFirstLevelChildren(".collapse.show, .collapse.collapsing").filter((t=>t!==this._element)).map((t=>Bt.getOrCreateInstance(t,{toggle:!1})))),t.length&&t[0]._isTransitioning)return;if(N.trigger(this._element,Lt).defaultPrevented)return;for(const e of t)e.hide();const e=this._getDimension();this._element.classList.remove(Pt),this._element.classList.add(jt),this._element.style[e]=0,this._addAriaAndCollapsedClass(this._triggerArray,!0),this._isTransitioning=!0;const i=`scroll${e[0].toUpperCase()+e.slice(1)}`;this._queueCallback((()=>{this._isTransitioning=!1,this._element.classList.remove(jt),this._element.classList.add(Pt,Nt),this._element.style[e]="",N.trigger(this._element,St)}),this._element,!0),this._element.style[e]=`${this._element[i]}px`}hide(){if(this._isTransitioning||!this._isShown())return;if(N.trigger(this._element,Dt).defaultPrevented)return;const t=this._getDimension();this._element.style[t]=`${this._element.getBoundingClientRect()[t]}px`,d(this._element),this._element.classList.add(jt),this._element.classList.remove(Pt,Nt);for(const t of this._triggerArray){const e=z.getElementFromSelector(t);e&&!this._isShown(e)&&this._addAriaAndCollapsedClass([t],!1)}this._isTransitioning=!0,this._element.style[t]="",this._queueCallback((()=>{this._isTransitioning=!1,this._element.classList.remove(jt),this._element.classList.add(Pt),N.trigger(this._element,$t)}),this._element,!0)}_isShown(t=this._element){return t.classList.contains(Nt)}_configAfterMerge(t){return t.toggle=Boolean(t.toggle),t.parent=r(t.parent),t}_getDimension(){return this._element.classList.contains("collapse-horizontal")?"width":"height"}_initializeChildren(){if(!this._config.parent)return;const t=this._getFirstLevelChildren(Ft);for(const e of t){const t=z.getElementFromSelector(e);t&&this._addAriaAndCollapsedClass([e],this._isShown(t))}}_getFirstLevelChildren(t){const e=z.find(Mt,this._config.parent);return z.find(t,this._config.parent).filter((t=>!e.includes(t)))}_addAriaAndCollapsedClass(t,e){if(t.length)for(const i of t)i.classList.toggle("collapsed",!e),i.setAttribute("aria-expanded",e)}static jQueryInterface(t){const e={};return"string"==typeof t&&/show|hide/.test(t)&&(e.toggle=!1),this.each((function(){const i=Bt.getOrCreateInstance(this,e);if("string"==typeof t){if(void 0===i[t])throw new TypeError(`No method named "${t}"`);i[t]()}}))}}N.on(document,It,Ft,(function(t){("A"===t.target.tagName||t.delegateTarget&&"A"===t.delegateTarget.tagName)&&t.preventDefault();for(const t of z.getMultipleElementsFromSelector(this))Bt.getOrCreateInstance(t,{toggle:!1}).toggle()})),m(Bt);var zt="top",Rt="bottom",qt="right",Vt="left",Kt="auto",Qt=[zt,Rt,qt,Vt],Xt="start",Yt="end",Ut="clippingParents",Gt="viewport",Jt="popper",Zt="reference",te=Qt.reduce((function(t,e){return t.concat([e+"-"+Xt,e+"-"+Yt])}),[]),ee=[].concat(Qt,[Kt]).reduce((function(t,e){return t.concat([e,e+"-"+Xt,e+"-"+Yt])}),[]),ie="beforeRead",ne="read",se="afterRead",oe="beforeMain",re="main",ae="afterMain",le="beforeWrite",ce="write",he="afterWrite",de=[ie,ne,se,oe,re,ae,le,ce,he];function ue(t){return t?(t.nodeName||"").toLowerCase():null}function fe(t){if(null==t)return window;if("[object Window]"!==t.toString()){var e=t.ownerDocument;return e&&e.defaultView||window}return t}function pe(t){return t instanceof fe(t).Element||t instanceof Element}function me(t){return t instanceof fe(t).HTMLElement||t instanceof HTMLElement}function ge(t){return"undefined"!=typeof ShadowRoot&&(t instanceof fe(t).ShadowRoot||t instanceof ShadowRoot)}const _e={name:"applyStyles",enabled:!0,phase:"write",fn:function(t){var e=t.state;Object.keys(e.elements).forEach((function(t){var i=e.styles[t]||{},n=e.attributes[t]||{},s=e.elements[t];me(s)&&ue(s)&&(Object.assign(s.style,i),Object.keys(n).forEach((function(t){var e=n[t];!1===e?s.removeAttribute(t):s.setAttribute(t,!0===e?"":e)})))}))},effect:function(t){var e=t.state,i={popper:{position:e.options.strategy,left:"0",top:"0",margin:"0"},arrow:{position:"absolute"},reference:{}};return Object.assign(e.elements.popper.style,i.popper),e.styles=i,e.elements.arrow&&Object.assign(e.elements.arrow.style,i.arrow),function(){Object.keys(e.elements).forEach((function(t){var n=e.elements[t],s=e.attributes[t]||{},o=Object.keys(e.styles.hasOwnProperty(t)?e.styles[t]:i[t]).reduce((function(t,e){return t[e]="",t}),{});me(n)&&ue(n)&&(Object.assign(n.style,o),Object.keys(s).forEach((function(t){n.removeAttribute(t)})))}))}},requires:["computeStyles"]};function be(t){return t.split("-")[0]}var ve=Math.max,ye=Math.min,we=Math.round;function Ae(){var t=navigator.userAgentData;return null!=t&&t.brands&&Array.isArray(t.brands)?t.brands.map((function(t){return t.brand+"/"+t.version})).join(" "):navigator.userAgent}function Ee(){return!/^((?!chrome|android).)*safari/i.test(Ae())}function Te(t,e,i){void 0===e&&(e=!1),void 0===i&&(i=!1);var n=t.getBoundingClientRect(),s=1,o=1;e&&me(t)&&(s=t.offsetWidth>0&&we(n.width)/t.offsetWidth||1,o=t.offsetHeight>0&&we(n.height)/t.offsetHeight||1);var r=(pe(t)?fe(t):window).visualViewport,a=!Ee()&&i,l=(n.left+(a&&r?r.offsetLeft:0))/s,c=(n.top+(a&&r?r.offsetTop:0))/o,h=n.width/s,d=n.height/o;return{width:h,height:d,top:c,right:l+h,bottom:c+d,left:l,x:l,y:c}}function Ce(t){var e=Te(t),i=t.offsetWidth,n=t.offsetHeight;return Math.abs(e.width-i)<=1&&(i=e.width),Math.abs(e.height-n)<=1&&(n=e.height),{x:t.offsetLeft,y:t.offsetTop,width:i,height:n}}function Oe(t,e){var i=e.getRootNode&&e.getRootNode();if(t.contains(e))return!0;if(i&&ge(i)){var n=e;do{if(n&&t.isSameNode(n))return!0;n=n.parentNode||n.host}while(n)}return!1}function xe(t){return fe(t).getComputedStyle(t)}function ke(t){return["table","td","th"].indexOf(ue(t))>=0}function Le(t){return((pe(t)?t.ownerDocument:t.document)||window.document).documentElement}function Se(t){return"html"===ue(t)?t:t.assignedSlot||t.parentNode||(ge(t)?t.host:null)||Le(t)}function De(t){return me(t)&&"fixed"!==xe(t).position?t.offsetParent:null}function $e(t){for(var e=fe(t),i=De(t);i&&ke(i)&&"static"===xe(i).position;)i=De(i);return i&&("html"===ue(i)||"body"===ue(i)&&"static"===xe(i).position)?e:i||function(t){var e=/firefox/i.test(Ae());if(/Trident/i.test(Ae())&&me(t)&&"fixed"===xe(t).position)return null;var i=Se(t);for(ge(i)&&(i=i.host);me(i)&&["html","body"].indexOf(ue(i))<0;){var n=xe(i);if("none"!==n.transform||"none"!==n.perspective||"paint"===n.contain||-1!==["transform","perspective"].indexOf(n.willChange)||e&&"filter"===n.willChange||e&&n.filter&&"none"!==n.filter)return i;i=i.parentNode}return null}(t)||e}function Ie(t){return["top","bottom"].indexOf(t)>=0?"x":"y"}function Ne(t,e,i){return ve(t,ye(e,i))}function Pe(t){return Object.assign({},{top:0,right:0,bottom:0,left:0},t)}function je(t,e){return e.reduce((function(e,i){return e[i]=t,e}),{})}const Me={name:"arrow",enabled:!0,phase:"main",fn:function(t){var e,i=t.state,n=t.name,s=t.options,o=i.elements.arrow,r=i.modifiersData.popperOffsets,a=be(i.placement),l=Ie(a),c=[Vt,qt].indexOf(a)>=0?"height":"width";if(o&&r){var h=function(t,e){return Pe("number"!=typeof(t="function"==typeof t?t(Object.assign({},e.rects,{placement:e.placement})):t)?t:je(t,Qt))}(s.padding,i),d=Ce(o),u="y"===l?zt:Vt,f="y"===l?Rt:qt,p=i.rects.reference[c]+i.rects.reference[l]-r[l]-i.rects.popper[c],m=r[l]-i.rects.reference[l],g=$e(o),_=g?"y"===l?g.clientHeight||0:g.clientWidth||0:0,b=p/2-m/2,v=h[u],y=_-d[c]-h[f],w=_/2-d[c]/2+b,A=Ne(v,w,y),E=l;i.modifiersData[n]=((e={})[E]=A,e.centerOffset=A-w,e)}},effect:function(t){var e=t.state,i=t.options.element,n=void 0===i?"[data-popper-arrow]":i;null!=n&&("string"!=typeof n||(n=e.elements.popper.querySelector(n)))&&Oe(e.elements.popper,n)&&(e.elements.arrow=n)},requires:["popperOffsets"],requiresIfExists:["preventOverflow"]};function Fe(t){return t.split("-")[1]}var He={top:"auto",right:"auto",bottom:"auto",left:"auto"};function We(t){var e,i=t.popper,n=t.popperRect,s=t.placement,o=t.variation,r=t.offsets,a=t.position,l=t.gpuAcceleration,c=t.adaptive,h=t.roundOffsets,d=t.isFixed,u=r.x,f=void 0===u?0:u,p=r.y,m=void 0===p?0:p,g="function"==typeof h?h({x:f,y:m}):{x:f,y:m};f=g.x,m=g.y;var _=r.hasOwnProperty("x"),b=r.hasOwnProperty("y"),v=Vt,y=zt,w=window;if(c){var A=$e(i),E="clientHeight",T="clientWidth";A===fe(i)&&"static"!==xe(A=Le(i)).position&&"absolute"===a&&(E="scrollHeight",T="scrollWidth"),(s===zt||(s===Vt||s===qt)&&o===Yt)&&(y=Rt,m-=(d&&A===w&&w.visualViewport?w.visualViewport.height:A[E])-n.height,m*=l?1:-1),s!==Vt&&(s!==zt&&s!==Rt||o!==Yt)||(v=qt,f-=(d&&A===w&&w.visualViewport?w.visualViewport.width:A[T])-n.width,f*=l?1:-1)}var C,O=Object.assign({position:a},c&&He),x=!0===h?function(t,e){var i=t.x,n=t.y,s=e.devicePixelRatio||1;return{x:we(i*s)/s||0,y:we(n*s)/s||0}}({x:f,y:m},fe(i)):{x:f,y:m};return f=x.x,m=x.y,l?Object.assign({},O,((C={})[y]=b?"0":"",C[v]=_?"0":"",C.transform=(w.devicePixelRatio||1)<=1?"translate("+f+"px, "+m+"px)":"translate3d("+f+"px, "+m+"px, 0)",C)):Object.assign({},O,((e={})[y]=b?m+"px":"",e[v]=_?f+"px":"",e.transform="",e))}const Be={name:"computeStyles",enabled:!0,phase:"beforeWrite",fn:function(t){var e=t.state,i=t.options,n=i.gpuAcceleration,s=void 0===n||n,o=i.adaptive,r=void 0===o||o,a=i.roundOffsets,l=void 0===a||a,c={placement:be(e.placement),variation:Fe(e.placement),popper:e.elements.popper,popperRect:e.rects.popper,gpuAcceleration:s,isFixed:"fixed"===e.options.strategy};null!=e.modifiersData.popperOffsets&&(e.styles.popper=Object.assign({},e.styles.popper,We(Object.assign({},c,{offsets:e.modifiersData.popperOffsets,position:e.options.strategy,adaptive:r,roundOffsets:l})))),null!=e.modifiersData.arrow&&(e.styles.arrow=Object.assign({},e.styles.arrow,We(Object.assign({},c,{offsets:e.modifiersData.arrow,position:"absolute",adaptive:!1,roundOffsets:l})))),e.attributes.popper=Object.assign({},e.attributes.popper,{"data-popper-placement":e.placement})},data:{}};var ze={passive:!0};const Re={name:"eventListeners",enabled:!0,phase:"write",fn:function(){},effect:function(t){var e=t.state,i=t.instance,n=t.options,s=n.scroll,o=void 0===s||s,r=n.resize,a=void 0===r||r,l=fe(e.elements.popper),c=[].concat(e.scrollParents.reference,e.scrollParents.popper);return o&&c.forEach((function(t){t.addEventListener("scroll",i.update,ze)})),a&&l.addEventListener("resize",i.update,ze),function(){o&&c.forEach((function(t){t.removeEventListener("scroll",i.update,ze)})),a&&l.removeEventListener("resize",i.update,ze)}},data:{}};var qe={left:"right",right:"left",bottom:"top",top:"bottom"};function Ve(t){return t.replace(/left|right|bottom|top/g,(function(t){return qe[t]}))}var Ke={start:"end",end:"start"};function Qe(t){return t.replace(/start|end/g,(function(t){return Ke[t]}))}function Xe(t){var e=fe(t);return{scrollLeft:e.pageXOffset,scrollTop:e.pageYOffset}}function Ye(t){return Te(Le(t)).left+Xe(t).scrollLeft}function Ue(t){var e=xe(t),i=e.overflow,n=e.overflowX,s=e.overflowY;return/auto|scroll|overlay|hidden/.test(i+s+n)}function Ge(t){return["html","body","#document"].indexOf(ue(t))>=0?t.ownerDocument.body:me(t)&&Ue(t)?t:Ge(Se(t))}function Je(t,e){var i;void 0===e&&(e=[]);var n=Ge(t),s=n===(null==(i=t.ownerDocument)?void 0:i.body),o=fe(n),r=s?[o].concat(o.visualViewport||[],Ue(n)?n:[]):n,a=e.concat(r);return s?a:a.concat(Je(Se(r)))}function Ze(t){return Object.assign({},t,{left:t.x,top:t.y,right:t.x+t.width,bottom:t.y+t.height})}function ti(t,e,i){return e===Gt?Ze(function(t,e){var i=fe(t),n=Le(t),s=i.visualViewport,o=n.clientWidth,r=n.clientHeight,a=0,l=0;if(s){o=s.width,r=s.height;var c=Ee();(c||!c&&"fixed"===e)&&(a=s.offsetLeft,l=s.offsetTop)}return{width:o,height:r,x:a+Ye(t),y:l}}(t,i)):pe(e)?function(t,e){var i=Te(t,!1,"fixed"===e);return i.top=i.top+t.clientTop,i.left=i.left+t.clientLeft,i.bottom=i.top+t.clientHeight,i.right=i.left+t.clientWidth,i.width=t.clientWidth,i.height=t.clientHeight,i.x=i.left,i.y=i.top,i}(e,i):Ze(function(t){var e,i=Le(t),n=Xe(t),s=null==(e=t.ownerDocument)?void 0:e.body,o=ve(i.scrollWidth,i.clientWidth,s?s.scrollWidth:0,s?s.clientWidth:0),r=ve(i.scrollHeight,i.clientHeight,s?s.scrollHeight:0,s?s.clientHeight:0),a=-n.scrollLeft+Ye(t),l=-n.scrollTop;return"rtl"===xe(s||i).direction&&(a+=ve(i.clientWidth,s?s.clientWidth:0)-o),{width:o,height:r,x:a,y:l}}(Le(t)))}function ei(t){var e,i=t.reference,n=t.element,s=t.placement,o=s?be(s):null,r=s?Fe(s):null,a=i.x+i.width/2-n.width/2,l=i.y+i.height/2-n.height/2;switch(o){case zt:e={x:a,y:i.y-n.height};break;case Rt:e={x:a,y:i.y+i.height};break;case qt:e={x:i.x+i.width,y:l};break;case Vt:e={x:i.x-n.width,y:l};break;default:e={x:i.x,y:i.y}}var c=o?Ie(o):null;if(null!=c){var h="y"===c?"height":"width";switch(r){case Xt:e[c]=e[c]-(i[h]/2-n[h]/2);break;case Yt:e[c]=e[c]+(i[h]/2-n[h]/2)}}return e}function ii(t,e){void 0===e&&(e={});var i=e,n=i.placement,s=void 0===n?t.placement:n,o=i.strategy,r=void 0===o?t.strategy:o,a=i.boundary,l=void 0===a?Ut:a,c=i.rootBoundary,h=void 0===c?Gt:c,d=i.elementContext,u=void 0===d?Jt:d,f=i.altBoundary,p=void 0!==f&&f,m=i.padding,g=void 0===m?0:m,_=Pe("number"!=typeof g?g:je(g,Qt)),b=u===Jt?Zt:Jt,v=t.rects.popper,y=t.elements[p?b:u],w=function(t,e,i,n){var s="clippingParents"===e?function(t){var e=Je(Se(t)),i=["absolute","fixed"].indexOf(xe(t).position)>=0&&me(t)?$e(t):t;return pe(i)?e.filter((function(t){return pe(t)&&Oe(t,i)&&"body"!==ue(t)})):[]}(t):[].concat(e),o=[].concat(s,[i]),r=o[0],a=o.reduce((function(e,i){var s=ti(t,i,n);return e.top=ve(s.top,e.top),e.right=ye(s.right,e.right),e.bottom=ye(s.bottom,e.bottom),e.left=ve(s.left,e.left),e}),ti(t,r,n));return a.width=a.right-a.left,a.height=a.bottom-a.top,a.x=a.left,a.y=a.top,a}(pe(y)?y:y.contextElement||Le(t.elements.popper),l,h,r),A=Te(t.elements.reference),E=ei({reference:A,element:v,strategy:"absolute",placement:s}),T=Ze(Object.assign({},v,E)),C=u===Jt?T:A,O={top:w.top-C.top+_.top,bottom:C.bottom-w.bottom+_.bottom,left:w.left-C.left+_.left,right:C.right-w.right+_.right},x=t.modifiersData.offset;if(u===Jt&&x){var k=x[s];Object.keys(O).forEach((function(t){var e=[qt,Rt].indexOf(t)>=0?1:-1,i=[zt,Rt].indexOf(t)>=0?"y":"x";O[t]+=k[i]*e}))}return O}function ni(t,e){void 0===e&&(e={});var i=e,n=i.placement,s=i.boundary,o=i.rootBoundary,r=i.padding,a=i.flipVariations,l=i.allowedAutoPlacements,c=void 0===l?ee:l,h=Fe(n),d=h?a?te:te.filter((function(t){return Fe(t)===h})):Qt,u=d.filter((function(t){return c.indexOf(t)>=0}));0===u.length&&(u=d);var f=u.reduce((function(e,i){return e[i]=ii(t,{placement:i,boundary:s,rootBoundary:o,padding:r})[be(i)],e}),{});return Object.keys(f).sort((function(t,e){return f[t]-f[e]}))}const si={name:"flip",enabled:!0,phase:"main",fn:function(t){var e=t.state,i=t.options,n=t.name;if(!e.modifiersData[n]._skip){for(var s=i.mainAxis,o=void 0===s||s,r=i.altAxis,a=void 0===r||r,l=i.fallbackPlacements,c=i.padding,h=i.boundary,d=i.rootBoundary,u=i.altBoundary,f=i.flipVariations,p=void 0===f||f,m=i.allowedAutoPlacements,g=e.options.placement,_=be(g),b=l||(_!==g&&p?function(t){if(be(t)===Kt)return[];var e=Ve(t);return[Qe(t),e,Qe(e)]}(g):[Ve(g)]),v=[g].concat(b).reduce((function(t,i){return t.concat(be(i)===Kt?ni(e,{placement:i,boundary:h,rootBoundary:d,padding:c,flipVariations:p,allowedAutoPlacements:m}):i)}),[]),y=e.rects.reference,w=e.rects.popper,A=new Map,E=!0,T=v[0],C=0;C<v.length;C++){var O=v[C],x=be(O),k=Fe(O)===Xt,L=[zt,Rt].indexOf(x)>=0,S=L?"width":"height",D=ii(e,{placement:O,boundary:h,rootBoundary:d,altBoundary:u,padding:c}),$=L?k?qt:Vt:k?Rt:zt;y[S]>w[S]&&($=Ve($));var I=Ve($),N=[];if(o&&N.push(D[x]<=0),a&&N.push(D[$]<=0,D[I]<=0),N.every((function(t){return t}))){T=O,E=!1;break}A.set(O,N)}if(E)for(var P=function(t){var e=v.find((function(e){var i=A.get(e);if(i)return i.slice(0,t).every((function(t){return t}))}));if(e)return T=e,"break"},j=p?3:1;j>0&&"break"!==P(j);j--);e.placement!==T&&(e.modifiersData[n]._skip=!0,e.placement=T,e.reset=!0)}},requiresIfExists:["offset"],data:{_skip:!1}};function oi(t,e,i){return void 0===i&&(i={x:0,y:0}),{top:t.top-e.height-i.y,right:t.right-e.width+i.x,bottom:t.bottom-e.height+i.y,left:t.left-e.width-i.x}}function ri(t){return[zt,qt,Rt,Vt].some((function(e){return t[e]>=0}))}const ai={name:"hide",enabled:!0,phase:"main",requiresIfExists:["preventOverflow"],fn:function(t){var e=t.state,i=t.name,n=e.rects.reference,s=e.rects.popper,o=e.modifiersData.preventOverflow,r=ii(e,{elementContext:"reference"}),a=ii(e,{altBoundary:!0}),l=oi(r,n),c=oi(a,s,o),h=ri(l),d=ri(c);e.modifiersData[i]={referenceClippingOffsets:l,popperEscapeOffsets:c,isReferenceHidden:h,hasPopperEscaped:d},e.attributes.popper=Object.assign({},e.attributes.popper,{"data-popper-reference-hidden":h,"data-popper-escaped":d})}},li={name:"offset",enabled:!0,phase:"main",requires:["popperOffsets"],fn:function(t){var e=t.state,i=t.options,n=t.name,s=i.offset,o=void 0===s?[0,0]:s,r=ee.reduce((function(t,i){return t[i]=function(t,e,i){var n=be(t),s=[Vt,zt].indexOf(n)>=0?-1:1,o="function"==typeof i?i(Object.assign({},e,{placement:t})):i,r=o[0],a=o[1];return r=r||0,a=(a||0)*s,[Vt,qt].indexOf(n)>=0?{x:a,y:r}:{x:r,y:a}}(i,e.rects,o),t}),{}),a=r[e.placement],l=a.x,c=a.y;null!=e.modifiersData.popperOffsets&&(e.modifiersData.popperOffsets.x+=l,e.modifiersData.popperOffsets.y+=c),e.modifiersData[n]=r}},ci={name:"popperOffsets",enabled:!0,phase:"read",fn:function(t){var e=t.state,i=t.name;e.modifiersData[i]=ei({reference:e.rects.reference,element:e.rects.popper,strategy:"absolute",placement:e.placement})},data:{}},hi={name:"preventOverflow",enabled:!0,phase:"main",fn:function(t){var e=t.state,i=t.options,n=t.name,s=i.mainAxis,o=void 0===s||s,r=i.altAxis,a=void 0!==r&&r,l=i.boundary,c=i.rootBoundary,h=i.altBoundary,d=i.padding,u=i.tether,f=void 0===u||u,p=i.tetherOffset,m=void 0===p?0:p,g=ii(e,{boundary:l,rootBoundary:c,padding:d,altBoundary:h}),_=be(e.placement),b=Fe(e.placement),v=!b,y=Ie(_),w="x"===y?"y":"x",A=e.modifiersData.popperOffsets,E=e.rects.reference,T=e.rects.popper,C="function"==typeof m?m(Object.assign({},e.rects,{placement:e.placement})):m,O="number"==typeof C?{mainAxis:C,altAxis:C}:Object.assign({mainAxis:0,altAxis:0},C),x=e.modifiersData.offset?e.modifiersData.offset[e.placement]:null,k={x:0,y:0};if(A){if(o){var L,S="y"===y?zt:Vt,D="y"===y?Rt:qt,$="y"===y?"height":"width",I=A[y],N=I+g[S],P=I-g[D],j=f?-T[$]/2:0,M=b===Xt?E[$]:T[$],F=b===Xt?-T[$]:-E[$],H=e.elements.arrow,W=f&&H?Ce(H):{width:0,height:0},B=e.modifiersData["arrow#persistent"]?e.modifiersData["arrow#persistent"].padding:{top:0,right:0,bottom:0,left:0},z=B[S],R=B[D],q=Ne(0,E[$],W[$]),V=v?E[$]/2-j-q-z-O.mainAxis:M-q-z-O.mainAxis,K=v?-E[$]/2+j+q+R+O.mainAxis:F+q+R+O.mainAxis,Q=e.elements.arrow&&$e(e.elements.arrow),X=Q?"y"===y?Q.clientTop||0:Q.clientLeft||0:0,Y=null!=(L=null==x?void 0:x[y])?L:0,U=I+K-Y,G=Ne(f?ye(N,I+V-Y-X):N,I,f?ve(P,U):P);A[y]=G,k[y]=G-I}if(a){var J,Z="x"===y?zt:Vt,tt="x"===y?Rt:qt,et=A[w],it="y"===w?"height":"width",nt=et+g[Z],st=et-g[tt],ot=-1!==[zt,Vt].indexOf(_),rt=null!=(J=null==x?void 0:x[w])?J:0,at=ot?nt:et-E[it]-T[it]-rt+O.altAxis,lt=ot?et+E[it]+T[it]-rt-O.altAxis:st,ct=f&&ot?function(t,e,i){var n=Ne(t,e,i);return n>i?i:n}(at,et,lt):Ne(f?at:nt,et,f?lt:st);A[w]=ct,k[w]=ct-et}e.modifiersData[n]=k}},requiresIfExists:["offset"]};function di(t,e,i){void 0===i&&(i=!1);var n,s,o=me(e),r=me(e)&&function(t){var e=t.getBoundingClientRect(),i=we(e.width)/t.offsetWidth||1,n=we(e.height)/t.offsetHeight||1;return 1!==i||1!==n}(e),a=Le(e),l=Te(t,r,i),c={scrollLeft:0,scrollTop:0},h={x:0,y:0};return(o||!o&&!i)&&(("body"!==ue(e)||Ue(a))&&(c=(n=e)!==fe(n)&&me(n)?{scrollLeft:(s=n).scrollLeft,scrollTop:s.scrollTop}:Xe(n)),me(e)?((h=Te(e,!0)).x+=e.clientLeft,h.y+=e.clientTop):a&&(h.x=Ye(a))),{x:l.left+c.scrollLeft-h.x,y:l.top+c.scrollTop-h.y,width:l.width,height:l.height}}function ui(t){var e=new Map,i=new Set,n=[];function s(t){i.add(t.name),[].concat(t.requires||[],t.requiresIfExists||[]).forEach((function(t){if(!i.has(t)){var n=e.get(t);n&&s(n)}})),n.push(t)}return t.forEach((function(t){e.set(t.name,t)})),t.forEach((function(t){i.has(t.name)||s(t)})),n}var fi={placement:"bottom",modifiers:[],strategy:"absolute"};function pi(){for(var t=arguments.length,e=new Array(t),i=0;i<t;i++)e[i]=arguments[i];return!e.some((function(t){return!(t&&"function"==typeof t.getBoundingClientRect)}))}function mi(t){void 0===t&&(t={});var e=t,i=e.defaultModifiers,n=void 0===i?[]:i,s=e.defaultOptions,o=void 0===s?fi:s;return function(t,e,i){void 0===i&&(i=o);var s,r,a={placement:"bottom",orderedModifiers:[],options:Object.assign({},fi,o),modifiersData:{},elements:{reference:t,popper:e},attributes:{},styles:{}},l=[],c=!1,h={state:a,setOptions:function(i){var s="function"==typeof i?i(a.options):i;d(),a.options=Object.assign({},o,a.options,s),a.scrollParents={reference:pe(t)?Je(t):t.contextElement?Je(t.contextElement):[],popper:Je(e)};var r,c,u=function(t){var e=ui(t);return de.reduce((function(t,i){return t.concat(e.filter((function(t){return t.phase===i})))}),[])}((r=[].concat(n,a.options.modifiers),c=r.reduce((function(t,e){var i=t[e.name];return t[e.name]=i?Object.assign({},i,e,{options:Object.assign({},i.options,e.options),data:Object.assign({},i.data,e.data)}):e,t}),{}),Object.keys(c).map((function(t){return c[t]}))));return a.orderedModifiers=u.filter((function(t){return t.enabled})),a.orderedModifiers.forEach((function(t){var e=t.name,i=t.options,n=void 0===i?{}:i,s=t.effect;if("function"==typeof s){var o=s({state:a,name:e,instance:h,options:n});l.push(o||function(){})}})),h.update()},forceUpdate:function(){if(!c){var t=a.elements,e=t.reference,i=t.popper;if(pi(e,i)){a.rects={reference:di(e,$e(i),"fixed"===a.options.strategy),popper:Ce(i)},a.reset=!1,a.placement=a.options.placement,a.orderedModifiers.forEach((function(t){return a.modifiersData[t.name]=Object.assign({},t.data)}));for(var n=0;n<a.orderedModifiers.length;n++)if(!0!==a.reset){var s=a.orderedModifiers[n],o=s.fn,r=s.options,l=void 0===r?{}:r,d=s.name;"function"==typeof o&&(a=o({state:a,options:l,name:d,instance:h})||a)}else a.reset=!1,n=-1}}},update:(s=function(){return new Promise((function(t){h.forceUpdate(),t(a)}))},function(){return r||(r=new Promise((function(t){Promise.resolve().then((function(){r=void 0,t(s())}))}))),r}),destroy:function(){d(),c=!0}};if(!pi(t,e))return h;function d(){l.forEach((function(t){return t()})),l=[]}return h.setOptions(i).then((function(t){!c&&i.onFirstUpdate&&i.onFirstUpdate(t)})),h}}var gi=mi(),_i=mi({defaultModifiers:[Re,ci,Be,_e]}),bi=mi({defaultModifiers:[Re,ci,Be,_e,li,si,hi,Me,ai]});const vi=Object.freeze(Object.defineProperty({__proto__:null,afterMain:ae,afterRead:se,afterWrite:he,applyStyles:_e,arrow:Me,auto:Kt,basePlacements:Qt,beforeMain:oe,beforeRead:ie,beforeWrite:le,bottom:Rt,clippingParents:Ut,computeStyles:Be,createPopper:bi,createPopperBase:gi,createPopperLite:_i,detectOverflow:ii,end:Yt,eventListeners:Re,flip:si,hide:ai,left:Vt,main:re,modifierPhases:de,offset:li,placements:ee,popper:Jt,popperGenerator:mi,popperOffsets:ci,preventOverflow:hi,read:ne,reference:Zt,right:qt,start:Xt,top:zt,variationPlacements:te,viewport:Gt,write:ce},Symbol.toStringTag,{value:"Module"})),yi="dropdown",wi=".bs.dropdown",Ai=".data-api",Ei="ArrowUp",Ti="ArrowDown",Ci=`hide${wi}`,Oi=`hidden${wi}`,xi=`show${wi}`,ki=`shown${wi}`,Li=`click${wi}${Ai}`,Si=`keydown${wi}${Ai}`,Di=`keyup${wi}${Ai}`,$i="show",Ii='[data-bs-toggle="dropdown"]:not(.disabled):not(:disabled)',Ni=`${Ii}.${$i}`,Pi=".dropdown-menu",ji=p()?"top-end":"top-start",Mi=p()?"top-start":"top-end",Fi=p()?"bottom-end":"bottom-start",Hi=p()?"bottom-start":"bottom-end",Wi=p()?"left-start":"right-start",Bi=p()?"right-start":"left-start",zi={autoClose:!0,boundary:"clippingParents",display:"dynamic",offset:[0,2],popperConfig:null,reference:"toggle"},Ri={autoClose:"(boolean|string)",boundary:"(string|element)",display:"string",offset:"(array|string|function)",popperConfig:"(null|object|function)",reference:"(string|element|object)"};class qi extends W{constructor(t,e){super(t,e),this._popper=null,this._parent=this._element.parentNode,this._menu=z.next(this._element,Pi)[0]||z.prev(this._element,Pi)[0]||z.findOne(Pi,this._parent),this._inNavbar=this._detectNavbar()}static get Default(){return zi}static get DefaultType(){return Ri}static get NAME(){return yi}toggle(){return this._isShown()?this.hide():this.show()}show(){if(l(this._element)||this._isShown())return;const t={relatedTarget:this._element};if(!N.trigger(this._element,xi,t).defaultPrevented){if(this._createPopper(),"ontouchstart"in document.documentElement&&!this._parent.closest(".navbar-nav"))for(const t of[].concat(...document.body.children))N.on(t,"mouseover",h);this._element.focus(),this._element.setAttribute("aria-expanded",!0),this._menu.classList.add($i),this._element.classList.add($i),N.trigger(this._element,ki,t)}}hide(){if(l(this._element)||!this._isShown())return;const t={relatedTarget:this._element};this._completeHide(t)}dispose(){this._popper&&this._popper.destroy(),super.dispose()}update(){this._inNavbar=this._detectNavbar(),this._popper&&this._popper.update()}_completeHide(t){if(!N.trigger(this._element,Ci,t).defaultPrevented){if("ontouchstart"in document.documentElement)for(const t of[].concat(...document.body.children))N.off(t,"mouseover",h);this._popper&&this._popper.destroy(),this._menu.classList.remove($i),this._element.classList.remove($i),this._element.setAttribute("aria-expanded","false"),F.removeDataAttribute(this._menu,"popper"),N.trigger(this._element,Oi,t)}}_getConfig(t){if("object"==typeof(t=super._getConfig(t)).reference&&!o(t.reference)&&"function"!=typeof t.reference.getBoundingClientRect)throw new TypeError(`${yi.toUpperCase()}: Option "reference" provided type "object" without a required "getBoundingClientRect" method.`);return t}_createPopper(){if(void 0===vi)throw new TypeError("Bootstrap's dropdowns require Popper (https://popper.js.org)");let t=this._element;"parent"===this._config.reference?t=this._parent:o(this._config.reference)?t=r(this._config.reference):"object"==typeof this._config.reference&&(t=this._config.reference);const e=this._getPopperConfig();this._popper=bi(t,this._menu,e)}_isShown(){return this._menu.classList.contains($i)}_getPlacement(){const t=this._parent;if(t.classList.contains("dropend"))return Wi;if(t.classList.contains("dropstart"))return Bi;if(t.classList.contains("dropup-center"))return"top";if(t.classList.contains("dropdown-center"))return"bottom";const e="end"===getComputedStyle(this._menu).getPropertyValue("--bs-position").trim();return t.classList.contains("dropup")?e?Mi:ji:e?Hi:Fi}_detectNavbar(){return null!==this._element.closest(".navbar")}_getOffset(){const{offset:t}=this._config;return"string"==typeof t?t.split(",").map((t=>Number.parseInt(t,10))):"function"==typeof t?e=>t(e,this._element):t}_getPopperConfig(){const t={placement:this._getPlacement(),modifiers:[{name:"preventOverflow",options:{boundary:this._config.boundary}},{name:"offset",options:{offset:this._getOffset()}}]};return(this._inNavbar||"static"===this._config.display)&&(F.setDataAttribute(this._menu,"popper","static"),t.modifiers=[{name:"applyStyles",enabled:!1}]),{...t,...g(this._config.popperConfig,[t])}}_selectMenuItem({key:t,target:e}){const i=z.find(".dropdown-menu .dropdown-item:not(.disabled):not(:disabled)",this._menu).filter((t=>a(t)));i.length&&b(i,e,t===Ti,!i.includes(e)).focus()}static jQueryInterface(t){return this.each((function(){const e=qi.getOrCreateInstance(this,t);if("string"==typeof t){if(void 0===e[t])throw new TypeError(`No method named "${t}"`);e[t]()}}))}static clearMenus(t){if(2===t.button||"keyup"===t.type&&"Tab"!==t.key)return;const e=z.find(Ni);for(const i of e){const e=qi.getInstance(i);if(!e||!1===e._config.autoClose)continue;const n=t.composedPath(),s=n.includes(e._menu);if(n.includes(e._element)||"inside"===e._config.autoClose&&!s||"outside"===e._config.autoClose&&s)continue;if(e._menu.contains(t.target)&&("keyup"===t.type&&"Tab"===t.key||/input|select|option|textarea|form/i.test(t.target.tagName)))continue;const o={relatedTarget:e._element};"click"===t.type&&(o.clickEvent=t),e._completeHide(o)}}static dataApiKeydownHandler(t){const e=/input|textarea/i.test(t.target.tagName),i="Escape"===t.key,n=[Ei,Ti].includes(t.key);if(!n&&!i)return;if(e&&!i)return;t.preventDefault();const s=this.matches(Ii)?this:z.prev(this,Ii)[0]||z.next(this,Ii)[0]||z.findOne(Ii,t.delegateTarget.parentNode),o=qi.getOrCreateInstance(s);if(n)return t.stopPropagation(),o.show(),void o._selectMenuItem(t);o._isShown()&&(t.stopPropagation(),o.hide(),s.focus())}}N.on(document,Si,Ii,qi.dataApiKeydownHandler),N.on(document,Si,Pi,qi.dataApiKeydownHandler),N.on(document,Li,qi.clearMenus),N.on(document,Di,qi.clearMenus),N.on(document,Li,Ii,(function(t){t.preventDefault(),qi.getOrCreateInstance(this).toggle()})),m(qi);const Vi="backdrop",Ki="show",Qi=`mousedown.bs.${Vi}`,Xi={className:"modal-backdrop",clickCallback:null,isAnimated:!1,isVisible:!0,rootElement:"body"},Yi={className:"string",clickCallback:"(function|null)",isAnimated:"boolean",isVisible:"boolean",rootElement:"(element|string)"};class Ui extends H{constructor(t){super(),this._config=this._getConfig(t),this._isAppended=!1,this._element=null}static get Default(){return Xi}static get DefaultType(){return Yi}static get NAME(){return Vi}show(t){if(!this._config.isVisible)return void g(t);this._append();const e=this._getElement();this._config.isAnimated&&d(e),e.classList.add(Ki),this._emulateAnimation((()=>{g(t)}))}hide(t){this._config.isVisible?(this._getElement().classList.remove(Ki),this._emulateAnimation((()=>{this.dispose(),g(t)}))):g(t)}dispose(){this._isAppended&&(N.off(this._element,Qi),this._element.remove(),this._isAppended=!1)}_getElement(){if(!this._element){const t=document.createElement("div");t.className=this._config.className,this._config.isAnimated&&t.classList.add("fade"),this._element=t}return this._element}_configAfterMerge(t){return t.rootElement=r(t.rootElement),t}_append(){if(this._isAppended)return;const t=this._getElement();this._config.rootElement.append(t),N.on(t,Qi,(()=>{g(this._config.clickCallback)})),this._isAppended=!0}_emulateAnimation(t){_(t,this._getElement(),this._config.isAnimated)}}const Gi=".bs.focustrap",Ji=`focusin${Gi}`,Zi=`keydown.tab${Gi}`,tn="backward",en={autofocus:!0,trapElement:null},nn={autofocus:"boolean",trapElement:"element"};class sn extends H{constructor(t){super(),this._config=this._getConfig(t),this._isActive=!1,this._lastTabNavDirection=null}static get Default(){return en}static get DefaultType(){return nn}static get NAME(){return"focustrap"}activate(){this._isActive||(this._config.autofocus&&this._config.trapElement.focus(),N.off(document,Gi),N.on(document,Ji,(t=>this._handleFocusin(t))),N.on(document,Zi,(t=>this._handleKeydown(t))),this._isActive=!0)}deactivate(){this._isActive&&(this._isActive=!1,N.off(document,Gi))}_handleFocusin(t){const{trapElement:e}=this._config;if(t.target===document||t.target===e||e.contains(t.target))return;const i=z.focusableChildren(e);0===i.length?e.focus():this._lastTabNavDirection===tn?i[i.length-1].focus():i[0].focus()}_handleKeydown(t){"Tab"===t.key&&(this._lastTabNavDirection=t.shiftKey?tn:"forward")}}const on=".fixed-top, .fixed-bottom, .is-fixed, .sticky-top",rn=".sticky-top",an="padding-right",ln="margin-right";class cn{constructor(){this._element=document.body}getWidth(){const t=document.documentElement.clientWidth;return Math.abs(window.innerWidth-t)}hide(){const t=this.getWidth();this._disableOverFlow(),this._setElementAttributes(this._element,an,(e=>e+t)),this._setElementAttributes(on,an,(e=>e+t)),this._setElementAttributes(rn,ln,(e=>e-t))}reset(){this._resetElementAttributes(this._element,"overflow"),this._resetElementAttributes(this._element,an),this._resetElementAttributes(on,an),this._resetElementAttributes(rn,ln)}isOverflowing(){return this.getWidth()>0}_disableOverFlow(){this._saveInitialAttribute(this._element,"overflow"),this._element.style.overflow="hidden"}_setElementAttributes(t,e,i){const n=this.getWidth();this._applyManipulationCallback(t,(t=>{if(t!==this._element&&window.innerWidth>t.clientWidth+n)return;this._saveInitialAttribute(t,e);const s=window.getComputedStyle(t).getPropertyValue(e);t.style.setProperty(e,`${i(Number.parseFloat(s))}px`)}))}_saveInitialAttribute(t,e){const i=t.style.getPropertyValue(e);i&&F.setDataAttribute(t,e,i)}_resetElementAttributes(t,e){this._applyManipulationCallback(t,(t=>{const i=F.getDataAttribute(t,e);null!==i?(F.removeDataAttribute(t,e),t.style.setProperty(e,i)):t.style.removeProperty(e)}))}_applyManipulationCallback(t,e){if(o(t))e(t);else for(const i of z.find(t,this._element))e(i)}}const hn=".bs.modal",dn=`hide${hn}`,un=`hidePrevented${hn}`,fn=`hidden${hn}`,pn=`show${hn}`,mn=`shown${hn}`,gn=`resize${hn}`,_n=`click.dismiss${hn}`,bn=`mousedown.dismiss${hn}`,vn=`keydown.dismiss${hn}`,yn=`click${hn}.data-api`,wn="modal-open",An="show",En="modal-static",Tn={backdrop:!0,focus:!0,keyboard:!0},Cn={backdrop:"(boolean|string)",focus:"boolean",keyboard:"boolean"};class On extends W{constructor(t,e){super(t,e),this._dialog=z.findOne(".modal-dialog",this._element),this._backdrop=this._initializeBackDrop(),this._focustrap=this._initializeFocusTrap(),this._isShown=!1,this._isTransitioning=!1,this._scrollBar=new cn,this._addEventListeners()}static get Default(){return Tn}static get DefaultType(){return Cn}static get NAME(){return"modal"}toggle(t){return this._isShown?this.hide():this.show(t)}show(t){this._isShown||this._isTransitioning||N.trigger(this._element,pn,{relatedTarget:t}).defaultPrevented||(this._isShown=!0,this._isTransitioning=!0,this._scrollBar.hide(),document.body.classList.add(wn),this._adjustDialog(),this._backdrop.show((()=>this._showElement(t))))}hide(){this._isShown&&!this._isTransitioning&&(N.trigger(this._element,dn).defaultPrevented||(this._isShown=!1,this._isTransitioning=!0,this._focustrap.deactivate(),this._element.classList.remove(An),this._queueCallback((()=>this._hideModal()),this._element,this._isAnimated())))}dispose(){N.off(window,hn),N.off(this._dialog,hn),this._backdrop.dispose(),this._focustrap.deactivate(),super.dispose()}handleUpdate(){this._adjustDialog()}_initializeBackDrop(){return new Ui({isVisible:Boolean(this._config.backdrop),isAnimated:this._isAnimated()})}_initializeFocusTrap(){return new sn({trapElement:this._element})}_showElement(t){document.body.contains(this._element)||document.body.append(this._element),this._element.style.display="block",this._element.removeAttribute("aria-hidden"),this._element.setAttribute("aria-modal",!0),this._element.setAttribute("role","dialog"),this._element.scrollTop=0;const e=z.findOne(".modal-body",this._dialog);e&&(e.scrollTop=0),d(this._element),this._element.classList.add(An),this._queueCallback((()=>{this._config.focus&&this._focustrap.activate(),this._isTransitioning=!1,N.trigger(this._element,mn,{relatedTarget:t})}),this._dialog,this._isAnimated())}_addEventListeners(){N.on(this._element,vn,(t=>{"Escape"===t.key&&(this._config.keyboard?this.hide():this._triggerBackdropTransition())})),N.on(window,gn,(()=>{this._isShown&&!this._isTransitioning&&this._adjustDialog()})),N.on(this._element,bn,(t=>{N.one(this._element,_n,(e=>{this._element===t.target&&this._element===e.target&&("static"!==this._config.backdrop?this._config.backdrop&&this.hide():this._triggerBackdropTransition())}))}))}_hideModal(){this._element.style.display="none",this._element.setAttribute("aria-hidden",!0),this._element.removeAttribute("aria-modal"),this._element.removeAttribute("role"),this._isTransitioning=!1,this._backdrop.hide((()=>{document.body.classList.remove(wn),this._resetAdjustments(),this._scrollBar.reset(),N.trigger(this._element,fn)}))}_isAnimated(){return this._element.classList.contains("fade")}_triggerBackdropTransition(){if(N.trigger(this._element,un).defaultPrevented)return;const t=this._element.scrollHeight>document.documentElement.clientHeight,e=this._element.style.overflowY;"hidden"===e||this._element.classList.contains(En)||(t||(this._element.style.overflowY="hidden"),this._element.classList.add(En),this._queueCallback((()=>{this._element.classList.remove(En),this._queueCallback((()=>{this._element.style.overflowY=e}),this._dialog)}),this._dialog),this._element.focus())}_adjustDialog(){const t=this._element.scrollHeight>document.documentElement.clientHeight,e=this._scrollBar.getWidth(),i=e>0;if(i&&!t){const t=p()?"paddingLeft":"paddingRight";this._element.style[t]=`${e}px`}if(!i&&t){const t=p()?"paddingRight":"paddingLeft";this._element.style[t]=`${e}px`}}_resetAdjustments(){this._element.style.paddingLeft="",this._element.style.paddingRight=""}static jQueryInterface(t,e){return this.each((function(){const i=On.getOrCreateInstance(this,t);if("string"==typeof t){if(void 0===i[t])throw new TypeError(`No method named "${t}"`);i[t](e)}}))}}N.on(document,yn,'[data-bs-toggle="modal"]',(function(t){const e=z.getElementFromSelector(this);["A","AREA"].includes(this.tagName)&&t.preventDefault(),N.one(e,pn,(t=>{t.defaultPrevented||N.one(e,fn,(()=>{a(this)&&this.focus()}))}));const i=z.findOne(".modal.show");i&&On.getInstance(i).hide(),On.getOrCreateInstance(e).toggle(this)})),R(On),m(On);const xn=".bs.offcanvas",kn=".data-api",Ln=`load${xn}${kn}`,Sn="show",Dn="showing",$n="hiding",In=".offcanvas.show",Nn=`show${xn}`,Pn=`shown${xn}`,jn=`hide${xn}`,Mn=`hidePrevented${xn}`,Fn=`hidden${xn}`,Hn=`resize${xn}`,Wn=`click${xn}${kn}`,Bn=`keydown.dismiss${xn}`,zn={backdrop:!0,keyboard:!0,scroll:!1},Rn={backdrop:"(boolean|string)",keyboard:"boolean",scroll:"boolean"};class qn extends W{constructor(t,e){super(t,e),this._isShown=!1,this._backdrop=this._initializeBackDrop(),this._focustrap=this._initializeFocusTrap(),this._addEventListeners()}static get Default(){return zn}static get DefaultType(){return Rn}static get NAME(){return"offcanvas"}toggle(t){return this._isShown?this.hide():this.show(t)}show(t){this._isShown||N.trigger(this._element,Nn,{relatedTarget:t}).defaultPrevented||(this._isShown=!0,this._backdrop.show(),this._config.scroll||(new cn).hide(),this._element.setAttribute("aria-modal",!0),this._element.setAttribute("role","dialog"),this._element.classList.add(Dn),this._queueCallback((()=>{this._config.scroll&&!this._config.backdrop||this._focustrap.activate(),this._element.classList.add(Sn),this._element.classList.remove(Dn),N.trigger(this._element,Pn,{relatedTarget:t})}),this._element,!0))}hide(){this._isShown&&(N.trigger(this._element,jn).defaultPrevented||(this._focustrap.deactivate(),this._element.blur(),this._isShown=!1,this._element.classList.add($n),this._backdrop.hide(),this._queueCallback((()=>{this._element.classList.remove(Sn,$n),this._element.removeAttribute("aria-modal"),this._element.removeAttribute("role"),this._config.scroll||(new cn).reset(),N.trigger(this._element,Fn)}),this._element,!0)))}dispose(){this._backdrop.dispose(),this._focustrap.deactivate(),super.dispose()}_initializeBackDrop(){const t=Boolean(this._config.backdrop);return new Ui({className:"offcanvas-backdrop",isVisible:t,isAnimated:!0,rootElement:this._element.parentNode,clickCallback:t?()=>{"static"!==this._config.backdrop?this.hide():N.trigger(this._element,Mn)}:null})}_initializeFocusTrap(){return new sn({trapElement:this._element})}_addEventListeners(){N.on(this._element,Bn,(t=>{"Escape"===t.key&&(this._config.keyboard?this.hide():N.trigger(this._element,Mn))}))}static jQueryInterface(t){return this.each((function(){const e=qn.getOrCreateInstance(this,t);if("string"==typeof t){if(void 0===e[t]||t.startsWith("_")||"constructor"===t)throw new TypeError(`No method named "${t}"`);e[t](this)}}))}}N.on(document,Wn,'[data-bs-toggle="offcanvas"]',(function(t){const e=z.getElementFromSelector(this);if(["A","AREA"].includes(this.tagName)&&t.preventDefault(),l(this))return;N.one(e,Fn,(()=>{a(this)&&this.focus()}));const i=z.findOne(In);i&&i!==e&&qn.getInstance(i).hide(),qn.getOrCreateInstance(e).toggle(this)})),N.on(window,Ln,(()=>{for(const t of z.find(In))qn.getOrCreateInstance(t).show()})),N.on(window,Hn,(()=>{for(const t of z.find("[aria-modal][class*=show][class*=offcanvas-]"))"fixed"!==getComputedStyle(t).position&&qn.getOrCreateInstance(t).hide()})),R(qn),m(qn);const Vn={"*":["class","dir","id","lang","role",/^aria-[\w-]*$/i],a:["target","href","title","rel"],area:[],b:[],br:[],col:[],code:[],dd:[],div:[],dl:[],dt:[],em:[],hr:[],h1:[],h2:[],h3:[],h4:[],h5:[],h6:[],i:[],img:["src","srcset","alt","title","width","height"],li:[],ol:[],p:[],pre:[],s:[],small:[],span:[],sub:[],sup:[],strong:[],u:[],ul:[]},Kn=new Set(["background","cite","href","itemtype","longdesc","poster","src","xlink:href"]),Qn=/^(?!javascript:)(?:[a-z0-9+.-]+:|[^&:/?#]*(?:[/?#]|$))/i,Xn=(t,e)=>{const i=t.nodeName.toLowerCase();return e.includes(i)?!Kn.has(i)||Boolean(Qn.test(t.nodeValue)):e.filter((t=>t instanceof RegExp)).some((t=>t.test(i)))},Yn={allowList:Vn,content:{},extraClass:"",html:!1,sanitize:!0,sanitizeFn:null,template:"<div></div>"},Un={allowList:"object",content:"object",extraClass:"(string|function)",html:"boolean",sanitize:"boolean",sanitizeFn:"(null|function)",template:"string"},Gn={entry:"(string|element|function|null)",selector:"(string|element)"};class Jn extends H{constructor(t){super(),this._config=this._getConfig(t)}static get Default(){return Yn}static get DefaultType(){return Un}static get NAME(){return"TemplateFactory"}getContent(){return Object.values(this._config.content).map((t=>this._resolvePossibleFunction(t))).filter(Boolean)}hasContent(){return this.getContent().length>0}changeContent(t){return this._checkContent(t),this._config.content={...this._config.content,...t},this}toHtml(){const t=document.createElement("div");t.innerHTML=this._maybeSanitize(this._config.template);for(const[e,i]of Object.entries(this._config.content))this._setContent(t,i,e);const e=t.children[0],i=this._resolvePossibleFunction(this._config.extraClass);return i&&e.classList.add(...i.split(" ")),e}_typeCheckConfig(t){super._typeCheckConfig(t),this._checkContent(t.content)}_checkContent(t){for(const[e,i]of Object.entries(t))super._typeCheckConfig({selector:e,entry:i},Gn)}_setContent(t,e,i){const n=z.findOne(i,t);n&&((e=this._resolvePossibleFunction(e))?o(e)?this._putElementInTemplate(r(e),n):this._config.html?n.innerHTML=this._maybeSanitize(e):n.textContent=e:n.remove())}_maybeSanitize(t){return this._config.sanitize?function(t,e,i){if(!t.length)return t;if(i&&"function"==typeof i)return i(t);const n=(new window.DOMParser).parseFromString(t,"text/html"),s=[].concat(...n.body.querySelectorAll("*"));for(const t of s){const i=t.nodeName.toLowerCase();if(!Object.keys(e).includes(i)){t.remove();continue}const n=[].concat(...t.attributes),s=[].concat(e["*"]||[],e[i]||[]);for(const e of n)Xn(e,s)||t.removeAttribute(e.nodeName)}return n.body.innerHTML}(t,this._config.allowList,this._config.sanitizeFn):t}_resolvePossibleFunction(t){return g(t,[this])}_putElementInTemplate(t,e){if(this._config.html)return e.innerHTML="",void e.append(t);e.textContent=t.textContent}}const Zn=new Set(["sanitize","allowList","sanitizeFn"]),ts="fade",es="show",is=".modal",ns="hide.bs.modal",ss="hover",os="focus",rs={AUTO:"auto",TOP:"top",RIGHT:p()?"left":"right",BOTTOM:"bottom",LEFT:p()?"right":"left"},as={allowList:Vn,animation:!0,boundary:"clippingParents",container:!1,customClass:"",delay:0,fallbackPlacements:["top","right","bottom","left"],html:!1,offset:[0,6],placement:"top",popperConfig:null,sanitize:!0,sanitizeFn:null,selector:!1,template:'<div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',title:"",trigger:"hover focus"},ls={allowList:"object",animation:"boolean",boundary:"(string|element)",container:"(string|element|boolean)",customClass:"(string|function)",delay:"(number|object)",fallbackPlacements:"array",html:"boolean",offset:"(array|string|function)",placement:"(string|function)",popperConfig:"(null|object|function)",sanitize:"boolean",sanitizeFn:"(null|function)",selector:"(string|boolean)",template:"string",title:"(string|element|function)",trigger:"string"};class cs extends W{constructor(t,e){if(void 0===vi)throw new TypeError("Bootstrap's tooltips require Popper (https://popper.js.org)");super(t,e),this._isEnabled=!0,this._timeout=0,this._isHovered=null,this._activeTrigger={},this._popper=null,this._templateFactory=null,this._newContent=null,this.tip=null,this._setListeners(),this._config.selector||this._fixTitle()}static get Default(){return as}static get DefaultType(){return ls}static get NAME(){return"tooltip"}enable(){this._isEnabled=!0}disable(){this._isEnabled=!1}toggleEnabled(){this._isEnabled=!this._isEnabled}toggle(){this._isEnabled&&(this._activeTrigger.click=!this._activeTrigger.click,this._isShown()?this._leave():this._enter())}dispose(){clearTimeout(this._timeout),N.off(this._element.closest(is),ns,this._hideModalHandler),this._element.getAttribute("data-bs-original-title")&&this._element.setAttribute("title",this._element.getAttribute("data-bs-original-title")),this._disposePopper(),super.dispose()}show(){if("none"===this._element.style.display)throw new Error("Please use show on visible elements");if(!this._isWithContent()||!this._isEnabled)return;const t=N.trigger(this._element,this.constructor.eventName("show")),e=(c(this._element)||this._element.ownerDocument.documentElement).contains(this._element);if(t.defaultPrevented||!e)return;this._disposePopper();const i=this._getTipElement();this._element.setAttribute("aria-describedby",i.getAttribute("id"));const{container:n}=this._config;if(this._element.ownerDocument.documentElement.contains(this.tip)||(n.append(i),N.trigger(this._element,this.constructor.eventName("inserted"))),this._popper=this._createPopper(i),i.classList.add(es),"ontouchstart"in document.documentElement)for(const t of[].concat(...document.body.children))N.on(t,"mouseover",h);this._queueCallback((()=>{N.trigger(this._element,this.constructor.eventName("shown")),!1===this._isHovered&&this._leave(),this._isHovered=!1}),this.tip,this._isAnimated())}hide(){if(this._isShown()&&!N.trigger(this._element,this.constructor.eventName("hide")).defaultPrevented){if(this._getTipElement().classList.remove(es),"ontouchstart"in document.documentElement)for(const t of[].concat(...document.body.children))N.off(t,"mouseover",h);this._activeTrigger.click=!1,this._activeTrigger[os]=!1,this._activeTrigger[ss]=!1,this._isHovered=null,this._queueCallback((()=>{this._isWithActiveTrigger()||(this._isHovered||this._disposePopper(),this._element.removeAttribute("aria-describedby"),N.trigger(this._element,this.constructor.eventName("hidden")))}),this.tip,this._isAnimated())}}update(){this._popper&&this._popper.update()}_isWithContent(){return Boolean(this._getTitle())}_getTipElement(){return this.tip||(this.tip=this._createTipElement(this._newContent||this._getContentForTemplate())),this.tip}_createTipElement(t){const e=this._getTemplateFactory(t).toHtml();if(!e)return null;e.classList.remove(ts,es),e.classList.add(`bs-${this.constructor.NAME}-auto`);const i=(t=>{do{t+=Math.floor(1e6*Math.random())}while(document.getElementById(t));return t})(this.constructor.NAME).toString();return e.setAttribute("id",i),this._isAnimated()&&e.classList.add(ts),e}setContent(t){this._newContent=t,this._isShown()&&(this._disposePopper(),this.show())}_getTemplateFactory(t){return this._templateFactory?this._templateFactory.changeContent(t):this._templateFactory=new Jn({...this._config,content:t,extraClass:this._resolvePossibleFunction(this._config.customClass)}),this._templateFactory}_getContentForTemplate(){return{".tooltip-inner":this._getTitle()}}_getTitle(){return this._resolvePossibleFunction(this._config.title)||this._element.getAttribute("data-bs-original-title")}_initializeOnDelegatedTarget(t){return this.constructor.getOrCreateInstance(t.delegateTarget,this._getDelegateConfig())}_isAnimated(){return this._config.animation||this.tip&&this.tip.classList.contains(ts)}_isShown(){return this.tip&&this.tip.classList.contains(es)}_createPopper(t){const e=g(this._config.placement,[this,t,this._element]),i=rs[e.toUpperCase()];return bi(this._element,t,this._getPopperConfig(i))}_getOffset(){const{offset:t}=this._config;return"string"==typeof t?t.split(",").map((t=>Number.parseInt(t,10))):"function"==typeof t?e=>t(e,this._element):t}_resolvePossibleFunction(t){return g(t,[this._element])}_getPopperConfig(t){const e={placement:t,modifiers:[{name:"flip",options:{fallbackPlacements:this._config.fallbackPlacements}},{name:"offset",options:{offset:this._getOffset()}},{name:"preventOverflow",options:{boundary:this._config.boundary}},{name:"arrow",options:{element:`.${this.constructor.NAME}-arrow`}},{name:"preSetPlacement",enabled:!0,phase:"beforeMain",fn:t=>{this._getTipElement().setAttribute("data-popper-placement",t.state.placement)}}]};return{...e,...g(this._config.popperConfig,[e])}}_setListeners(){const t=this._config.trigger.split(" ");for(const e of t)if("click"===e)N.on(this._element,this.constructor.eventName("click"),this._config.selector,(t=>{this._initializeOnDelegatedTarget(t).toggle()}));else if("manual"!==e){const t=e===ss?this.constructor.eventName("mouseenter"):this.constructor.eventName("focusin"),i=e===ss?this.constructor.eventName("mouseleave"):this.constructor.eventName("focusout");N.on(this._element,t,this._config.selector,(t=>{const e=this._initializeOnDelegatedTarget(t);e._activeTrigger["focusin"===t.type?os:ss]=!0,e._enter()})),N.on(this._element,i,this._config.selector,(t=>{const e=this._initializeOnDelegatedTarget(t);e._activeTrigger["focusout"===t.type?os:ss]=e._element.contains(t.relatedTarget),e._leave()}))}this._hideModalHandler=()=>{this._element&&this.hide()},N.on(this._element.closest(is),ns,this._hideModalHandler)}_fixTitle(){const t=this._element.getAttribute("title");t&&(this._element.getAttribute("aria-label")||this._element.textContent.trim()||this._element.setAttribute("aria-label",t),this._element.setAttribute("data-bs-original-title",t),this._element.removeAttribute("title"))}_enter(){this._isShown()||this._isHovered?this._isHovered=!0:(this._isHovered=!0,this._setTimeout((()=>{this._isHovered&&this.show()}),this._config.delay.show))}_leave(){this._isWithActiveTrigger()||(this._isHovered=!1,this._setTimeout((()=>{this._isHovered||this.hide()}),this._config.delay.hide))}_setTimeout(t,e){clearTimeout(this._timeout),this._timeout=setTimeout(t,e)}_isWithActiveTrigger(){return Object.values(this._activeTrigger).includes(!0)}_getConfig(t){const e=F.getDataAttributes(this._element);for(const t of Object.keys(e))Zn.has(t)&&delete e[t];return t={...e,..."object"==typeof t&&t?t:{}},t=this._mergeConfigObj(t),t=this._configAfterMerge(t),this._typeCheckConfig(t),t}_configAfterMerge(t){return t.container=!1===t.container?document.body:r(t.container),"number"==typeof t.delay&&(t.delay={show:t.delay,hide:t.delay}),"number"==typeof t.title&&(t.title=t.title.toString()),"number"==typeof t.content&&(t.content=t.content.toString()),t}_getDelegateConfig(){const t={};for(const[e,i]of Object.entries(this._config))this.constructor.Default[e]!==i&&(t[e]=i);return t.selector=!1,t.trigger="manual",t}_disposePopper(){this._popper&&(this._popper.destroy(),this._popper=null),this.tip&&(this.tip.remove(),this.tip=null)}static jQueryInterface(t){return this.each((function(){const e=cs.getOrCreateInstance(this,t);if("string"==typeof t){if(void 0===e[t])throw new TypeError(`No method named "${t}"`);e[t]()}}))}}m(cs);const hs={...cs.Default,content:"",offset:[0,8],placement:"right",template:'<div class="popover" role="tooltip"><div class="popover-arrow"></div><h3 class="popover-header"></h3><div class="popover-body"></div></div>',trigger:"click"},ds={...cs.DefaultType,content:"(null|string|element|function)"};class us extends cs{static get Default(){return hs}static get DefaultType(){return ds}static get NAME(){return"popover"}_isWithContent(){return this._getTitle()||this._getContent()}_getContentForTemplate(){return{".popover-header":this._getTitle(),".popover-body":this._getContent()}}_getContent(){return this._resolvePossibleFunction(this._config.content)}static jQueryInterface(t){return this.each((function(){const e=us.getOrCreateInstance(this,t);if("string"==typeof t){if(void 0===e[t])throw new TypeError(`No method named "${t}"`);e[t]()}}))}}m(us);const fs=".bs.scrollspy",ps=`activate${fs}`,ms=`click${fs}`,gs=`load${fs}.data-api`,_s="active",bs="[href]",vs=".nav-link",ys=`${vs}, .nav-item > ${vs}, .list-group-item`,ws={offset:null,rootMargin:"0px 0px -25%",smoothScroll:!1,target:null,threshold:[.1,.5,1]},As={offset:"(number|null)",rootMargin:"string",smoothScroll:"boolean",target:"element",threshold:"array"};class Es extends W{constructor(t,e){super(t,e),this._targetLinks=new Map,this._observableSections=new Map,this._rootElement="visible"===getComputedStyle(this._element).overflowY?null:this._element,this._activeTarget=null,this._observer=null,this._previousScrollData={visibleEntryTop:0,parentScrollTop:0},this.refresh()}static get Default(){return ws}static get DefaultType(){return As}static get NAME(){return"scrollspy"}refresh(){this._initializeTargetsAndObservables(),this._maybeEnableSmoothScroll(),this._observer?this._observer.disconnect():this._observer=this._getNewObserver();for(const t of this._observableSections.values())this._observer.observe(t)}dispose(){this._observer.disconnect(),super.dispose()}_configAfterMerge(t){return t.target=r(t.target)||document.body,t.rootMargin=t.offset?`${t.offset}px 0px -30%`:t.rootMargin,"string"==typeof t.threshold&&(t.threshold=t.threshold.split(",").map((t=>Number.parseFloat(t)))),t}_maybeEnableSmoothScroll(){this._config.smoothScroll&&(N.off(this._config.target,ms),N.on(this._config.target,ms,bs,(t=>{const e=this._observableSections.get(t.target.hash);if(e){t.preventDefault();const i=this._rootElement||window,n=e.offsetTop-this._element.offsetTop;if(i.scrollTo)return void i.scrollTo({top:n,behavior:"smooth"});i.scrollTop=n}})))}_getNewObserver(){const t={root:this._rootElement,threshold:this._config.threshold,rootMargin:this._config.rootMargin};return new IntersectionObserver((t=>this._observerCallback(t)),t)}_observerCallback(t){const e=t=>this._targetLinks.get(`#${t.target.id}`),i=t=>{this._previousScrollData.visibleEntryTop=t.target.offsetTop,this._process(e(t))},n=(this._rootElement||document.documentElement).scrollTop,s=n>=this._previousScrollData.parentScrollTop;this._previousScrollData.parentScrollTop=n;for(const o of t){if(!o.isIntersecting){this._activeTarget=null,this._clearActiveClass(e(o));continue}const t=o.target.offsetTop>=this._previousScrollData.visibleEntryTop;if(s&&t){if(i(o),!n)return}else s||t||i(o)}}_initializeTargetsAndObservables(){this._targetLinks=new Map,this._observableSections=new Map;const t=z.find(bs,this._config.target);for(const e of t){if(!e.hash||l(e))continue;const t=z.findOne(decodeURI(e.hash),this._element);a(t)&&(this._targetLinks.set(decodeURI(e.hash),e),this._observableSections.set(e.hash,t))}}_process(t){this._activeTarget!==t&&(this._clearActiveClass(this._config.target),this._activeTarget=t,t.classList.add(_s),this._activateParents(t),N.trigger(this._element,ps,{relatedTarget:t}))}_activateParents(t){if(t.classList.contains("dropdown-item"))z.findOne(".dropdown-toggle",t.closest(".dropdown")).classList.add(_s);else for(const e of z.parents(t,".nav, .list-group"))for(const t of z.prev(e,ys))t.classList.add(_s)}_clearActiveClass(t){t.classList.remove(_s);const e=z.find(`${bs}.${_s}`,t);for(const t of e)t.classList.remove(_s)}static jQueryInterface(t){return this.each((function(){const e=Es.getOrCreateInstance(this,t);if("string"==typeof t){if(void 0===e[t]||t.startsWith("_")||"constructor"===t)throw new TypeError(`No method named "${t}"`);e[t]()}}))}}N.on(window,gs,(()=>{for(const t of z.find('[data-bs-spy="scroll"]'))Es.getOrCreateInstance(t)})),m(Es);const Ts=".bs.tab",Cs=`hide${Ts}`,Os=`hidden${Ts}`,xs=`show${Ts}`,ks=`shown${Ts}`,Ls=`click${Ts}`,Ss=`keydown${Ts}`,Ds=`load${Ts}`,$s="ArrowLeft",Is="ArrowRight",Ns="ArrowUp",Ps="ArrowDown",js="Home",Ms="End",Fs="active",Hs="fade",Ws="show",Bs=".dropdown-toggle",zs=`:not(${Bs})`,Rs='[data-bs-toggle="tab"], [data-bs-toggle="pill"], [data-bs-toggle="list"]',qs=`.nav-link${zs}, .list-group-item${zs}, [role="tab"]${zs}, ${Rs}`,Vs=`.${Fs}[data-bs-toggle="tab"], .${Fs}[data-bs-toggle="pill"], .${Fs}[data-bs-toggle="list"]`;class Ks extends W{constructor(t){super(t),this._parent=this._element.closest('.list-group, .nav, [role="tablist"]'),this._parent&&(this._setInitialAttributes(this._parent,this._getChildren()),N.on(this._element,Ss,(t=>this._keydown(t))))}static get NAME(){return"tab"}show(){const t=this._element;if(this._elemIsActive(t))return;const e=this._getActiveElem(),i=e?N.trigger(e,Cs,{relatedTarget:t}):null;N.trigger(t,xs,{relatedTarget:e}).defaultPrevented||i&&i.defaultPrevented||(this._deactivate(e,t),this._activate(t,e))}_activate(t,e){t&&(t.classList.add(Fs),this._activate(z.getElementFromSelector(t)),this._queueCallback((()=>{"tab"===t.getAttribute("role")?(t.removeAttribute("tabindex"),t.setAttribute("aria-selected",!0),this._toggleDropDown(t,!0),N.trigger(t,ks,{relatedTarget:e})):t.classList.add(Ws)}),t,t.classList.contains(Hs)))}_deactivate(t,e){t&&(t.classList.remove(Fs),t.blur(),this._deactivate(z.getElementFromSelector(t)),this._queueCallback((()=>{"tab"===t.getAttribute("role")?(t.setAttribute("aria-selected",!1),t.setAttribute("tabindex","-1"),this._toggleDropDown(t,!1),N.trigger(t,Os,{relatedTarget:e})):t.classList.remove(Ws)}),t,t.classList.contains(Hs)))}_keydown(t){if(![$s,Is,Ns,Ps,js,Ms].includes(t.key))return;t.stopPropagation(),t.preventDefault();const e=this._getChildren().filter((t=>!l(t)));let i;if([js,Ms].includes(t.key))i=e[t.key===js?0:e.length-1];else{const n=[Is,Ps].includes(t.key);i=b(e,t.target,n,!0)}i&&(i.focus({preventScroll:!0}),Ks.getOrCreateInstance(i).show())}_getChildren(){return z.find(qs,this._parent)}_getActiveElem(){return this._getChildren().find((t=>this._elemIsActive(t)))||null}_setInitialAttributes(t,e){this._setAttributeIfNotExists(t,"role","tablist");for(const t of e)this._setInitialAttributesOnChild(t)}_setInitialAttributesOnChild(t){t=this._getInnerElement(t);const e=this._elemIsActive(t),i=this._getOuterElement(t);t.setAttribute("aria-selected",e),i!==t&&this._setAttributeIfNotExists(i,"role","presentation"),e||t.setAttribute("tabindex","-1"),this._setAttributeIfNotExists(t,"role","tab"),this._setInitialAttributesOnTargetPanel(t)}_setInitialAttributesOnTargetPanel(t){const e=z.getElementFromSelector(t);e&&(this._setAttributeIfNotExists(e,"role","tabpanel"),t.id&&this._setAttributeIfNotExists(e,"aria-labelledby",`${t.id}`))}_toggleDropDown(t,e){const i=this._getOuterElement(t);if(!i.classList.contains("dropdown"))return;const n=(t,n)=>{const s=z.findOne(t,i);s&&s.classList.toggle(n,e)};n(Bs,Fs),n(".dropdown-menu",Ws),i.setAttribute("aria-expanded",e)}_setAttributeIfNotExists(t,e,i){t.hasAttribute(e)||t.setAttribute(e,i)}_elemIsActive(t){return t.classList.contains(Fs)}_getInnerElement(t){return t.matches(qs)?t:z.findOne(qs,t)}_getOuterElement(t){return t.closest(".nav-item, .list-group-item")||t}static jQueryInterface(t){return this.each((function(){const e=Ks.getOrCreateInstance(this);if("string"==typeof t){if(void 0===e[t]||t.startsWith("_")||"constructor"===t)throw new TypeError(`No method named "${t}"`);e[t]()}}))}}N.on(document,Ls,Rs,(function(t){["A","AREA"].includes(this.tagName)&&t.preventDefault(),l(this)||Ks.getOrCreateInstance(this).show()})),N.on(window,Ds,(()=>{for(const t of z.find(Vs))Ks.getOrCreateInstance(t)})),m(Ks);const Qs=".bs.toast",Xs=`mouseover${Qs}`,Ys=`mouseout${Qs}`,Us=`focusin${Qs}`,Gs=`focusout${Qs}`,Js=`hide${Qs}`,Zs=`hidden${Qs}`,to=`show${Qs}`,eo=`shown${Qs}`,io="hide",no="show",so="showing",oo={animation:"boolean",autohide:"boolean",delay:"number"},ro={animation:!0,autohide:!0,delay:5e3};class ao extends W{constructor(t,e){super(t,e),this._timeout=null,this._hasMouseInteraction=!1,this._hasKeyboardInteraction=!1,this._setListeners()}static get Default(){return ro}static get DefaultType(){return oo}static get NAME(){return"toast"}show(){N.trigger(this._element,to).defaultPrevented||(this._clearTimeout(),this._config.animation&&this._element.classList.add("fade"),this._element.classList.remove(io),d(this._element),this._element.classList.add(no,so),this._queueCallback((()=>{this._element.classList.remove(so),N.trigger(this._element,eo),this._maybeScheduleHide()}),this._element,this._config.animation))}hide(){this.isShown()&&(N.trigger(this._element,Js).defaultPrevented||(this._element.classList.add(so),this._queueCallback((()=>{this._element.classList.add(io),this._element.classList.remove(so,no),N.trigger(this._element,Zs)}),this._element,this._config.animation)))}dispose(){this._clearTimeout(),this.isShown()&&this._element.classList.remove(no),super.dispose()}isShown(){return this._element.classList.contains(no)}_maybeScheduleHide(){this._config.autohide&&(this._hasMouseInteraction||this._hasKeyboardInteraction||(this._timeout=setTimeout((()=>{this.hide()}),this._config.delay)))}_onInteraction(t,e){switch(t.type){case"mouseover":case"mouseout":this._hasMouseInteraction=e;break;case"focusin":case"focusout":this._hasKeyboardInteraction=e}if(e)return void this._clearTimeout();const i=t.relatedTarget;this._element===i||this._element.contains(i)||this._maybeScheduleHide()}_setListeners(){N.on(this._element,Xs,(t=>this._onInteraction(t,!0))),N.on(this._element,Ys,(t=>this._onInteraction(t,!1))),N.on(this._element,Us,(t=>this._onInteraction(t,!0))),N.on(this._element,Gs,(t=>this._onInteraction(t,!1)))}_clearTimeout(){clearTimeout(this._timeout),this._timeout=null}static jQueryInterface(t){return this.each((function(){const e=ao.getOrCreateInstance(this,t);if("string"==typeof t){if(void 0===e[t])throw new TypeError(`No method named "${t}"`);e[t](this)}}))}}return R(ao),m(ao),{Alert:Q,Button:Y,Carousel:xt,Collapse:Bt,Dropdown:qi,Modal:On,Offcanvas:qn,Popover:us,ScrollSpy:Es,Tab:Ks,Toast:ao,Tooltip:cs}}));
+//# sourceMappingURL=bootstrap.bundle.min.js.map
\ No newline at end of file
diff --git a/public/themeBootstrap.min.css b/public/themeBootstrap.min.css
new file mode 100644
index 0000000..3993414
--- /dev/null
+++ b/public/themeBootstrap.min.css
@@ -0,0 +1,6 @@
+@charset "UTF-8";/*!
+ * Bootstrap  v5.3.3 (https://getbootstrap.com/)
+ * Copyright 2011-2024 The Bootstrap Authors
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+ */:root,[data-bs-theme=light]{--bs-blue:#0d6efd;--bs-indigo:#6610f2;--bs-purple:#6f42c1;--bs-pink:#d63384;--bs-red:#dc3545;--bs-orange:#fd7e14;--bs-yellow:#ffc107;--bs-green:#198754;--bs-teal:#20c997;--bs-cyan:#0dcaf0;--bs-black:#000;--bs-white:#fff;--bs-gray:#6c757d;--bs-gray-dark:#343a40;--bs-gray-100:#f8f9fa;--bs-gray-200:#e9ecef;--bs-gray-300:#dee2e6;--bs-gray-400:#ced4da;--bs-gray-500:#adb5bd;--bs-gray-600:#6c757d;--bs-gray-700:#495057;--bs-gray-800:#343a40;--bs-gray-900:#212529;--bs-primary:#0d6efd;--bs-secondary:#6c757d;--bs-success:#198754;--bs-info:#0dcaf0;--bs-warning:#ffc107;--bs-danger:#dc3545;--bs-light:#f8f9fa;--bs-dark:#212529;--bs-primary-rgb:13,110,253;--bs-secondary-rgb:108,117,125;--bs-success-rgb:25,135,84;--bs-info-rgb:13,202,240;--bs-warning-rgb:255,193,7;--bs-danger-rgb:220,53,69;--bs-light-rgb:248,249,250;--bs-dark-rgb:33,37,41;--bs-primary-text-emphasis:#052c65;--bs-secondary-text-emphasis:#2b2f32;--bs-success-text-emphasis:#0a3622;--bs-info-text-emphasis:#055160;--bs-warning-text-emphasis:#664d03;--bs-danger-text-emphasis:#58151c;--bs-light-text-emphasis:#495057;--bs-dark-text-emphasis:#495057;--bs-primary-bg-subtle:#cfe2ff;--bs-secondary-bg-subtle:#e2e3e5;--bs-success-bg-subtle:#d1e7dd;--bs-info-bg-subtle:#cff4fc;--bs-warning-bg-subtle:#fff3cd;--bs-danger-bg-subtle:#f8d7da;--bs-light-bg-subtle:#fcfcfd;--bs-dark-bg-subtle:#ced4da;--bs-primary-border-subtle:#9ec5fe;--bs-secondary-border-subtle:#c4c8cb;--bs-success-border-subtle:#a3cfbb;--bs-info-border-subtle:#9eeaf9;--bs-warning-border-subtle:#ffe69c;--bs-danger-border-subtle:#f1aeb5;--bs-light-border-subtle:#e9ecef;--bs-dark-border-subtle:#adb5bd;--bs-white-rgb:255,255,255;--bs-black-rgb:0,0,0;--bs-font-sans-serif:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--bs-font-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--bs-gradient:linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));--bs-body-font-family:var(--bs-font-sans-serif);--bs-body-font-size:1rem;--bs-body-font-weight:400;--bs-body-line-height:1.5;--bs-body-color:#212529;--bs-body-color-rgb:33,37,41;--bs-body-bg:#fff;--bs-body-bg-rgb:255,255,255;--bs-emphasis-color:#000;--bs-emphasis-color-rgb:0,0,0;--bs-secondary-color:rgba(33, 37, 41, 0.75);--bs-secondary-color-rgb:33,37,41;--bs-secondary-bg:#e9ecef;--bs-secondary-bg-rgb:233,236,239;--bs-tertiary-color:rgba(33, 37, 41, 0.5);--bs-tertiary-color-rgb:33,37,41;--bs-tertiary-bg:#f8f9fa;--bs-tertiary-bg-rgb:248,249,250;--bs-heading-color:inherit;--bs-link-color:#0d6efd;--bs-link-color-rgb:13,110,253;--bs-link-decoration:underline;--bs-link-hover-color:#0a58ca;--bs-link-hover-color-rgb:10,88,202;--bs-code-color:#d63384;--bs-highlight-color:#212529;--bs-highlight-bg:#fff3cd;--bs-border-width:1px;--bs-border-style:solid;--bs-border-color:#dee2e6;--bs-border-color-translucent:rgba(0, 0, 0, 0.175);--bs-border-radius:0.375rem;--bs-border-radius-sm:0.25rem;--bs-border-radius-lg:0.5rem;--bs-border-radius-xl:1rem;--bs-border-radius-xxl:2rem;--bs-border-radius-2xl:var(--bs-border-radius-xxl);--bs-border-radius-pill:50rem;--bs-box-shadow:0 0.5rem 1rem rgba(0, 0, 0, 0.15);--bs-box-shadow-sm:0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);--bs-box-shadow-lg:0 1rem 3rem rgba(0, 0, 0, 0.175);--bs-box-shadow-inset:inset 0 1px 2px rgba(0, 0, 0, 0.075);--bs-focus-ring-width:0.25rem;--bs-focus-ring-opacity:0.25;--bs-focus-ring-color:rgba(13, 110, 253, 0.25);--bs-form-valid-color:#198754;--bs-form-valid-border-color:#198754;--bs-form-invalid-color:#dc3545;--bs-form-invalid-border-color:#dc3545}[data-bs-theme=dark]{color-scheme:dark;--bs-body-color:#dee2e6;--bs-body-color-rgb:222,226,230;--bs-body-bg:#212529;--bs-body-bg-rgb:33,37,41;--bs-emphasis-color:#fff;--bs-emphasis-color-rgb:255,255,255;--bs-secondary-color:rgba(222, 226, 230, 0.75);--bs-secondary-color-rgb:222,226,230;--bs-secondary-bg:#343a40;--bs-secondary-bg-rgb:52,58,64;--bs-tertiary-color:rgba(222, 226, 230, 0.5);--bs-tertiary-color-rgb:222,226,230;--bs-tertiary-bg:#2b3035;--bs-tertiary-bg-rgb:43,48,53;--bs-primary-text-emphasis:#6ea8fe;--bs-secondary-text-emphasis:#a7acb1;--bs-success-text-emphasis:#75b798;--bs-info-text-emphasis:#6edff6;--bs-warning-text-emphasis:#ffda6a;--bs-danger-text-emphasis:#ea868f;--bs-light-text-emphasis:#f8f9fa;--bs-dark-text-emphasis:#dee2e6;--bs-primary-bg-subtle:#031633;--bs-secondary-bg-subtle:#161719;--bs-success-bg-subtle:#051b11;--bs-info-bg-subtle:#032830;--bs-warning-bg-subtle:#332701;--bs-danger-bg-subtle:#2c0b0e;--bs-light-bg-subtle:#343a40;--bs-dark-bg-subtle:#1a1d20;--bs-primary-border-subtle:#084298;--bs-secondary-border-subtle:#41464b;--bs-success-border-subtle:#0f5132;--bs-info-border-subtle:#087990;--bs-warning-border-subtle:#997404;--bs-danger-border-subtle:#842029;--bs-light-border-subtle:#495057;--bs-dark-border-subtle:#343a40;--bs-heading-color:inherit;--bs-link-color:#6ea8fe;--bs-link-hover-color:#8bb9fe;--bs-link-color-rgb:110,168,254;--bs-link-hover-color-rgb:139,185,254;--bs-code-color:#e685b5;--bs-highlight-color:#dee2e6;--bs-highlight-bg:#664d03;--bs-border-color:#495057;--bs-border-color-translucent:rgba(255, 255, 255, 0.15);--bs-form-valid-color:#75b798;--bs-form-valid-border-color:#75b798;--bs-form-invalid-color:#ea868f;--bs-form-invalid-border-color:#ea868f}*,::after,::before{box-sizing:border-box}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}body{margin:0;font-family:var(--bs-body-font-family);font-size:var(--bs-body-font-size);font-weight:var(--bs-body-font-weight);line-height:var(--bs-body-line-height);color:var(--bs-body-color);text-align:var(--bs-body-text-align);background-color:var(--bs-body-bg);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}hr{margin:1rem 0;color:inherit;border:0;border-top:var(--bs-border-width) solid;opacity:.25}.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.2;color:var(--bs-heading-color)}.h1,h1{font-size:calc(1.375rem + 1.5vw)}@media (min-width:1200px){.h1,h1{font-size:2.5rem}}.h2,h2{font-size:calc(1.325rem + .9vw)}@media (min-width:1200px){.h2,h2{font-size:2rem}}.h3,h3{font-size:calc(1.3rem + .6vw)}@media (min-width:1200px){.h3,h3{font-size:1.75rem}}.h4,h4{font-size:calc(1.275rem + .3vw)}@media (min-width:1200px){.h4,h4{font-size:1.5rem}}.h5,h5{font-size:1.25rem}.h6,h6{font-size:1rem}p{margin-top:0;margin-bottom:1rem}abbr[title]{-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul{padding-left:2rem}dl,ol,ul{margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}.small,small{font-size:.875em}.mark,mark{padding:.1875em;color:var(--bs-highlight-color);background-color:var(--bs-highlight-bg)}sub,sup{position:relative;font-size:.75em;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:rgba(var(--bs-link-color-rgb),var(--bs-link-opacity,1));text-decoration:underline}a:hover{--bs-link-color-rgb:var(--bs-link-hover-color-rgb)}a:not([href]):not([class]),a:not([href]):not([class]):hover{color:inherit;text-decoration:none}code,kbd,pre,samp{font-family:var(--bs-font-monospace);font-size:1em}pre{display:block;margin-top:0;margin-bottom:1rem;overflow:auto;font-size:.875em}pre code{font-size:inherit;color:inherit;word-break:normal}code{font-size:.875em;color:var(--bs-code-color);word-wrap:break-word}a>code{color:inherit}kbd{padding:.1875rem .375rem;font-size:.875em;color:var(--bs-body-bg);background-color:var(--bs-body-color);border-radius:.25rem}kbd kbd{padding:0;font-size:1em}figure{margin:0 0 1rem}img,svg{vertical-align:middle}table{caption-side:bottom;border-collapse:collapse}caption{padding-top:.5rem;padding-bottom:.5rem;color:var(--bs-secondary-color);text-align:left}th{text-align:inherit;text-align:-webkit-match-parent}tbody,td,tfoot,th,thead,tr{border-color:inherit;border-style:solid;border-width:0}label{display:inline-block}button{border-radius:0}button:focus:not(:focus-visible){outline:0}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}select:disabled{opacity:1}[list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator{display:none!important}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}::-moz-focus-inner{padding:0;border-style:none}textarea{resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{float:left;width:100%;padding:0;margin-bottom:.5rem;font-size:calc(1.275rem + .3vw);line-height:inherit}@media (min-width:1200px){legend{font-size:1.5rem}}legend+*{clear:left}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-fields-wrapper,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-text,::-webkit-datetime-edit-year-field{padding:0}::-webkit-inner-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-color-swatch-wrapper{padding:0}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}::file-selector-button{font:inherit;-webkit-appearance:button}output{display:inline-block}iframe{border:0}summary{display:list-item;cursor:pointer}progress{vertical-align:baseline}[hidden]{display:none!important}.lead{font-size:1.25rem;font-weight:300}.display-1{font-size:calc(1.625rem + 4.5vw);font-weight:300;line-height:1.2}@media (min-width:1200px){.display-1{font-size:5rem}}.display-2{font-size:calc(1.575rem + 3.9vw);font-weight:300;line-height:1.2}@media (min-width:1200px){.display-2{font-size:4.5rem}}.display-3{font-size:calc(1.525rem + 3.3vw);font-weight:300;line-height:1.2}@media (min-width:1200px){.display-3{font-size:4rem}}.display-4{font-size:calc(1.475rem + 2.7vw);font-weight:300;line-height:1.2}@media (min-width:1200px){.display-4{font-size:3.5rem}}.display-5{font-size:calc(1.425rem + 2.1vw);font-weight:300;line-height:1.2}@media (min-width:1200px){.display-5{font-size:3rem}}.display-6{font-size:calc(1.375rem + 1.5vw);font-weight:300;line-height:1.2}@media (min-width:1200px){.display-6{font-size:2.5rem}}.list-unstyled{padding-left:0;list-style:none}.list-inline{padding-left:0;list-style:none}.list-inline-item{display:inline-block}.list-inline-item:not(:last-child){margin-right:.5rem}.initialism{font-size:.875em;text-transform:uppercase}.blockquote{margin-bottom:1rem;font-size:1.25rem}.blockquote>:last-child{margin-bottom:0}.blockquote-footer{margin-top:-1rem;margin-bottom:1rem;font-size:.875em;color:#6c757d}.blockquote-footer::before{content:"— "}.img-fluid{max-width:100%;height:auto}.img-thumbnail{padding:.25rem;background-color:var(--bs-body-bg);border:var(--bs-border-width) solid var(--bs-border-color);border-radius:var(--bs-border-radius);max-width:100%;height:auto}.figure{display:inline-block}.figure-img{margin-bottom:.5rem;line-height:1}.figure-caption{font-size:.875em;color:var(--bs-secondary-color)}.container,.container-fluid,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl{--bs-gutter-x:1.5rem;--bs-gutter-y:0;width:100%;padding-right:calc(var(--bs-gutter-x) * .5);padding-left:calc(var(--bs-gutter-x) * .5);margin-right:auto;margin-left:auto}@media (min-width:576px){.container,.container-sm{max-width:540px}}@media (min-width:768px){.container,.container-md,.container-sm{max-width:720px}}@media (min-width:992px){.container,.container-lg,.container-md,.container-sm{max-width:960px}}@media (min-width:1200px){.container,.container-lg,.container-md,.container-sm,.container-xl{max-width:1140px}}@media (min-width:1400px){.container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl{max-width:1320px}}:root{--bs-breakpoint-xs:0;--bs-breakpoint-sm:576px;--bs-breakpoint-md:768px;--bs-breakpoint-lg:992px;--bs-breakpoint-xl:1200px;--bs-breakpoint-xxl:1400px}.row{--bs-gutter-x:1.5rem;--bs-gutter-y:0;display:flex;flex-wrap:wrap;margin-top:calc(-1 * var(--bs-gutter-y));margin-right:calc(-.5 * var(--bs-gutter-x));margin-left:calc(-.5 * var(--bs-gutter-x))}.row>*{flex-shrink:0;width:100%;max-width:100%;padding-right:calc(var(--bs-gutter-x) * .5);padding-left:calc(var(--bs-gutter-x) * .5);margin-top:var(--bs-gutter-y)}.col{flex:1 0 0%}.row-cols-auto>*{flex:0 0 auto;width:auto}.row-cols-1>*{flex:0 0 auto;width:100%}.row-cols-2>*{flex:0 0 auto;width:50%}.row-cols-3>*{flex:0 0 auto;width:33.33333333%}.row-cols-4>*{flex:0 0 auto;width:25%}.row-cols-5>*{flex:0 0 auto;width:20%}.row-cols-6>*{flex:0 0 auto;width:16.66666667%}.col-auto{flex:0 0 auto;width:auto}.col-1{flex:0 0 auto;width:8.33333333%}.col-2{flex:0 0 auto;width:16.66666667%}.col-3{flex:0 0 auto;width:25%}.col-4{flex:0 0 auto;width:33.33333333%}.col-5{flex:0 0 auto;width:41.66666667%}.col-6{flex:0 0 auto;width:50%}.col-7{flex:0 0 auto;width:58.33333333%}.col-8{flex:0 0 auto;width:66.66666667%}.col-9{flex:0 0 auto;width:75%}.col-10{flex:0 0 auto;width:83.33333333%}.col-11{flex:0 0 auto;width:91.66666667%}.col-12{flex:0 0 auto;width:100%}.offset-1{margin-left:8.33333333%}.offset-2{margin-left:16.66666667%}.offset-3{margin-left:25%}.offset-4{margin-left:33.33333333%}.offset-5{margin-left:41.66666667%}.offset-6{margin-left:50%}.offset-7{margin-left:58.33333333%}.offset-8{margin-left:66.66666667%}.offset-9{margin-left:75%}.offset-10{margin-left:83.33333333%}.offset-11{margin-left:91.66666667%}.g-0,.gx-0{--bs-gutter-x:0}.g-0,.gy-0{--bs-gutter-y:0}.g-1,.gx-1{--bs-gutter-x:0.25rem}.g-1,.gy-1{--bs-gutter-y:0.25rem}.g-2,.gx-2{--bs-gutter-x:0.5rem}.g-2,.gy-2{--bs-gutter-y:0.5rem}.g-3,.gx-3{--bs-gutter-x:1rem}.g-3,.gy-3{--bs-gutter-y:1rem}.g-4,.gx-4{--bs-gutter-x:1.5rem}.g-4,.gy-4{--bs-gutter-y:1.5rem}.g-5,.gx-5{--bs-gutter-x:3rem}.g-5,.gy-5{--bs-gutter-y:3rem}@media (min-width:576px){.col-sm{flex:1 0 0%}.row-cols-sm-auto>*{flex:0 0 auto;width:auto}.row-cols-sm-1>*{flex:0 0 auto;width:100%}.row-cols-sm-2>*{flex:0 0 auto;width:50%}.row-cols-sm-3>*{flex:0 0 auto;width:33.33333333%}.row-cols-sm-4>*{flex:0 0 auto;width:25%}.row-cols-sm-5>*{flex:0 0 auto;width:20%}.row-cols-sm-6>*{flex:0 0 auto;width:16.66666667%}.col-sm-auto{flex:0 0 auto;width:auto}.col-sm-1{flex:0 0 auto;width:8.33333333%}.col-sm-2{flex:0 0 auto;width:16.66666667%}.col-sm-3{flex:0 0 auto;width:25%}.col-sm-4{flex:0 0 auto;width:33.33333333%}.col-sm-5{flex:0 0 auto;width:41.66666667%}.col-sm-6{flex:0 0 auto;width:50%}.col-sm-7{flex:0 0 auto;width:58.33333333%}.col-sm-8{flex:0 0 auto;width:66.66666667%}.col-sm-9{flex:0 0 auto;width:75%}.col-sm-10{flex:0 0 auto;width:83.33333333%}.col-sm-11{flex:0 0 auto;width:91.66666667%}.col-sm-12{flex:0 0 auto;width:100%}.offset-sm-0{margin-left:0}.offset-sm-1{margin-left:8.33333333%}.offset-sm-2{margin-left:16.66666667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.33333333%}.offset-sm-5{margin-left:41.66666667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.33333333%}.offset-sm-8{margin-left:66.66666667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.33333333%}.offset-sm-11{margin-left:91.66666667%}.g-sm-0,.gx-sm-0{--bs-gutter-x:0}.g-sm-0,.gy-sm-0{--bs-gutter-y:0}.g-sm-1,.gx-sm-1{--bs-gutter-x:0.25rem}.g-sm-1,.gy-sm-1{--bs-gutter-y:0.25rem}.g-sm-2,.gx-sm-2{--bs-gutter-x:0.5rem}.g-sm-2,.gy-sm-2{--bs-gutter-y:0.5rem}.g-sm-3,.gx-sm-3{--bs-gutter-x:1rem}.g-sm-3,.gy-sm-3{--bs-gutter-y:1rem}.g-sm-4,.gx-sm-4{--bs-gutter-x:1.5rem}.g-sm-4,.gy-sm-4{--bs-gutter-y:1.5rem}.g-sm-5,.gx-sm-5{--bs-gutter-x:3rem}.g-sm-5,.gy-sm-5{--bs-gutter-y:3rem}}@media (min-width:768px){.col-md{flex:1 0 0%}.row-cols-md-auto>*{flex:0 0 auto;width:auto}.row-cols-md-1>*{flex:0 0 auto;width:100%}.row-cols-md-2>*{flex:0 0 auto;width:50%}.row-cols-md-3>*{flex:0 0 auto;width:33.33333333%}.row-cols-md-4>*{flex:0 0 auto;width:25%}.row-cols-md-5>*{flex:0 0 auto;width:20%}.row-cols-md-6>*{flex:0 0 auto;width:16.66666667%}.col-md-auto{flex:0 0 auto;width:auto}.col-md-1{flex:0 0 auto;width:8.33333333%}.col-md-2{flex:0 0 auto;width:16.66666667%}.col-md-3{flex:0 0 auto;width:25%}.col-md-4{flex:0 0 auto;width:33.33333333%}.col-md-5{flex:0 0 auto;width:41.66666667%}.col-md-6{flex:0 0 auto;width:50%}.col-md-7{flex:0 0 auto;width:58.33333333%}.col-md-8{flex:0 0 auto;width:66.66666667%}.col-md-9{flex:0 0 auto;width:75%}.col-md-10{flex:0 0 auto;width:83.33333333%}.col-md-11{flex:0 0 auto;width:91.66666667%}.col-md-12{flex:0 0 auto;width:100%}.offset-md-0{margin-left:0}.offset-md-1{margin-left:8.33333333%}.offset-md-2{margin-left:16.66666667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.33333333%}.offset-md-5{margin-left:41.66666667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.33333333%}.offset-md-8{margin-left:66.66666667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.33333333%}.offset-md-11{margin-left:91.66666667%}.g-md-0,.gx-md-0{--bs-gutter-x:0}.g-md-0,.gy-md-0{--bs-gutter-y:0}.g-md-1,.gx-md-1{--bs-gutter-x:0.25rem}.g-md-1,.gy-md-1{--bs-gutter-y:0.25rem}.g-md-2,.gx-md-2{--bs-gutter-x:0.5rem}.g-md-2,.gy-md-2{--bs-gutter-y:0.5rem}.g-md-3,.gx-md-3{--bs-gutter-x:1rem}.g-md-3,.gy-md-3{--bs-gutter-y:1rem}.g-md-4,.gx-md-4{--bs-gutter-x:1.5rem}.g-md-4,.gy-md-4{--bs-gutter-y:1.5rem}.g-md-5,.gx-md-5{--bs-gutter-x:3rem}.g-md-5,.gy-md-5{--bs-gutter-y:3rem}}@media (min-width:992px){.col-lg{flex:1 0 0%}.row-cols-lg-auto>*{flex:0 0 auto;width:auto}.row-cols-lg-1>*{flex:0 0 auto;width:100%}.row-cols-lg-2>*{flex:0 0 auto;width:50%}.row-cols-lg-3>*{flex:0 0 auto;width:33.33333333%}.row-cols-lg-4>*{flex:0 0 auto;width:25%}.row-cols-lg-5>*{flex:0 0 auto;width:20%}.row-cols-lg-6>*{flex:0 0 auto;width:16.66666667%}.col-lg-auto{flex:0 0 auto;width:auto}.col-lg-1{flex:0 0 auto;width:8.33333333%}.col-lg-2{flex:0 0 auto;width:16.66666667%}.col-lg-3{flex:0 0 auto;width:25%}.col-lg-4{flex:0 0 auto;width:33.33333333%}.col-lg-5{flex:0 0 auto;width:41.66666667%}.col-lg-6{flex:0 0 auto;width:50%}.col-lg-7{flex:0 0 auto;width:58.33333333%}.col-lg-8{flex:0 0 auto;width:66.66666667%}.col-lg-9{flex:0 0 auto;width:75%}.col-lg-10{flex:0 0 auto;width:83.33333333%}.col-lg-11{flex:0 0 auto;width:91.66666667%}.col-lg-12{flex:0 0 auto;width:100%}.offset-lg-0{margin-left:0}.offset-lg-1{margin-left:8.33333333%}.offset-lg-2{margin-left:16.66666667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.33333333%}.offset-lg-5{margin-left:41.66666667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.33333333%}.offset-lg-8{margin-left:66.66666667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.33333333%}.offset-lg-11{margin-left:91.66666667%}.g-lg-0,.gx-lg-0{--bs-gutter-x:0}.g-lg-0,.gy-lg-0{--bs-gutter-y:0}.g-lg-1,.gx-lg-1{--bs-gutter-x:0.25rem}.g-lg-1,.gy-lg-1{--bs-gutter-y:0.25rem}.g-lg-2,.gx-lg-2{--bs-gutter-x:0.5rem}.g-lg-2,.gy-lg-2{--bs-gutter-y:0.5rem}.g-lg-3,.gx-lg-3{--bs-gutter-x:1rem}.g-lg-3,.gy-lg-3{--bs-gutter-y:1rem}.g-lg-4,.gx-lg-4{--bs-gutter-x:1.5rem}.g-lg-4,.gy-lg-4{--bs-gutter-y:1.5rem}.g-lg-5,.gx-lg-5{--bs-gutter-x:3rem}.g-lg-5,.gy-lg-5{--bs-gutter-y:3rem}}@media (min-width:1200px){.col-xl{flex:1 0 0%}.row-cols-xl-auto>*{flex:0 0 auto;width:auto}.row-cols-xl-1>*{flex:0 0 auto;width:100%}.row-cols-xl-2>*{flex:0 0 auto;width:50%}.row-cols-xl-3>*{flex:0 0 auto;width:33.33333333%}.row-cols-xl-4>*{flex:0 0 auto;width:25%}.row-cols-xl-5>*{flex:0 0 auto;width:20%}.row-cols-xl-6>*{flex:0 0 auto;width:16.66666667%}.col-xl-auto{flex:0 0 auto;width:auto}.col-xl-1{flex:0 0 auto;width:8.33333333%}.col-xl-2{flex:0 0 auto;width:16.66666667%}.col-xl-3{flex:0 0 auto;width:25%}.col-xl-4{flex:0 0 auto;width:33.33333333%}.col-xl-5{flex:0 0 auto;width:41.66666667%}.col-xl-6{flex:0 0 auto;width:50%}.col-xl-7{flex:0 0 auto;width:58.33333333%}.col-xl-8{flex:0 0 auto;width:66.66666667%}.col-xl-9{flex:0 0 auto;width:75%}.col-xl-10{flex:0 0 auto;width:83.33333333%}.col-xl-11{flex:0 0 auto;width:91.66666667%}.col-xl-12{flex:0 0 auto;width:100%}.offset-xl-0{margin-left:0}.offset-xl-1{margin-left:8.33333333%}.offset-xl-2{margin-left:16.66666667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.33333333%}.offset-xl-5{margin-left:41.66666667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.33333333%}.offset-xl-8{margin-left:66.66666667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.33333333%}.offset-xl-11{margin-left:91.66666667%}.g-xl-0,.gx-xl-0{--bs-gutter-x:0}.g-xl-0,.gy-xl-0{--bs-gutter-y:0}.g-xl-1,.gx-xl-1{--bs-gutter-x:0.25rem}.g-xl-1,.gy-xl-1{--bs-gutter-y:0.25rem}.g-xl-2,.gx-xl-2{--bs-gutter-x:0.5rem}.g-xl-2,.gy-xl-2{--bs-gutter-y:0.5rem}.g-xl-3,.gx-xl-3{--bs-gutter-x:1rem}.g-xl-3,.gy-xl-3{--bs-gutter-y:1rem}.g-xl-4,.gx-xl-4{--bs-gutter-x:1.5rem}.g-xl-4,.gy-xl-4{--bs-gutter-y:1.5rem}.g-xl-5,.gx-xl-5{--bs-gutter-x:3rem}.g-xl-5,.gy-xl-5{--bs-gutter-y:3rem}}@media (min-width:1400px){.col-xxl{flex:1 0 0%}.row-cols-xxl-auto>*{flex:0 0 auto;width:auto}.row-cols-xxl-1>*{flex:0 0 auto;width:100%}.row-cols-xxl-2>*{flex:0 0 auto;width:50%}.row-cols-xxl-3>*{flex:0 0 auto;width:33.33333333%}.row-cols-xxl-4>*{flex:0 0 auto;width:25%}.row-cols-xxl-5>*{flex:0 0 auto;width:20%}.row-cols-xxl-6>*{flex:0 0 auto;width:16.66666667%}.col-xxl-auto{flex:0 0 auto;width:auto}.col-xxl-1{flex:0 0 auto;width:8.33333333%}.col-xxl-2{flex:0 0 auto;width:16.66666667%}.col-xxl-3{flex:0 0 auto;width:25%}.col-xxl-4{flex:0 0 auto;width:33.33333333%}.col-xxl-5{flex:0 0 auto;width:41.66666667%}.col-xxl-6{flex:0 0 auto;width:50%}.col-xxl-7{flex:0 0 auto;width:58.33333333%}.col-xxl-8{flex:0 0 auto;width:66.66666667%}.col-xxl-9{flex:0 0 auto;width:75%}.col-xxl-10{flex:0 0 auto;width:83.33333333%}.col-xxl-11{flex:0 0 auto;width:91.66666667%}.col-xxl-12{flex:0 0 auto;width:100%}.offset-xxl-0{margin-left:0}.offset-xxl-1{margin-left:8.33333333%}.offset-xxl-2{margin-left:16.66666667%}.offset-xxl-3{margin-left:25%}.offset-xxl-4{margin-left:33.33333333%}.offset-xxl-5{margin-left:41.66666667%}.offset-xxl-6{margin-left:50%}.offset-xxl-7{margin-left:58.33333333%}.offset-xxl-8{margin-left:66.66666667%}.offset-xxl-9{margin-left:75%}.offset-xxl-10{margin-left:83.33333333%}.offset-xxl-11{margin-left:91.66666667%}.g-xxl-0,.gx-xxl-0{--bs-gutter-x:0}.g-xxl-0,.gy-xxl-0{--bs-gutter-y:0}.g-xxl-1,.gx-xxl-1{--bs-gutter-x:0.25rem}.g-xxl-1,.gy-xxl-1{--bs-gutter-y:0.25rem}.g-xxl-2,.gx-xxl-2{--bs-gutter-x:0.5rem}.g-xxl-2,.gy-xxl-2{--bs-gutter-y:0.5rem}.g-xxl-3,.gx-xxl-3{--bs-gutter-x:1rem}.g-xxl-3,.gy-xxl-3{--bs-gutter-y:1rem}.g-xxl-4,.gx-xxl-4{--bs-gutter-x:1.5rem}.g-xxl-4,.gy-xxl-4{--bs-gutter-y:1.5rem}.g-xxl-5,.gx-xxl-5{--bs-gutter-x:3rem}.g-xxl-5,.gy-xxl-5{--bs-gutter-y:3rem}}.table{--bs-table-color-type:initial;--bs-table-bg-type:initial;--bs-table-color-state:initial;--bs-table-bg-state:initial;--bs-table-color:var(--bs-emphasis-color);--bs-table-bg:var(--bs-body-bg);--bs-table-border-color:var(--bs-border-color);--bs-table-accent-bg:transparent;--bs-table-striped-color:var(--bs-emphasis-color);--bs-table-striped-bg:rgba(var(--bs-emphasis-color-rgb), 0.05);--bs-table-active-color:var(--bs-emphasis-color);--bs-table-active-bg:rgba(var(--bs-emphasis-color-rgb), 0.1);--bs-table-hover-color:var(--bs-emphasis-color);--bs-table-hover-bg:rgba(var(--bs-emphasis-color-rgb), 0.075);width:100%;margin-bottom:1rem;vertical-align:top;border-color:var(--bs-table-border-color)}.table>:not(caption)>*>*{padding:.5rem .5rem;color:var(--bs-table-color-state,var(--bs-table-color-type,var(--bs-table-color)));background-color:var(--bs-table-bg);border-bottom-width:var(--bs-border-width);box-shadow:inset 0 0 0 9999px var(--bs-table-bg-state,var(--bs-table-bg-type,var(--bs-table-accent-bg)))}.table>tbody{vertical-align:inherit}.table>thead{vertical-align:bottom}.table-group-divider{border-top:calc(var(--bs-border-width) * 2) solid currentcolor}.caption-top{caption-side:top}.table-sm>:not(caption)>*>*{padding:.25rem .25rem}.table-bordered>:not(caption)>*{border-width:var(--bs-border-width) 0}.table-bordered>:not(caption)>*>*{border-width:0 var(--bs-border-width)}.table-borderless>:not(caption)>*>*{border-bottom-width:0}.table-borderless>:not(:first-child){border-top-width:0}.table-striped>tbody>tr:nth-of-type(odd)>*{--bs-table-color-type:var(--bs-table-striped-color);--bs-table-bg-type:var(--bs-table-striped-bg)}.table-striped-columns>:not(caption)>tr>:nth-child(2n){--bs-table-color-type:var(--bs-table-striped-color);--bs-table-bg-type:var(--bs-table-striped-bg)}.table-active{--bs-table-color-state:var(--bs-table-active-color);--bs-table-bg-state:var(--bs-table-active-bg)}.table-hover>tbody>tr:hover>*{--bs-table-color-state:var(--bs-table-hover-color);--bs-table-bg-state:var(--bs-table-hover-bg)}.table-primary{--bs-table-color:#000;--bs-table-bg:#cfe2ff;--bs-table-border-color:#a6b5cc;--bs-table-striped-bg:#c5d7f2;--bs-table-striped-color:#000;--bs-table-active-bg:#bacbe6;--bs-table-active-color:#000;--bs-table-hover-bg:#bfd1ec;--bs-table-hover-color:#000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-secondary{--bs-table-color:#000;--bs-table-bg:#e2e3e5;--bs-table-border-color:#b5b6b7;--bs-table-striped-bg:#d7d8da;--bs-table-striped-color:#000;--bs-table-active-bg:#cbccce;--bs-table-active-color:#000;--bs-table-hover-bg:#d1d2d4;--bs-table-hover-color:#000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-success{--bs-table-color:#000;--bs-table-bg:#d1e7dd;--bs-table-border-color:#a7b9b1;--bs-table-striped-bg:#c7dbd2;--bs-table-striped-color:#000;--bs-table-active-bg:#bcd0c7;--bs-table-active-color:#000;--bs-table-hover-bg:#c1d6cc;--bs-table-hover-color:#000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-info{--bs-table-color:#000;--bs-table-bg:#cff4fc;--bs-table-border-color:#a6c3ca;--bs-table-striped-bg:#c5e8ef;--bs-table-striped-color:#000;--bs-table-active-bg:#badce3;--bs-table-active-color:#000;--bs-table-hover-bg:#bfe2e9;--bs-table-hover-color:#000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-warning{--bs-table-color:#000;--bs-table-bg:#fff3cd;--bs-table-border-color:#ccc2a4;--bs-table-striped-bg:#f2e7c3;--bs-table-striped-color:#000;--bs-table-active-bg:#e6dbb9;--bs-table-active-color:#000;--bs-table-hover-bg:#ece1be;--bs-table-hover-color:#000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-danger{--bs-table-color:#000;--bs-table-bg:#f8d7da;--bs-table-border-color:#c6acae;--bs-table-striped-bg:#eccccf;--bs-table-striped-color:#000;--bs-table-active-bg:#dfc2c4;--bs-table-active-color:#000;--bs-table-hover-bg:#e5c7ca;--bs-table-hover-color:#000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-light{--bs-table-color:#000;--bs-table-bg:#f8f9fa;--bs-table-border-color:#c6c7c8;--bs-table-striped-bg:#ecedee;--bs-table-striped-color:#000;--bs-table-active-bg:#dfe0e1;--bs-table-active-color:#000;--bs-table-hover-bg:#e5e6e7;--bs-table-hover-color:#000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-dark{--bs-table-color:#fff;--bs-table-bg:#212529;--bs-table-border-color:#4d5154;--bs-table-striped-bg:#2c3034;--bs-table-striped-color:#fff;--bs-table-active-bg:#373b3e;--bs-table-active-color:#fff;--bs-table-hover-bg:#323539;--bs-table-hover-color:#fff;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}@media (max-width:575.98px){.table-responsive-sm{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media (max-width:767.98px){.table-responsive-md{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media (max-width:991.98px){.table-responsive-lg{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media (max-width:1199.98px){.table-responsive-xl{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media (max-width:1399.98px){.table-responsive-xxl{overflow-x:auto;-webkit-overflow-scrolling:touch}}.form-label{margin-bottom:.5rem}.col-form-label{padding-top:calc(.375rem + var(--bs-border-width));padding-bottom:calc(.375rem + var(--bs-border-width));margin-bottom:0;font-size:inherit;line-height:1.5}.col-form-label-lg{padding-top:calc(.5rem + var(--bs-border-width));padding-bottom:calc(.5rem + var(--bs-border-width));font-size:1.25rem}.col-form-label-sm{padding-top:calc(.25rem + var(--bs-border-width));padding-bottom:calc(.25rem + var(--bs-border-width));font-size:.875rem}.form-text{margin-top:.25rem;font-size:.875em;color:var(--bs-secondary-color)}.form-control{display:block;width:100%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:var(--bs-body-color);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--bs-body-bg);background-clip:padding-box;border:var(--bs-border-width) solid var(--bs-border-color);border-radius:var(--bs-border-radius);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.form-control{transition:none}}.form-control[type=file]{overflow:hidden}.form-control[type=file]:not(:disabled):not([readonly]){cursor:pointer}.form-control:focus{color:var(--bs-body-color);background-color:var(--bs-body-bg);border-color:#86b7fe;outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}.form-control::-webkit-date-and-time-value{min-width:85px;height:1.5em;margin:0}.form-control::-webkit-datetime-edit{display:block;padding:0}.form-control::-moz-placeholder{color:var(--bs-secondary-color);opacity:1}.form-control::placeholder{color:var(--bs-secondary-color);opacity:1}.form-control:disabled{background-color:var(--bs-secondary-bg);opacity:1}.form-control::-webkit-file-upload-button{padding:.375rem .75rem;margin:-.375rem -.75rem;-webkit-margin-end:.75rem;margin-inline-end:.75rem;color:var(--bs-body-color);background-color:var(--bs-tertiary-bg);pointer-events:none;border-color:inherit;border-style:solid;border-width:0;border-inline-end-width:var(--bs-border-width);border-radius:0;-webkit-transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-control::file-selector-button{padding:.375rem .75rem;margin:-.375rem -.75rem;-webkit-margin-end:.75rem;margin-inline-end:.75rem;color:var(--bs-body-color);background-color:var(--bs-tertiary-bg);pointer-events:none;border-color:inherit;border-style:solid;border-width:0;border-inline-end-width:var(--bs-border-width);border-radius:0;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.form-control::-webkit-file-upload-button{-webkit-transition:none;transition:none}.form-control::file-selector-button{transition:none}}.form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button{background-color:var(--bs-secondary-bg)}.form-control:hover:not(:disabled):not([readonly])::file-selector-button{background-color:var(--bs-secondary-bg)}.form-control-plaintext{display:block;width:100%;padding:.375rem 0;margin-bottom:0;line-height:1.5;color:var(--bs-body-color);background-color:transparent;border:solid transparent;border-width:var(--bs-border-width) 0}.form-control-plaintext:focus{outline:0}.form-control-plaintext.form-control-lg,.form-control-plaintext.form-control-sm{padding-right:0;padding-left:0}.form-control-sm{min-height:calc(1.5em + .5rem + calc(var(--bs-border-width) * 2));padding:.25rem .5rem;font-size:.875rem;border-radius:var(--bs-border-radius-sm)}.form-control-sm::-webkit-file-upload-button{padding:.25rem .5rem;margin:-.25rem -.5rem;-webkit-margin-end:.5rem;margin-inline-end:.5rem}.form-control-sm::file-selector-button{padding:.25rem .5rem;margin:-.25rem -.5rem;-webkit-margin-end:.5rem;margin-inline-end:.5rem}.form-control-lg{min-height:calc(1.5em + 1rem + calc(var(--bs-border-width) * 2));padding:.5rem 1rem;font-size:1.25rem;border-radius:var(--bs-border-radius-lg)}.form-control-lg::-webkit-file-upload-button{padding:.5rem 1rem;margin:-.5rem -1rem;-webkit-margin-end:1rem;margin-inline-end:1rem}.form-control-lg::file-selector-button{padding:.5rem 1rem;margin:-.5rem -1rem;-webkit-margin-end:1rem;margin-inline-end:1rem}textarea.form-control{min-height:calc(1.5em + .75rem + calc(var(--bs-border-width) * 2))}textarea.form-control-sm{min-height:calc(1.5em + .5rem + calc(var(--bs-border-width) * 2))}textarea.form-control-lg{min-height:calc(1.5em + 1rem + calc(var(--bs-border-width) * 2))}.form-control-color{width:3rem;height:calc(1.5em + .75rem + calc(var(--bs-border-width) * 2));padding:.375rem}.form-control-color:not(:disabled):not([readonly]){cursor:pointer}.form-control-color::-moz-color-swatch{border:0!important;border-radius:var(--bs-border-radius)}.form-control-color::-webkit-color-swatch{border:0!important;border-radius:var(--bs-border-radius)}.form-control-color.form-control-sm{height:calc(1.5em + .5rem + calc(var(--bs-border-width) * 2))}.form-control-color.form-control-lg{height:calc(1.5em + 1rem + calc(var(--bs-border-width) * 2))}.form-select{--bs-form-select-bg-img:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");display:block;width:100%;padding:.375rem 2.25rem .375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:var(--bs-body-color);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--bs-body-bg);background-image:var(--bs-form-select-bg-img),var(--bs-form-select-bg-icon,none);background-repeat:no-repeat;background-position:right .75rem center;background-size:16px 12px;border:var(--bs-border-width) solid var(--bs-border-color);border-radius:var(--bs-border-radius);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.form-select{transition:none}}.form-select:focus{border-color:#86b7fe;outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}.form-select[multiple],.form-select[size]:not([size="1"]){padding-right:.75rem;background-image:none}.form-select:disabled{background-color:var(--bs-secondary-bg)}.form-select:-moz-focusring{color:transparent;text-shadow:0 0 0 var(--bs-body-color)}.form-select-sm{padding-top:.25rem;padding-bottom:.25rem;padding-left:.5rem;font-size:.875rem;border-radius:var(--bs-border-radius-sm)}.form-select-lg{padding-top:.5rem;padding-bottom:.5rem;padding-left:1rem;font-size:1.25rem;border-radius:var(--bs-border-radius-lg)}[data-bs-theme=dark] .form-select{--bs-form-select-bg-img:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23dee2e6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e")}.form-check{display:block;min-height:1.5rem;padding-left:1.5em;margin-bottom:.125rem}.form-check .form-check-input{float:left;margin-left:-1.5em}.form-check-reverse{padding-right:1.5em;padding-left:0;text-align:right}.form-check-reverse .form-check-input{float:right;margin-right:-1.5em;margin-left:0}.form-check-input{--bs-form-check-bg:var(--bs-body-bg);flex-shrink:0;width:1em;height:1em;margin-top:.25em;vertical-align:top;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--bs-form-check-bg);background-image:var(--bs-form-check-bg-image);background-repeat:no-repeat;background-position:center;background-size:contain;border:var(--bs-border-width) solid var(--bs-border-color);-webkit-print-color-adjust:exact;color-adjust:exact;print-color-adjust:exact}.form-check-input[type=checkbox]{border-radius:.25em}.form-check-input[type=radio]{border-radius:50%}.form-check-input:active{filter:brightness(90%)}.form-check-input:focus{border-color:#86b7fe;outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}.form-check-input:checked{background-color:#0d6efd;border-color:#0d6efd}.form-check-input:checked[type=checkbox]{--bs-form-check-bg-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e")}.form-check-input:checked[type=radio]{--bs-form-check-bg-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e")}.form-check-input[type=checkbox]:indeterminate{background-color:#0d6efd;border-color:#0d6efd;--bs-form-check-bg-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e")}.form-check-input:disabled{pointer-events:none;filter:none;opacity:.5}.form-check-input:disabled~.form-check-label,.form-check-input[disabled]~.form-check-label{cursor:default;opacity:.5}.form-switch{padding-left:2.5em}.form-switch .form-check-input{--bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");width:2em;margin-left:-2.5em;background-image:var(--bs-form-switch-bg);background-position:left center;border-radius:2em;transition:background-position .15s ease-in-out}@media (prefers-reduced-motion:reduce){.form-switch .form-check-input{transition:none}}.form-switch .form-check-input:focus{--bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2386b7fe'/%3e%3c/svg%3e")}.form-switch .form-check-input:checked{background-position:right center;--bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e")}.form-switch.form-check-reverse{padding-right:2.5em;padding-left:0}.form-switch.form-check-reverse .form-check-input{margin-right:-2.5em;margin-left:0}.form-check-inline{display:inline-block;margin-right:1rem}.btn-check{position:absolute;clip:rect(0,0,0,0);pointer-events:none}.btn-check:disabled+.btn,.btn-check[disabled]+.btn{pointer-events:none;filter:none;opacity:.65}[data-bs-theme=dark] .form-switch .form-check-input:not(:checked):not(:focus){--bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%28255, 255, 255, 0.25%29'/%3e%3c/svg%3e")}.form-range{width:100%;height:1.5rem;padding:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent}.form-range:focus{outline:0}.form-range:focus::-webkit-slider-thumb{box-shadow:0 0 0 1px #fff,0 0 0 .25rem rgba(13,110,253,.25)}.form-range:focus::-moz-range-thumb{box-shadow:0 0 0 1px #fff,0 0 0 .25rem rgba(13,110,253,.25)}.form-range::-moz-focus-outer{border:0}.form-range::-webkit-slider-thumb{width:1rem;height:1rem;margin-top:-.25rem;-webkit-appearance:none;appearance:none;background-color:#0d6efd;border:0;border-radius:1rem;-webkit-transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.form-range::-webkit-slider-thumb{-webkit-transition:none;transition:none}}.form-range::-webkit-slider-thumb:active{background-color:#b6d4fe}.form-range::-webkit-slider-runnable-track{width:100%;height:.5rem;color:transparent;cursor:pointer;background-color:var(--bs-secondary-bg);border-color:transparent;border-radius:1rem}.form-range::-moz-range-thumb{width:1rem;height:1rem;-moz-appearance:none;appearance:none;background-color:#0d6efd;border:0;border-radius:1rem;-moz-transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.form-range::-moz-range-thumb{-moz-transition:none;transition:none}}.form-range::-moz-range-thumb:active{background-color:#b6d4fe}.form-range::-moz-range-track{width:100%;height:.5rem;color:transparent;cursor:pointer;background-color:var(--bs-secondary-bg);border-color:transparent;border-radius:1rem}.form-range:disabled{pointer-events:none}.form-range:disabled::-webkit-slider-thumb{background-color:var(--bs-secondary-color)}.form-range:disabled::-moz-range-thumb{background-color:var(--bs-secondary-color)}.form-floating{position:relative}.form-floating>.form-control,.form-floating>.form-control-plaintext,.form-floating>.form-select{height:calc(3.5rem + calc(var(--bs-border-width) * 2));min-height:calc(3.5rem + calc(var(--bs-border-width) * 2));line-height:1.25}.form-floating>label{position:absolute;top:0;left:0;z-index:2;height:100%;padding:1rem .75rem;overflow:hidden;text-align:start;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;border:var(--bs-border-width) solid transparent;transform-origin:0 0;transition:opacity .1s ease-in-out,transform .1s ease-in-out}@media (prefers-reduced-motion:reduce){.form-floating>label{transition:none}}.form-floating>.form-control,.form-floating>.form-control-plaintext{padding:1rem .75rem}.form-floating>.form-control-plaintext::-moz-placeholder,.form-floating>.form-control::-moz-placeholder{color:transparent}.form-floating>.form-control-plaintext::placeholder,.form-floating>.form-control::placeholder{color:transparent}.form-floating>.form-control-plaintext:not(:-moz-placeholder-shown),.form-floating>.form-control:not(:-moz-placeholder-shown){padding-top:1.625rem;padding-bottom:.625rem}.form-floating>.form-control-plaintext:focus,.form-floating>.form-control-plaintext:not(:placeholder-shown),.form-floating>.form-control:focus,.form-floating>.form-control:not(:placeholder-shown){padding-top:1.625rem;padding-bottom:.625rem}.form-floating>.form-control-plaintext:-webkit-autofill,.form-floating>.form-control:-webkit-autofill{padding-top:1.625rem;padding-bottom:.625rem}.form-floating>.form-select{padding-top:1.625rem;padding-bottom:.625rem}.form-floating>.form-control:not(:-moz-placeholder-shown)~label{color:rgba(var(--bs-body-color-rgb),.65);transform:scale(.85) translateY(-.5rem) translateX(.15rem)}.form-floating>.form-control-plaintext~label,.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-select~label{color:rgba(var(--bs-body-color-rgb),.65);transform:scale(.85) translateY(-.5rem) translateX(.15rem)}.form-floating>.form-control:not(:-moz-placeholder-shown)~label::after{position:absolute;inset:1rem 0.375rem;z-index:-1;height:1.5em;content:"";background-color:var(--bs-body-bg);border-radius:var(--bs-border-radius)}.form-floating>.form-control-plaintext~label::after,.form-floating>.form-control:focus~label::after,.form-floating>.form-control:not(:placeholder-shown)~label::after,.form-floating>.form-select~label::after{position:absolute;inset:1rem 0.375rem;z-index:-1;height:1.5em;content:"";background-color:var(--bs-body-bg);border-radius:var(--bs-border-radius)}.form-floating>.form-control:-webkit-autofill~label{color:rgba(var(--bs-body-color-rgb),.65);transform:scale(.85) translateY(-.5rem) translateX(.15rem)}.form-floating>.form-control-plaintext~label{border-width:var(--bs-border-width) 0}.form-floating>.form-control:disabled~label,.form-floating>:disabled~label{color:#6c757d}.form-floating>.form-control:disabled~label::after,.form-floating>:disabled~label::after{background-color:var(--bs-secondary-bg)}.input-group{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%}.input-group>.form-control,.input-group>.form-floating,.input-group>.form-select{position:relative;flex:1 1 auto;width:1%;min-width:0}.input-group>.form-control:focus,.input-group>.form-floating:focus-within,.input-group>.form-select:focus{z-index:5}.input-group .btn{position:relative;z-index:2}.input-group .btn:focus{z-index:5}.input-group-text{display:flex;align-items:center;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:var(--bs-body-color);text-align:center;white-space:nowrap;background-color:var(--bs-tertiary-bg);border:var(--bs-border-width) solid var(--bs-border-color);border-radius:var(--bs-border-radius)}.input-group-lg>.btn,.input-group-lg>.form-control,.input-group-lg>.form-select,.input-group-lg>.input-group-text{padding:.5rem 1rem;font-size:1.25rem;border-radius:var(--bs-border-radius-lg)}.input-group-sm>.btn,.input-group-sm>.form-control,.input-group-sm>.form-select,.input-group-sm>.input-group-text{padding:.25rem .5rem;font-size:.875rem;border-radius:var(--bs-border-radius-sm)}.input-group-lg>.form-select,.input-group-sm>.form-select{padding-right:3rem}.input-group:not(.has-validation)>.dropdown-toggle:nth-last-child(n+3),.input-group:not(.has-validation)>.form-floating:not(:last-child)>.form-control,.input-group:not(.has-validation)>.form-floating:not(:last-child)>.form-select,.input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating){border-top-right-radius:0;border-bottom-right-radius:0}.input-group.has-validation>.dropdown-toggle:nth-last-child(n+4),.input-group.has-validation>.form-floating:nth-last-child(n+3)>.form-control,.input-group.has-validation>.form-floating:nth-last-child(n+3)>.form-select,.input-group.has-validation>:nth-last-child(n+3):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating){border-top-right-radius:0;border-bottom-right-radius:0}.input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback){margin-left:calc(var(--bs-border-width) * -1);border-top-left-radius:0;border-bottom-left-radius:0}.input-group>.form-floating:not(:first-child)>.form-control,.input-group>.form-floating:not(:first-child)>.form-select{border-top-left-radius:0;border-bottom-left-radius:0}.valid-feedback{display:none;width:100%;margin-top:.25rem;font-size:.875em;color:var(--bs-form-valid-color)}.valid-tooltip{position:absolute;top:100%;z-index:5;display:none;max-width:100%;padding:.25rem .5rem;margin-top:.1rem;font-size:.875rem;color:#fff;background-color:var(--bs-success);border-radius:var(--bs-border-radius)}.is-valid~.valid-feedback,.is-valid~.valid-tooltip,.was-validated :valid~.valid-feedback,.was-validated :valid~.valid-tooltip{display:block}.form-control.is-valid,.was-validated .form-control:valid{border-color:var(--bs-form-valid-border-color);padding-right:calc(1.5em + .75rem);background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right calc(.375em + .1875rem) center;background-size:calc(.75em + .375rem) calc(.75em + .375rem)}.form-control.is-valid:focus,.was-validated .form-control:valid:focus{border-color:var(--bs-form-valid-border-color);box-shadow:0 0 0 .25rem rgba(var(--bs-success-rgb),.25)}.was-validated textarea.form-control:valid,textarea.form-control.is-valid{padding-right:calc(1.5em + .75rem);background-position:top calc(.375em + .1875rem) right calc(.375em + .1875rem)}.form-select.is-valid,.was-validated .form-select:valid{border-color:var(--bs-form-valid-border-color)}.form-select.is-valid:not([multiple]):not([size]),.form-select.is-valid:not([multiple])[size="1"],.was-validated .form-select:valid:not([multiple]):not([size]),.was-validated .form-select:valid:not([multiple])[size="1"]{--bs-form-select-bg-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");padding-right:4.125rem;background-position:right .75rem center,center right 2.25rem;background-size:16px 12px,calc(.75em + .375rem) calc(.75em + .375rem)}.form-select.is-valid:focus,.was-validated .form-select:valid:focus{border-color:var(--bs-form-valid-border-color);box-shadow:0 0 0 .25rem rgba(var(--bs-success-rgb),.25)}.form-control-color.is-valid,.was-validated .form-control-color:valid{width:calc(3rem + calc(1.5em + .75rem))}.form-check-input.is-valid,.was-validated .form-check-input:valid{border-color:var(--bs-form-valid-border-color)}.form-check-input.is-valid:checked,.was-validated .form-check-input:valid:checked{background-color:var(--bs-form-valid-color)}.form-check-input.is-valid:focus,.was-validated .form-check-input:valid:focus{box-shadow:0 0 0 .25rem rgba(var(--bs-success-rgb),.25)}.form-check-input.is-valid~.form-check-label,.was-validated .form-check-input:valid~.form-check-label{color:var(--bs-form-valid-color)}.form-check-inline .form-check-input~.valid-feedback{margin-left:.5em}.input-group>.form-control:not(:focus).is-valid,.input-group>.form-floating:not(:focus-within).is-valid,.input-group>.form-select:not(:focus).is-valid,.was-validated .input-group>.form-control:not(:focus):valid,.was-validated .input-group>.form-floating:not(:focus-within):valid,.was-validated .input-group>.form-select:not(:focus):valid{z-index:3}.invalid-feedback{display:none;width:100%;margin-top:.25rem;font-size:.875em;color:var(--bs-form-invalid-color)}.invalid-tooltip{position:absolute;top:100%;z-index:5;display:none;max-width:100%;padding:.25rem .5rem;margin-top:.1rem;font-size:.875rem;color:#fff;background-color:var(--bs-danger);border-radius:var(--bs-border-radius)}.is-invalid~.invalid-feedback,.is-invalid~.invalid-tooltip,.was-validated :invalid~.invalid-feedback,.was-validated :invalid~.invalid-tooltip{display:block}.form-control.is-invalid,.was-validated .form-control:invalid{border-color:var(--bs-form-invalid-border-color);padding-right:calc(1.5em + .75rem);background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right calc(.375em + .1875rem) center;background-size:calc(.75em + .375rem) calc(.75em + .375rem)}.form-control.is-invalid:focus,.was-validated .form-control:invalid:focus{border-color:var(--bs-form-invalid-border-color);box-shadow:0 0 0 .25rem rgba(var(--bs-danger-rgb),.25)}.was-validated textarea.form-control:invalid,textarea.form-control.is-invalid{padding-right:calc(1.5em + .75rem);background-position:top calc(.375em + .1875rem) right calc(.375em + .1875rem)}.form-select.is-invalid,.was-validated .form-select:invalid{border-color:var(--bs-form-invalid-border-color)}.form-select.is-invalid:not([multiple]):not([size]),.form-select.is-invalid:not([multiple])[size="1"],.was-validated .form-select:invalid:not([multiple]):not([size]),.was-validated .form-select:invalid:not([multiple])[size="1"]{--bs-form-select-bg-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");padding-right:4.125rem;background-position:right .75rem center,center right 2.25rem;background-size:16px 12px,calc(.75em + .375rem) calc(.75em + .375rem)}.form-select.is-invalid:focus,.was-validated .form-select:invalid:focus{border-color:var(--bs-form-invalid-border-color);box-shadow:0 0 0 .25rem rgba(var(--bs-danger-rgb),.25)}.form-control-color.is-invalid,.was-validated .form-control-color:invalid{width:calc(3rem + calc(1.5em + .75rem))}.form-check-input.is-invalid,.was-validated .form-check-input:invalid{border-color:var(--bs-form-invalid-border-color)}.form-check-input.is-invalid:checked,.was-validated .form-check-input:invalid:checked{background-color:var(--bs-form-invalid-color)}.form-check-input.is-invalid:focus,.was-validated .form-check-input:invalid:focus{box-shadow:0 0 0 .25rem rgba(var(--bs-danger-rgb),.25)}.form-check-input.is-invalid~.form-check-label,.was-validated .form-check-input:invalid~.form-check-label{color:var(--bs-form-invalid-color)}.form-check-inline .form-check-input~.invalid-feedback{margin-left:.5em}.input-group>.form-control:not(:focus).is-invalid,.input-group>.form-floating:not(:focus-within).is-invalid,.input-group>.form-select:not(:focus).is-invalid,.was-validated .input-group>.form-control:not(:focus):invalid,.was-validated .input-group>.form-floating:not(:focus-within):invalid,.was-validated .input-group>.form-select:not(:focus):invalid{z-index:4}.btn{--bs-btn-padding-x:0.75rem;--bs-btn-padding-y:0.375rem;--bs-btn-font-family: ;--bs-btn-font-size:1rem;--bs-btn-font-weight:400;--bs-btn-line-height:1.5;--bs-btn-color:var(--bs-body-color);--bs-btn-bg:transparent;--bs-btn-border-width:var(--bs-border-width);--bs-btn-border-color:transparent;--bs-btn-border-radius:var(--bs-border-radius);--bs-btn-hover-border-color:transparent;--bs-btn-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.15),0 1px 1px rgba(0, 0, 0, 0.075);--bs-btn-disabled-opacity:0.65;--bs-btn-focus-box-shadow:0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);display:inline-block;padding:var(--bs-btn-padding-y) var(--bs-btn-padding-x);font-family:var(--bs-btn-font-family);font-size:var(--bs-btn-font-size);font-weight:var(--bs-btn-font-weight);line-height:var(--bs-btn-line-height);color:var(--bs-btn-color);text-align:center;text-decoration:none;vertical-align:middle;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;border:var(--bs-btn-border-width) solid var(--bs-btn-border-color);border-radius:var(--bs-btn-border-radius);background-color:var(--bs-btn-bg);transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.btn{transition:none}}.btn:hover{color:var(--bs-btn-hover-color);background-color:var(--bs-btn-hover-bg);border-color:var(--bs-btn-hover-border-color)}.btn-check+.btn:hover{color:var(--bs-btn-color);background-color:var(--bs-btn-bg);border-color:var(--bs-btn-border-color)}.btn:focus-visible{color:var(--bs-btn-hover-color);background-color:var(--bs-btn-hover-bg);border-color:var(--bs-btn-hover-border-color);outline:0;box-shadow:var(--bs-btn-focus-box-shadow)}.btn-check:focus-visible+.btn{border-color:var(--bs-btn-hover-border-color);outline:0;box-shadow:var(--bs-btn-focus-box-shadow)}.btn-check:checked+.btn,.btn.active,.btn.show,.btn:first-child:active,:not(.btn-check)+.btn:active{color:var(--bs-btn-active-color);background-color:var(--bs-btn-active-bg);border-color:var(--bs-btn-active-border-color)}.btn-check:checked+.btn:focus-visible,.btn.active:focus-visible,.btn.show:focus-visible,.btn:first-child:active:focus-visible,:not(.btn-check)+.btn:active:focus-visible{box-shadow:var(--bs-btn-focus-box-shadow)}.btn-check:checked:focus-visible+.btn{box-shadow:var(--bs-btn-focus-box-shadow)}.btn.disabled,.btn:disabled,fieldset:disabled .btn{color:var(--bs-btn-disabled-color);pointer-events:none;background-color:var(--bs-btn-disabled-bg);border-color:var(--bs-btn-disabled-border-color);opacity:var(--bs-btn-disabled-opacity)}.btn-primary{--bs-btn-color:#fff;--bs-btn-bg:#0d6efd;--bs-btn-border-color:#0d6efd;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#0b5ed7;--bs-btn-hover-border-color:#0a58ca;--bs-btn-focus-shadow-rgb:49,132,253;--bs-btn-active-color:#fff;--bs-btn-active-bg:#0a58ca;--bs-btn-active-border-color:#0a53be;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#0d6efd;--bs-btn-disabled-border-color:#0d6efd}.btn-secondary{--bs-btn-color:#fff;--bs-btn-bg:#6c757d;--bs-btn-border-color:#6c757d;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#5c636a;--bs-btn-hover-border-color:#565e64;--bs-btn-focus-shadow-rgb:130,138,145;--bs-btn-active-color:#fff;--bs-btn-active-bg:#565e64;--bs-btn-active-border-color:#51585e;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#6c757d;--bs-btn-disabled-border-color:#6c757d}.btn-success{--bs-btn-color:#fff;--bs-btn-bg:#198754;--bs-btn-border-color:#198754;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#157347;--bs-btn-hover-border-color:#146c43;--bs-btn-focus-shadow-rgb:60,153,110;--bs-btn-active-color:#fff;--bs-btn-active-bg:#146c43;--bs-btn-active-border-color:#13653f;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#198754;--bs-btn-disabled-border-color:#198754}.btn-info{--bs-btn-color:#000;--bs-btn-bg:#0dcaf0;--bs-btn-border-color:#0dcaf0;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#31d2f2;--bs-btn-hover-border-color:#25cff2;--bs-btn-focus-shadow-rgb:11,172,204;--bs-btn-active-color:#000;--bs-btn-active-bg:#3dd5f3;--bs-btn-active-border-color:#25cff2;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#000;--bs-btn-disabled-bg:#0dcaf0;--bs-btn-disabled-border-color:#0dcaf0}.btn-warning{--bs-btn-color:#000;--bs-btn-bg:#ffc107;--bs-btn-border-color:#ffc107;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#ffca2c;--bs-btn-hover-border-color:#ffc720;--bs-btn-focus-shadow-rgb:217,164,6;--bs-btn-active-color:#000;--bs-btn-active-bg:#ffcd39;--bs-btn-active-border-color:#ffc720;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#000;--bs-btn-disabled-bg:#ffc107;--bs-btn-disabled-border-color:#ffc107}.btn-danger{--bs-btn-color:#fff;--bs-btn-bg:#dc3545;--bs-btn-border-color:#dc3545;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#bb2d3b;--bs-btn-hover-border-color:#b02a37;--bs-btn-focus-shadow-rgb:225,83,97;--bs-btn-active-color:#fff;--bs-btn-active-bg:#b02a37;--bs-btn-active-border-color:#a52834;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#dc3545;--bs-btn-disabled-border-color:#dc3545}.btn-light{--bs-btn-color:#000;--bs-btn-bg:#f8f9fa;--bs-btn-border-color:#f8f9fa;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#d3d4d5;--bs-btn-hover-border-color:#c6c7c8;--bs-btn-focus-shadow-rgb:211,212,213;--bs-btn-active-color:#000;--bs-btn-active-bg:#c6c7c8;--bs-btn-active-border-color:#babbbc;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#000;--bs-btn-disabled-bg:#f8f9fa;--bs-btn-disabled-border-color:#f8f9fa}.btn-dark{--bs-btn-color:#fff;--bs-btn-bg:#212529;--bs-btn-border-color:#212529;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#424649;--bs-btn-hover-border-color:#373b3e;--bs-btn-focus-shadow-rgb:66,70,73;--bs-btn-active-color:#fff;--bs-btn-active-bg:#4d5154;--bs-btn-active-border-color:#373b3e;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#212529;--bs-btn-disabled-border-color:#212529}.btn-outline-primary{--bs-btn-color:#0d6efd;--bs-btn-border-color:#0d6efd;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#0d6efd;--bs-btn-hover-border-color:#0d6efd;--bs-btn-focus-shadow-rgb:13,110,253;--bs-btn-active-color:#fff;--bs-btn-active-bg:#0d6efd;--bs-btn-active-border-color:#0d6efd;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#0d6efd;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#0d6efd;--bs-gradient:none}.btn-outline-secondary{--bs-btn-color:#6c757d;--bs-btn-border-color:#6c757d;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#6c757d;--bs-btn-hover-border-color:#6c757d;--bs-btn-focus-shadow-rgb:108,117,125;--bs-btn-active-color:#fff;--bs-btn-active-bg:#6c757d;--bs-btn-active-border-color:#6c757d;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#6c757d;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#6c757d;--bs-gradient:none}.btn-outline-success{--bs-btn-color:#198754;--bs-btn-border-color:#198754;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#198754;--bs-btn-hover-border-color:#198754;--bs-btn-focus-shadow-rgb:25,135,84;--bs-btn-active-color:#fff;--bs-btn-active-bg:#198754;--bs-btn-active-border-color:#198754;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#198754;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#198754;--bs-gradient:none}.btn-outline-info{--bs-btn-color:#0dcaf0;--bs-btn-border-color:#0dcaf0;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#0dcaf0;--bs-btn-hover-border-color:#0dcaf0;--bs-btn-focus-shadow-rgb:13,202,240;--bs-btn-active-color:#000;--bs-btn-active-bg:#0dcaf0;--bs-btn-active-border-color:#0dcaf0;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#0dcaf0;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#0dcaf0;--bs-gradient:none}.btn-outline-warning{--bs-btn-color:#ffc107;--bs-btn-border-color:#ffc107;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#ffc107;--bs-btn-hover-border-color:#ffc107;--bs-btn-focus-shadow-rgb:255,193,7;--bs-btn-active-color:#000;--bs-btn-active-bg:#ffc107;--bs-btn-active-border-color:#ffc107;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#ffc107;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#ffc107;--bs-gradient:none}.btn-outline-danger{--bs-btn-color:#dc3545;--bs-btn-border-color:#dc3545;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#dc3545;--bs-btn-hover-border-color:#dc3545;--bs-btn-focus-shadow-rgb:220,53,69;--bs-btn-active-color:#fff;--bs-btn-active-bg:#dc3545;--bs-btn-active-border-color:#dc3545;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#dc3545;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#dc3545;--bs-gradient:none}.btn-outline-light{--bs-btn-color:#f8f9fa;--bs-btn-border-color:#f8f9fa;--bs-btn-hover-color:#000;--bs-btn-hover-bg:#f8f9fa;--bs-btn-hover-border-color:#f8f9fa;--bs-btn-focus-shadow-rgb:248,249,250;--bs-btn-active-color:#000;--bs-btn-active-bg:#f8f9fa;--bs-btn-active-border-color:#f8f9fa;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#f8f9fa;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#f8f9fa;--bs-gradient:none}.btn-outline-dark{--bs-btn-color:#212529;--bs-btn-border-color:#212529;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#212529;--bs-btn-hover-border-color:#212529;--bs-btn-focus-shadow-rgb:33,37,41;--bs-btn-active-color:#fff;--bs-btn-active-bg:#212529;--bs-btn-active-border-color:#212529;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#212529;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#212529;--bs-gradient:none}.btn-link{--bs-btn-font-weight:400;--bs-btn-color:var(--bs-link-color);--bs-btn-bg:transparent;--bs-btn-border-color:transparent;--bs-btn-hover-color:var(--bs-link-hover-color);--bs-btn-hover-border-color:transparent;--bs-btn-active-color:var(--bs-link-hover-color);--bs-btn-active-border-color:transparent;--bs-btn-disabled-color:#6c757d;--bs-btn-disabled-border-color:transparent;--bs-btn-box-shadow:0 0 0 #000;--bs-btn-focus-shadow-rgb:49,132,253;text-decoration:underline}.btn-link:focus-visible{color:var(--bs-btn-color)}.btn-link:hover{color:var(--bs-btn-hover-color)}.btn-group-lg>.btn,.btn-lg{--bs-btn-padding-y:0.5rem;--bs-btn-padding-x:1rem;--bs-btn-font-size:1.25rem;--bs-btn-border-radius:var(--bs-border-radius-lg)}.btn-group-sm>.btn,.btn-sm{--bs-btn-padding-y:0.25rem;--bs-btn-padding-x:0.5rem;--bs-btn-font-size:0.875rem;--bs-btn-border-radius:var(--bs-border-radius-sm)}.fade{transition:opacity .15s linear}@media (prefers-reduced-motion:reduce){.fade{transition:none}}.fade:not(.show){opacity:0}.collapse:not(.show){display:none}.collapsing{height:0;overflow:hidden;transition:height .35s ease}@media (prefers-reduced-motion:reduce){.collapsing{transition:none}}.collapsing.collapse-horizontal{width:0;height:auto;transition:width .35s ease}@media (prefers-reduced-motion:reduce){.collapsing.collapse-horizontal{transition:none}}.dropdown,.dropdown-center,.dropend,.dropstart,.dropup,.dropup-center{position:relative}.dropdown-toggle{white-space:nowrap}.dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:.3em solid;border-right:.3em solid transparent;border-bottom:0;border-left:.3em solid transparent}.dropdown-toggle:empty::after{margin-left:0}.dropdown-menu{--bs-dropdown-zindex:1000;--bs-dropdown-min-width:10rem;--bs-dropdown-padding-x:0;--bs-dropdown-padding-y:0.5rem;--bs-dropdown-spacer:0.125rem;--bs-dropdown-font-size:1rem;--bs-dropdown-color:var(--bs-body-color);--bs-dropdown-bg:var(--bs-body-bg);--bs-dropdown-border-color:var(--bs-border-color-translucent);--bs-dropdown-border-radius:var(--bs-border-radius);--bs-dropdown-border-width:var(--bs-border-width);--bs-dropdown-inner-border-radius:calc(var(--bs-border-radius) - var(--bs-border-width));--bs-dropdown-divider-bg:var(--bs-border-color-translucent);--bs-dropdown-divider-margin-y:0.5rem;--bs-dropdown-box-shadow:var(--bs-box-shadow);--bs-dropdown-link-color:var(--bs-body-color);--bs-dropdown-link-hover-color:var(--bs-body-color);--bs-dropdown-link-hover-bg:var(--bs-tertiary-bg);--bs-dropdown-link-active-color:#fff;--bs-dropdown-link-active-bg:#0d6efd;--bs-dropdown-link-disabled-color:var(--bs-tertiary-color);--bs-dropdown-item-padding-x:1rem;--bs-dropdown-item-padding-y:0.25rem;--bs-dropdown-header-color:#6c757d;--bs-dropdown-header-padding-x:1rem;--bs-dropdown-header-padding-y:0.5rem;position:absolute;z-index:var(--bs-dropdown-zindex);display:none;min-width:var(--bs-dropdown-min-width);padding:var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);margin:0;font-size:var(--bs-dropdown-font-size);color:var(--bs-dropdown-color);text-align:left;list-style:none;background-color:var(--bs-dropdown-bg);background-clip:padding-box;border:var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);border-radius:var(--bs-dropdown-border-radius)}.dropdown-menu[data-bs-popper]{top:100%;left:0;margin-top:var(--bs-dropdown-spacer)}.dropdown-menu-start{--bs-position:start}.dropdown-menu-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-end{--bs-position:end}.dropdown-menu-end[data-bs-popper]{right:0;left:auto}@media (min-width:576px){.dropdown-menu-sm-start{--bs-position:start}.dropdown-menu-sm-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-sm-end{--bs-position:end}.dropdown-menu-sm-end[data-bs-popper]{right:0;left:auto}}@media (min-width:768px){.dropdown-menu-md-start{--bs-position:start}.dropdown-menu-md-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-md-end{--bs-position:end}.dropdown-menu-md-end[data-bs-popper]{right:0;left:auto}}@media (min-width:992px){.dropdown-menu-lg-start{--bs-position:start}.dropdown-menu-lg-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-lg-end{--bs-position:end}.dropdown-menu-lg-end[data-bs-popper]{right:0;left:auto}}@media (min-width:1200px){.dropdown-menu-xl-start{--bs-position:start}.dropdown-menu-xl-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-xl-end{--bs-position:end}.dropdown-menu-xl-end[data-bs-popper]{right:0;left:auto}}@media (min-width:1400px){.dropdown-menu-xxl-start{--bs-position:start}.dropdown-menu-xxl-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-xxl-end{--bs-position:end}.dropdown-menu-xxl-end[data-bs-popper]{right:0;left:auto}}.dropup .dropdown-menu[data-bs-popper]{top:auto;bottom:100%;margin-top:0;margin-bottom:var(--bs-dropdown-spacer)}.dropup .dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:0;border-right:.3em solid transparent;border-bottom:.3em solid;border-left:.3em solid transparent}.dropup .dropdown-toggle:empty::after{margin-left:0}.dropend .dropdown-menu[data-bs-popper]{top:0;right:auto;left:100%;margin-top:0;margin-left:var(--bs-dropdown-spacer)}.dropend .dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:.3em solid transparent;border-right:0;border-bottom:.3em solid transparent;border-left:.3em solid}.dropend .dropdown-toggle:empty::after{margin-left:0}.dropend .dropdown-toggle::after{vertical-align:0}.dropstart .dropdown-menu[data-bs-popper]{top:0;right:100%;left:auto;margin-top:0;margin-right:var(--bs-dropdown-spacer)}.dropstart .dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:""}.dropstart .dropdown-toggle::after{display:none}.dropstart .dropdown-toggle::before{display:inline-block;margin-right:.255em;vertical-align:.255em;content:"";border-top:.3em solid transparent;border-right:.3em solid;border-bottom:.3em solid transparent}.dropstart .dropdown-toggle:empty::after{margin-left:0}.dropstart .dropdown-toggle::before{vertical-align:0}.dropdown-divider{height:0;margin:var(--bs-dropdown-divider-margin-y) 0;overflow:hidden;border-top:1px solid var(--bs-dropdown-divider-bg);opacity:1}.dropdown-item{display:block;width:100%;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);clear:both;font-weight:400;color:var(--bs-dropdown-link-color);text-align:inherit;text-decoration:none;white-space:nowrap;background-color:transparent;border:0;border-radius:var(--bs-dropdown-item-border-radius,0)}.dropdown-item:focus,.dropdown-item:hover{color:var(--bs-dropdown-link-hover-color);background-color:var(--bs-dropdown-link-hover-bg)}.dropdown-item.active,.dropdown-item:active{color:var(--bs-dropdown-link-active-color);text-decoration:none;background-color:var(--bs-dropdown-link-active-bg)}.dropdown-item.disabled,.dropdown-item:disabled{color:var(--bs-dropdown-link-disabled-color);pointer-events:none;background-color:transparent}.dropdown-menu.show{display:block}.dropdown-header{display:block;padding:var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x);margin-bottom:0;font-size:.875rem;color:var(--bs-dropdown-header-color);white-space:nowrap}.dropdown-item-text{display:block;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);color:var(--bs-dropdown-link-color)}.dropdown-menu-dark{--bs-dropdown-color:#dee2e6;--bs-dropdown-bg:#343a40;--bs-dropdown-border-color:var(--bs-border-color-translucent);--bs-dropdown-box-shadow: ;--bs-dropdown-link-color:#dee2e6;--bs-dropdown-link-hover-color:#fff;--bs-dropdown-divider-bg:var(--bs-border-color-translucent);--bs-dropdown-link-hover-bg:rgba(255, 255, 255, 0.15);--bs-dropdown-link-active-color:#fff;--bs-dropdown-link-active-bg:#0d6efd;--bs-dropdown-link-disabled-color:#adb5bd;--bs-dropdown-header-color:#adb5bd}.btn-group,.btn-group-vertical{position:relative;display:inline-flex;vertical-align:middle}.btn-group-vertical>.btn,.btn-group>.btn{position:relative;flex:1 1 auto}.btn-group-vertical>.btn-check:checked+.btn,.btn-group-vertical>.btn-check:focus+.btn,.btn-group-vertical>.btn.active,.btn-group-vertical>.btn:active,.btn-group-vertical>.btn:focus,.btn-group-vertical>.btn:hover,.btn-group>.btn-check:checked+.btn,.btn-group>.btn-check:focus+.btn,.btn-group>.btn.active,.btn-group>.btn:active,.btn-group>.btn:focus,.btn-group>.btn:hover{z-index:1}.btn-toolbar{display:flex;flex-wrap:wrap;justify-content:flex-start}.btn-toolbar .input-group{width:auto}.btn-group{border-radius:var(--bs-border-radius)}.btn-group>.btn-group:not(:first-child),.btn-group>:not(.btn-check:first-child)+.btn{margin-left:calc(var(--bs-border-width) * -1)}.btn-group>.btn-group:not(:last-child)>.btn,.btn-group>.btn.dropdown-toggle-split:first-child,.btn-group>.btn:not(:last-child):not(.dropdown-toggle){border-top-right-radius:0;border-bottom-right-radius:0}.btn-group>.btn-group:not(:first-child)>.btn,.btn-group>.btn:nth-child(n+3),.btn-group>:not(.btn-check)+.btn{border-top-left-radius:0;border-bottom-left-radius:0}.dropdown-toggle-split{padding-right:.5625rem;padding-left:.5625rem}.dropdown-toggle-split::after,.dropend .dropdown-toggle-split::after,.dropup .dropdown-toggle-split::after{margin-left:0}.dropstart .dropdown-toggle-split::before{margin-right:0}.btn-group-sm>.btn+.dropdown-toggle-split,.btn-sm+.dropdown-toggle-split{padding-right:.375rem;padding-left:.375rem}.btn-group-lg>.btn+.dropdown-toggle-split,.btn-lg+.dropdown-toggle-split{padding-right:.75rem;padding-left:.75rem}.btn-group-vertical{flex-direction:column;align-items:flex-start;justify-content:center}.btn-group-vertical>.btn,.btn-group-vertical>.btn-group{width:100%}.btn-group-vertical>.btn-group:not(:first-child),.btn-group-vertical>.btn:not(:first-child){margin-top:calc(var(--bs-border-width) * -1)}.btn-group-vertical>.btn-group:not(:last-child)>.btn,.btn-group-vertical>.btn:not(:last-child):not(.dropdown-toggle){border-bottom-right-radius:0;border-bottom-left-radius:0}.btn-group-vertical>.btn-group:not(:first-child)>.btn,.btn-group-vertical>.btn~.btn{border-top-left-radius:0;border-top-right-radius:0}.nav{--bs-nav-link-padding-x:1rem;--bs-nav-link-padding-y:0.5rem;--bs-nav-link-font-weight: ;--bs-nav-link-color:var(--bs-link-color);--bs-nav-link-hover-color:var(--bs-link-hover-color);--bs-nav-link-disabled-color:var(--bs-secondary-color);display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none}.nav-link{display:block;padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);font-size:var(--bs-nav-link-font-size);font-weight:var(--bs-nav-link-font-weight);color:var(--bs-nav-link-color);text-decoration:none;background:0 0;border:0;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out}@media (prefers-reduced-motion:reduce){.nav-link{transition:none}}.nav-link:focus,.nav-link:hover{color:var(--bs-nav-link-hover-color)}.nav-link:focus-visible{outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}.nav-link.disabled,.nav-link:disabled{color:var(--bs-nav-link-disabled-color);pointer-events:none;cursor:default}.nav-tabs{--bs-nav-tabs-border-width:var(--bs-border-width);--bs-nav-tabs-border-color:var(--bs-border-color);--bs-nav-tabs-border-radius:var(--bs-border-radius);--bs-nav-tabs-link-hover-border-color:var(--bs-secondary-bg) var(--bs-secondary-bg) var(--bs-border-color);--bs-nav-tabs-link-active-color:var(--bs-emphasis-color);--bs-nav-tabs-link-active-bg:var(--bs-body-bg);--bs-nav-tabs-link-active-border-color:var(--bs-border-color) var(--bs-border-color) var(--bs-body-bg);border-bottom:var(--bs-nav-tabs-border-width) solid var(--bs-nav-tabs-border-color)}.nav-tabs .nav-link{margin-bottom:calc(-1 * var(--bs-nav-tabs-border-width));border:var(--bs-nav-tabs-border-width) solid transparent;border-top-left-radius:var(--bs-nav-tabs-border-radius);border-top-right-radius:var(--bs-nav-tabs-border-radius)}.nav-tabs .nav-link:focus,.nav-tabs .nav-link:hover{isolation:isolate;border-color:var(--bs-nav-tabs-link-hover-border-color)}.nav-tabs .nav-item.show .nav-link,.nav-tabs .nav-link.active{color:var(--bs-nav-tabs-link-active-color);background-color:var(--bs-nav-tabs-link-active-bg);border-color:var(--bs-nav-tabs-link-active-border-color)}.nav-tabs .dropdown-menu{margin-top:calc(-1 * var(--bs-nav-tabs-border-width));border-top-left-radius:0;border-top-right-radius:0}.nav-pills{--bs-nav-pills-border-radius:var(--bs-border-radius);--bs-nav-pills-link-active-color:#fff;--bs-nav-pills-link-active-bg:#0d6efd}.nav-pills .nav-link{border-radius:var(--bs-nav-pills-border-radius)}.nav-pills .nav-link.active,.nav-pills .show>.nav-link{color:var(--bs-nav-pills-link-active-color);background-color:var(--bs-nav-pills-link-active-bg)}.nav-underline{--bs-nav-underline-gap:1rem;--bs-nav-underline-border-width:0.125rem;--bs-nav-underline-link-active-color:var(--bs-emphasis-color);gap:var(--bs-nav-underline-gap)}.nav-underline .nav-link{padding-right:0;padding-left:0;border-bottom:var(--bs-nav-underline-border-width) solid transparent}.nav-underline .nav-link:focus,.nav-underline .nav-link:hover{border-bottom-color:currentcolor}.nav-underline .nav-link.active,.nav-underline .show>.nav-link{font-weight:700;color:var(--bs-nav-underline-link-active-color);border-bottom-color:currentcolor}.nav-fill .nav-item,.nav-fill>.nav-link{flex:1 1 auto;text-align:center}.nav-justified .nav-item,.nav-justified>.nav-link{flex-basis:0;flex-grow:1;text-align:center}.nav-fill .nav-item .nav-link,.nav-justified .nav-item .nav-link{width:100%}.tab-content>.tab-pane{display:none}.tab-content>.active{display:block}.navbar{--bs-navbar-padding-x:0;--bs-navbar-padding-y:0.5rem;--bs-navbar-color:rgba(var(--bs-emphasis-color-rgb), 0.65);--bs-navbar-hover-color:rgba(var(--bs-emphasis-color-rgb), 0.8);--bs-navbar-disabled-color:rgba(var(--bs-emphasis-color-rgb), 0.3);--bs-navbar-active-color:rgba(var(--bs-emphasis-color-rgb), 1);--bs-navbar-brand-padding-y:0.3125rem;--bs-navbar-brand-margin-end:1rem;--bs-navbar-brand-font-size:1.25rem;--bs-navbar-brand-color:rgba(var(--bs-emphasis-color-rgb), 1);--bs-navbar-brand-hover-color:rgba(var(--bs-emphasis-color-rgb), 1);--bs-navbar-nav-link-padding-x:0.5rem;--bs-navbar-toggler-padding-y:0.25rem;--bs-navbar-toggler-padding-x:0.75rem;--bs-navbar-toggler-font-size:1.25rem;--bs-navbar-toggler-icon-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2833, 37, 41, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");--bs-navbar-toggler-border-color:rgba(var(--bs-emphasis-color-rgb), 0.15);--bs-navbar-toggler-border-radius:var(--bs-border-radius);--bs-navbar-toggler-focus-width:0.25rem;--bs-navbar-toggler-transition:box-shadow 0.15s ease-in-out;position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:var(--bs-navbar-padding-y) var(--bs-navbar-padding-x)}.navbar>.container,.navbar>.container-fluid,.navbar>.container-lg,.navbar>.container-md,.navbar>.container-sm,.navbar>.container-xl,.navbar>.container-xxl{display:flex;flex-wrap:inherit;align-items:center;justify-content:space-between}.navbar-brand{padding-top:var(--bs-navbar-brand-padding-y);padding-bottom:var(--bs-navbar-brand-padding-y);margin-right:var(--bs-navbar-brand-margin-end);font-size:var(--bs-navbar-brand-font-size);color:var(--bs-navbar-brand-color);text-decoration:none;white-space:nowrap}.navbar-brand:focus,.navbar-brand:hover{color:var(--bs-navbar-brand-hover-color)}.navbar-nav{--bs-nav-link-padding-x:0;--bs-nav-link-padding-y:0.5rem;--bs-nav-link-font-weight: ;--bs-nav-link-color:var(--bs-navbar-color);--bs-nav-link-hover-color:var(--bs-navbar-hover-color);--bs-nav-link-disabled-color:var(--bs-navbar-disabled-color);display:flex;flex-direction:column;padding-left:0;margin-bottom:0;list-style:none}.navbar-nav .nav-link.active,.navbar-nav .nav-link.show{color:var(--bs-navbar-active-color)}.navbar-nav .dropdown-menu{position:static}.navbar-text{padding-top:.5rem;padding-bottom:.5rem;color:var(--bs-navbar-color)}.navbar-text a,.navbar-text a:focus,.navbar-text a:hover{color:var(--bs-navbar-active-color)}.navbar-collapse{flex-basis:100%;flex-grow:1;align-items:center}.navbar-toggler{padding:var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);font-size:var(--bs-navbar-toggler-font-size);line-height:1;color:var(--bs-navbar-color);background-color:transparent;border:var(--bs-border-width) solid var(--bs-navbar-toggler-border-color);border-radius:var(--bs-navbar-toggler-border-radius);transition:var(--bs-navbar-toggler-transition)}@media (prefers-reduced-motion:reduce){.navbar-toggler{transition:none}}.navbar-toggler:hover{text-decoration:none}.navbar-toggler:focus{text-decoration:none;outline:0;box-shadow:0 0 0 var(--bs-navbar-toggler-focus-width)}.navbar-toggler-icon{display:inline-block;width:1.5em;height:1.5em;vertical-align:middle;background-image:var(--bs-navbar-toggler-icon-bg);background-repeat:no-repeat;background-position:center;background-size:100%}.navbar-nav-scroll{max-height:var(--bs-scroll-height,75vh);overflow-y:auto}@media (min-width:576px){.navbar-expand-sm{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-sm .navbar-nav{flex-direction:row}.navbar-expand-sm .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-sm .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-sm .navbar-nav-scroll{overflow:visible}.navbar-expand-sm .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-sm .navbar-toggler{display:none}.navbar-expand-sm .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto!important;height:auto!important;visibility:visible!important;background-color:transparent!important;border:0!important;transform:none!important;transition:none}.navbar-expand-sm .offcanvas .offcanvas-header{display:none}.navbar-expand-sm .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}@media (min-width:768px){.navbar-expand-md{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-md .navbar-nav{flex-direction:row}.navbar-expand-md .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-md .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-md .navbar-nav-scroll{overflow:visible}.navbar-expand-md .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-md .navbar-toggler{display:none}.navbar-expand-md .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto!important;height:auto!important;visibility:visible!important;background-color:transparent!important;border:0!important;transform:none!important;transition:none}.navbar-expand-md .offcanvas .offcanvas-header{display:none}.navbar-expand-md .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}@media (min-width:992px){.navbar-expand-lg{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-lg .navbar-nav{flex-direction:row}.navbar-expand-lg .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-lg .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-lg .navbar-nav-scroll{overflow:visible}.navbar-expand-lg .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-lg .navbar-toggler{display:none}.navbar-expand-lg .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto!important;height:auto!important;visibility:visible!important;background-color:transparent!important;border:0!important;transform:none!important;transition:none}.navbar-expand-lg .offcanvas .offcanvas-header{display:none}.navbar-expand-lg .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}@media (min-width:1200px){.navbar-expand-xl{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-xl .navbar-nav{flex-direction:row}.navbar-expand-xl .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-xl .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-xl .navbar-nav-scroll{overflow:visible}.navbar-expand-xl .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-xl .navbar-toggler{display:none}.navbar-expand-xl .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto!important;height:auto!important;visibility:visible!important;background-color:transparent!important;border:0!important;transform:none!important;transition:none}.navbar-expand-xl .offcanvas .offcanvas-header{display:none}.navbar-expand-xl .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}@media (min-width:1400px){.navbar-expand-xxl{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-xxl .navbar-nav{flex-direction:row}.navbar-expand-xxl .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-xxl .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-xxl .navbar-nav-scroll{overflow:visible}.navbar-expand-xxl .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-xxl .navbar-toggler{display:none}.navbar-expand-xxl .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto!important;height:auto!important;visibility:visible!important;background-color:transparent!important;border:0!important;transform:none!important;transition:none}.navbar-expand-xxl .offcanvas .offcanvas-header{display:none}.navbar-expand-xxl .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}.navbar-expand{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand .navbar-nav{flex-direction:row}.navbar-expand .navbar-nav .dropdown-menu{position:absolute}.navbar-expand .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand .navbar-nav-scroll{overflow:visible}.navbar-expand .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand .navbar-toggler{display:none}.navbar-expand .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto!important;height:auto!important;visibility:visible!important;background-color:transparent!important;border:0!important;transform:none!important;transition:none}.navbar-expand .offcanvas .offcanvas-header{display:none}.navbar-expand .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}.navbar-dark,.navbar[data-bs-theme=dark]{--bs-navbar-color:rgba(255, 255, 255, 0.55);--bs-navbar-hover-color:rgba(255, 255, 255, 0.75);--bs-navbar-disabled-color:rgba(255, 255, 255, 0.25);--bs-navbar-active-color:#fff;--bs-navbar-brand-color:#fff;--bs-navbar-brand-hover-color:#fff;--bs-navbar-toggler-border-color:rgba(255, 255, 255, 0.1);--bs-navbar-toggler-icon-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")}[data-bs-theme=dark] .navbar-toggler-icon{--bs-navbar-toggler-icon-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")}.card{--bs-card-spacer-y:1rem;--bs-card-spacer-x:1rem;--bs-card-title-spacer-y:0.5rem;--bs-card-title-color: ;--bs-card-subtitle-color: ;--bs-card-border-width:var(--bs-border-width);--bs-card-border-color:var(--bs-border-color-translucent);--bs-card-border-radius:var(--bs-border-radius);--bs-card-box-shadow: ;--bs-card-inner-border-radius:calc(var(--bs-border-radius) - (var(--bs-border-width)));--bs-card-cap-padding-y:0.5rem;--bs-card-cap-padding-x:1rem;--bs-card-cap-bg:rgba(var(--bs-body-color-rgb), 0.03);--bs-card-cap-color: ;--bs-card-height: ;--bs-card-color: ;--bs-card-bg:var(--bs-body-bg);--bs-card-img-overlay-padding:1rem;--bs-card-group-margin:0.75rem;position:relative;display:flex;flex-direction:column;min-width:0;height:var(--bs-card-height);color:var(--bs-body-color);word-wrap:break-word;background-color:var(--bs-card-bg);background-clip:border-box;border:var(--bs-card-border-width) solid var(--bs-card-border-color);border-radius:var(--bs-card-border-radius)}.card>hr{margin-right:0;margin-left:0}.card>.list-group{border-top:inherit;border-bottom:inherit}.card>.list-group:first-child{border-top-width:0;border-top-left-radius:var(--bs-card-inner-border-radius);border-top-right-radius:var(--bs-card-inner-border-radius)}.card>.list-group:last-child{border-bottom-width:0;border-bottom-right-radius:var(--bs-card-inner-border-radius);border-bottom-left-radius:var(--bs-card-inner-border-radius)}.card>.card-header+.list-group,.card>.list-group+.card-footer{border-top:0}.card-body{flex:1 1 auto;padding:var(--bs-card-spacer-y) var(--bs-card-spacer-x);color:var(--bs-card-color)}.card-title{margin-bottom:var(--bs-card-title-spacer-y);color:var(--bs-card-title-color)}.card-subtitle{margin-top:calc(-.5 * var(--bs-card-title-spacer-y));margin-bottom:0;color:var(--bs-card-subtitle-color)}.card-text:last-child{margin-bottom:0}.card-link+.card-link{margin-left:var(--bs-card-spacer-x)}.card-header{padding:var(--bs-card-cap-padding-y) var(--bs-card-cap-padding-x);margin-bottom:0;color:var(--bs-card-cap-color);background-color:var(--bs-card-cap-bg);border-bottom:var(--bs-card-border-width) solid var(--bs-card-border-color)}.card-header:first-child{border-radius:var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius) 0 0}.card-footer{padding:var(--bs-card-cap-padding-y) var(--bs-card-cap-padding-x);color:var(--bs-card-cap-color);background-color:var(--bs-card-cap-bg);border-top:var(--bs-card-border-width) solid var(--bs-card-border-color)}.card-footer:last-child{border-radius:0 0 var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius)}.card-header-tabs{margin-right:calc(-.5 * var(--bs-card-cap-padding-x));margin-bottom:calc(-1 * var(--bs-card-cap-padding-y));margin-left:calc(-.5 * var(--bs-card-cap-padding-x));border-bottom:0}.card-header-tabs .nav-link.active{background-color:var(--bs-card-bg);border-bottom-color:var(--bs-card-bg)}.card-header-pills{margin-right:calc(-.5 * var(--bs-card-cap-padding-x));margin-left:calc(-.5 * var(--bs-card-cap-padding-x))}.card-img-overlay{position:absolute;top:0;right:0;bottom:0;left:0;padding:var(--bs-card-img-overlay-padding);border-radius:var(--bs-card-inner-border-radius)}.card-img,.card-img-bottom,.card-img-top{width:100%}.card-img,.card-img-top{border-top-left-radius:var(--bs-card-inner-border-radius);border-top-right-radius:var(--bs-card-inner-border-radius)}.card-img,.card-img-bottom{border-bottom-right-radius:var(--bs-card-inner-border-radius);border-bottom-left-radius:var(--bs-card-inner-border-radius)}.card-group>.card{margin-bottom:var(--bs-card-group-margin)}@media (min-width:576px){.card-group{display:flex;flex-flow:row wrap}.card-group>.card{flex:1 0 0%;margin-bottom:0}.card-group>.card+.card{margin-left:0;border-left:0}.card-group>.card:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.card-group>.card:not(:last-child) .card-header,.card-group>.card:not(:last-child) .card-img-top{border-top-right-radius:0}.card-group>.card:not(:last-child) .card-footer,.card-group>.card:not(:last-child) .card-img-bottom{border-bottom-right-radius:0}.card-group>.card:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.card-group>.card:not(:first-child) .card-header,.card-group>.card:not(:first-child) .card-img-top{border-top-left-radius:0}.card-group>.card:not(:first-child) .card-footer,.card-group>.card:not(:first-child) .card-img-bottom{border-bottom-left-radius:0}}.accordion{--bs-accordion-color:var(--bs-body-color);--bs-accordion-bg:var(--bs-body-bg);--bs-accordion-transition:color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out,border-radius 0.15s ease;--bs-accordion-border-color:var(--bs-border-color);--bs-accordion-border-width:var(--bs-border-width);--bs-accordion-border-radius:var(--bs-border-radius);--bs-accordion-inner-border-radius:calc(var(--bs-border-radius) - (var(--bs-border-width)));--bs-accordion-btn-padding-x:1.25rem;--bs-accordion-btn-padding-y:1rem;--bs-accordion-btn-color:var(--bs-body-color);--bs-accordion-btn-bg:var(--bs-accordion-bg);--bs-accordion-btn-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23212529' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");--bs-accordion-btn-icon-width:1.25rem;--bs-accordion-btn-icon-transform:rotate(-180deg);--bs-accordion-btn-icon-transition:transform 0.2s ease-in-out;--bs-accordion-btn-active-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23052c65' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");--bs-accordion-btn-focus-box-shadow:0 0 0 0.25rem rgba(13, 110, 253, 0.25);--bs-accordion-body-padding-x:1.25rem;--bs-accordion-body-padding-y:1rem;--bs-accordion-active-color:var(--bs-primary-text-emphasis);--bs-accordion-active-bg:var(--bs-primary-bg-subtle)}.accordion-button{position:relative;display:flex;align-items:center;width:100%;padding:var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x);font-size:1rem;color:var(--bs-accordion-btn-color);text-align:left;background-color:var(--bs-accordion-btn-bg);border:0;border-radius:0;overflow-anchor:none;transition:var(--bs-accordion-transition)}@media (prefers-reduced-motion:reduce){.accordion-button{transition:none}}.accordion-button:not(.collapsed){color:var(--bs-accordion-active-color);background-color:var(--bs-accordion-active-bg);box-shadow:inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color)}.accordion-button:not(.collapsed)::after{background-image:var(--bs-accordion-btn-active-icon);transform:var(--bs-accordion-btn-icon-transform)}.accordion-button::after{flex-shrink:0;width:var(--bs-accordion-btn-icon-width);height:var(--bs-accordion-btn-icon-width);margin-left:auto;content:"";background-image:var(--bs-accordion-btn-icon);background-repeat:no-repeat;background-size:var(--bs-accordion-btn-icon-width);transition:var(--bs-accordion-btn-icon-transition)}@media (prefers-reduced-motion:reduce){.accordion-button::after{transition:none}}.accordion-button:hover{z-index:2}.accordion-button:focus{z-index:3;outline:0;box-shadow:var(--bs-accordion-btn-focus-box-shadow)}.accordion-header{margin-bottom:0}.accordion-item{color:var(--bs-accordion-color);background-color:var(--bs-accordion-bg);border:var(--bs-accordion-border-width) solid var(--bs-accordion-border-color)}.accordion-item:first-of-type{border-top-left-radius:var(--bs-accordion-border-radius);border-top-right-radius:var(--bs-accordion-border-radius)}.accordion-item:first-of-type>.accordion-header .accordion-button{border-top-left-radius:var(--bs-accordion-inner-border-radius);border-top-right-radius:var(--bs-accordion-inner-border-radius)}.accordion-item:not(:first-of-type){border-top:0}.accordion-item:last-of-type{border-bottom-right-radius:var(--bs-accordion-border-radius);border-bottom-left-radius:var(--bs-accordion-border-radius)}.accordion-item:last-of-type>.accordion-header .accordion-button.collapsed{border-bottom-right-radius:var(--bs-accordion-inner-border-radius);border-bottom-left-radius:var(--bs-accordion-inner-border-radius)}.accordion-item:last-of-type>.accordion-collapse{border-bottom-right-radius:var(--bs-accordion-border-radius);border-bottom-left-radius:var(--bs-accordion-border-radius)}.accordion-body{padding:var(--bs-accordion-body-padding-y) var(--bs-accordion-body-padding-x)}.accordion-flush>.accordion-item{border-right:0;border-left:0;border-radius:0}.accordion-flush>.accordion-item:first-child{border-top:0}.accordion-flush>.accordion-item:last-child{border-bottom:0}.accordion-flush>.accordion-item>.accordion-header .accordion-button,.accordion-flush>.accordion-item>.accordion-header .accordion-button.collapsed{border-radius:0}.accordion-flush>.accordion-item>.accordion-collapse{border-radius:0}[data-bs-theme=dark] .accordion-button::after{--bs-accordion-btn-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%236ea8fe'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");--bs-accordion-btn-active-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%236ea8fe'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")}.breadcrumb{--bs-breadcrumb-padding-x:0;--bs-breadcrumb-padding-y:0;--bs-breadcrumb-margin-bottom:1rem;--bs-breadcrumb-bg: ;--bs-breadcrumb-border-radius: ;--bs-breadcrumb-divider-color:var(--bs-secondary-color);--bs-breadcrumb-item-padding-x:0.5rem;--bs-breadcrumb-item-active-color:var(--bs-secondary-color);display:flex;flex-wrap:wrap;padding:var(--bs-breadcrumb-padding-y) var(--bs-breadcrumb-padding-x);margin-bottom:var(--bs-breadcrumb-margin-bottom);font-size:var(--bs-breadcrumb-font-size);list-style:none;background-color:var(--bs-breadcrumb-bg);border-radius:var(--bs-breadcrumb-border-radius)}.breadcrumb-item+.breadcrumb-item{padding-left:var(--bs-breadcrumb-item-padding-x)}.breadcrumb-item+.breadcrumb-item::before{float:left;padding-right:var(--bs-breadcrumb-item-padding-x);color:var(--bs-breadcrumb-divider-color);content:var(--bs-breadcrumb-divider, "/")}.breadcrumb-item.active{color:var(--bs-breadcrumb-item-active-color)}.pagination{--bs-pagination-padding-x:0.75rem;--bs-pagination-padding-y:0.375rem;--bs-pagination-font-size:1rem;--bs-pagination-color:var(--bs-link-color);--bs-pagination-bg:var(--bs-body-bg);--bs-pagination-border-width:var(--bs-border-width);--bs-pagination-border-color:var(--bs-border-color);--bs-pagination-border-radius:var(--bs-border-radius);--bs-pagination-hover-color:var(--bs-link-hover-color);--bs-pagination-hover-bg:var(--bs-tertiary-bg);--bs-pagination-hover-border-color:var(--bs-border-color);--bs-pagination-focus-color:var(--bs-link-hover-color);--bs-pagination-focus-bg:var(--bs-secondary-bg);--bs-pagination-focus-box-shadow:0 0 0 0.25rem rgba(13, 110, 253, 0.25);--bs-pagination-active-color:#fff;--bs-pagination-active-bg:#0d6efd;--bs-pagination-active-border-color:#0d6efd;--bs-pagination-disabled-color:var(--bs-secondary-color);--bs-pagination-disabled-bg:var(--bs-secondary-bg);--bs-pagination-disabled-border-color:var(--bs-border-color);display:flex;padding-left:0;list-style:none}.page-link{position:relative;display:block;padding:var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);font-size:var(--bs-pagination-font-size);color:var(--bs-pagination-color);text-decoration:none;background-color:var(--bs-pagination-bg);border:var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.page-link{transition:none}}.page-link:hover{z-index:2;color:var(--bs-pagination-hover-color);background-color:var(--bs-pagination-hover-bg);border-color:var(--bs-pagination-hover-border-color)}.page-link:focus{z-index:3;color:var(--bs-pagination-focus-color);background-color:var(--bs-pagination-focus-bg);outline:0;box-shadow:var(--bs-pagination-focus-box-shadow)}.active>.page-link,.page-link.active{z-index:3;color:var(--bs-pagination-active-color);background-color:var(--bs-pagination-active-bg);border-color:var(--bs-pagination-active-border-color)}.disabled>.page-link,.page-link.disabled{color:var(--bs-pagination-disabled-color);pointer-events:none;background-color:var(--bs-pagination-disabled-bg);border-color:var(--bs-pagination-disabled-border-color)}.page-item:not(:first-child) .page-link{margin-left:calc(var(--bs-border-width) * -1)}.page-item:first-child .page-link{border-top-left-radius:var(--bs-pagination-border-radius);border-bottom-left-radius:var(--bs-pagination-border-radius)}.page-item:last-child .page-link{border-top-right-radius:var(--bs-pagination-border-radius);border-bottom-right-radius:var(--bs-pagination-border-radius)}.pagination-lg{--bs-pagination-padding-x:1.5rem;--bs-pagination-padding-y:0.75rem;--bs-pagination-font-size:1.25rem;--bs-pagination-border-radius:var(--bs-border-radius-lg)}.pagination-sm{--bs-pagination-padding-x:0.5rem;--bs-pagination-padding-y:0.25rem;--bs-pagination-font-size:0.875rem;--bs-pagination-border-radius:var(--bs-border-radius-sm)}.badge{--bs-badge-padding-x:0.65em;--bs-badge-padding-y:0.35em;--bs-badge-font-size:0.75em;--bs-badge-font-weight:700;--bs-badge-color:#fff;--bs-badge-border-radius:var(--bs-border-radius);display:inline-block;padding:var(--bs-badge-padding-y) var(--bs-badge-padding-x);font-size:var(--bs-badge-font-size);font-weight:var(--bs-badge-font-weight);line-height:1;color:var(--bs-badge-color);text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:var(--bs-badge-border-radius)}.badge:empty{display:none}.btn .badge{position:relative;top:-1px}.alert{--bs-alert-bg:transparent;--bs-alert-padding-x:1rem;--bs-alert-padding-y:1rem;--bs-alert-margin-bottom:1rem;--bs-alert-color:inherit;--bs-alert-border-color:transparent;--bs-alert-border:var(--bs-border-width) solid var(--bs-alert-border-color);--bs-alert-border-radius:var(--bs-border-radius);--bs-alert-link-color:inherit;position:relative;padding:var(--bs-alert-padding-y) var(--bs-alert-padding-x);margin-bottom:var(--bs-alert-margin-bottom);color:var(--bs-alert-color);background-color:var(--bs-alert-bg);border:var(--bs-alert-border);border-radius:var(--bs-alert-border-radius)}.alert-heading{color:inherit}.alert-link{font-weight:700;color:var(--bs-alert-link-color)}.alert-dismissible{padding-right:3rem}.alert-dismissible .btn-close{position:absolute;top:0;right:0;z-index:2;padding:1.25rem 1rem}.alert-primary{--bs-alert-color:var(--bs-primary-text-emphasis);--bs-alert-bg:var(--bs-primary-bg-subtle);--bs-alert-border-color:var(--bs-primary-border-subtle);--bs-alert-link-color:var(--bs-primary-text-emphasis)}.alert-secondary{--bs-alert-color:var(--bs-secondary-text-emphasis);--bs-alert-bg:var(--bs-secondary-bg-subtle);--bs-alert-border-color:var(--bs-secondary-border-subtle);--bs-alert-link-color:var(--bs-secondary-text-emphasis)}.alert-success{--bs-alert-color:var(--bs-success-text-emphasis);--bs-alert-bg:var(--bs-success-bg-subtle);--bs-alert-border-color:var(--bs-success-border-subtle);--bs-alert-link-color:var(--bs-success-text-emphasis)}.alert-info{--bs-alert-color:var(--bs-info-text-emphasis);--bs-alert-bg:var(--bs-info-bg-subtle);--bs-alert-border-color:var(--bs-info-border-subtle);--bs-alert-link-color:var(--bs-info-text-emphasis)}.alert-warning{--bs-alert-color:var(--bs-warning-text-emphasis);--bs-alert-bg:var(--bs-warning-bg-subtle);--bs-alert-border-color:var(--bs-warning-border-subtle);--bs-alert-link-color:var(--bs-warning-text-emphasis)}.alert-danger{--bs-alert-color:var(--bs-danger-text-emphasis);--bs-alert-bg:var(--bs-danger-bg-subtle);--bs-alert-border-color:var(--bs-danger-border-subtle);--bs-alert-link-color:var(--bs-danger-text-emphasis)}.alert-light{--bs-alert-color:var(--bs-light-text-emphasis);--bs-alert-bg:var(--bs-light-bg-subtle);--bs-alert-border-color:var(--bs-light-border-subtle);--bs-alert-link-color:var(--bs-light-text-emphasis)}.alert-dark{--bs-alert-color:var(--bs-dark-text-emphasis);--bs-alert-bg:var(--bs-dark-bg-subtle);--bs-alert-border-color:var(--bs-dark-border-subtle);--bs-alert-link-color:var(--bs-dark-text-emphasis)}@keyframes progress-bar-stripes{0%{background-position-x:1rem}}.progress,.progress-stacked{--bs-progress-height:1rem;--bs-progress-font-size:0.75rem;--bs-progress-bg:var(--bs-secondary-bg);--bs-progress-border-radius:var(--bs-border-radius);--bs-progress-box-shadow:var(--bs-box-shadow-inset);--bs-progress-bar-color:#fff;--bs-progress-bar-bg:#0d6efd;--bs-progress-bar-transition:width 0.6s ease;display:flex;height:var(--bs-progress-height);overflow:hidden;font-size:var(--bs-progress-font-size);background-color:var(--bs-progress-bg);border-radius:var(--bs-progress-border-radius)}.progress-bar{display:flex;flex-direction:column;justify-content:center;overflow:hidden;color:var(--bs-progress-bar-color);text-align:center;white-space:nowrap;background-color:var(--bs-progress-bar-bg);transition:var(--bs-progress-bar-transition)}@media (prefers-reduced-motion:reduce){.progress-bar{transition:none}}.progress-bar-striped{background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-size:var(--bs-progress-height) var(--bs-progress-height)}.progress-stacked>.progress{overflow:visible}.progress-stacked>.progress>.progress-bar{width:100%}.progress-bar-animated{animation:1s linear infinite progress-bar-stripes}@media (prefers-reduced-motion:reduce){.progress-bar-animated{animation:none}}.list-group{--bs-list-group-color:var(--bs-body-color);--bs-list-group-bg:var(--bs-body-bg);--bs-list-group-border-color:var(--bs-border-color);--bs-list-group-border-width:var(--bs-border-width);--bs-list-group-border-radius:var(--bs-border-radius);--bs-list-group-item-padding-x:1rem;--bs-list-group-item-padding-y:0.5rem;--bs-list-group-action-color:var(--bs-secondary-color);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-tertiary-bg);--bs-list-group-action-active-color:var(--bs-body-color);--bs-list-group-action-active-bg:var(--bs-secondary-bg);--bs-list-group-disabled-color:var(--bs-secondary-color);--bs-list-group-disabled-bg:var(--bs-body-bg);--bs-list-group-active-color:#fff;--bs-list-group-active-bg:#0d6efd;--bs-list-group-active-border-color:#0d6efd;display:flex;flex-direction:column;padding-left:0;margin-bottom:0;border-radius:var(--bs-list-group-border-radius)}.list-group-numbered{list-style-type:none;counter-reset:section}.list-group-numbered>.list-group-item::before{content:counters(section, ".") ". ";counter-increment:section}.list-group-item-action{width:100%;color:var(--bs-list-group-action-color);text-align:inherit}.list-group-item-action:focus,.list-group-item-action:hover{z-index:1;color:var(--bs-list-group-action-hover-color);text-decoration:none;background-color:var(--bs-list-group-action-hover-bg)}.list-group-item-action:active{color:var(--bs-list-group-action-active-color);background-color:var(--bs-list-group-action-active-bg)}.list-group-item{position:relative;display:block;padding:var(--bs-list-group-item-padding-y) var(--bs-list-group-item-padding-x);color:var(--bs-list-group-color);text-decoration:none;background-color:var(--bs-list-group-bg);border:var(--bs-list-group-border-width) solid var(--bs-list-group-border-color)}.list-group-item:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.list-group-item:last-child{border-bottom-right-radius:inherit;border-bottom-left-radius:inherit}.list-group-item.disabled,.list-group-item:disabled{color:var(--bs-list-group-disabled-color);pointer-events:none;background-color:var(--bs-list-group-disabled-bg)}.list-group-item.active{z-index:2;color:var(--bs-list-group-active-color);background-color:var(--bs-list-group-active-bg);border-color:var(--bs-list-group-active-border-color)}.list-group-item+.list-group-item{border-top-width:0}.list-group-item+.list-group-item.active{margin-top:calc(-1 * var(--bs-list-group-border-width));border-top-width:var(--bs-list-group-border-width)}.list-group-horizontal{flex-direction:row}.list-group-horizontal>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal>.list-group-item.active{margin-top:0}.list-group-horizontal>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal>.list-group-item+.list-group-item.active{margin-left:calc(-1 * var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}@media (min-width:576px){.list-group-horizontal-sm{flex-direction:row}.list-group-horizontal-sm>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-sm>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-sm>.list-group-item.active{margin-top:0}.list-group-horizontal-sm>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-sm>.list-group-item+.list-group-item.active{margin-left:calc(-1 * var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}@media (min-width:768px){.list-group-horizontal-md{flex-direction:row}.list-group-horizontal-md>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-md>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-md>.list-group-item.active{margin-top:0}.list-group-horizontal-md>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-md>.list-group-item+.list-group-item.active{margin-left:calc(-1 * var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}@media (min-width:992px){.list-group-horizontal-lg{flex-direction:row}.list-group-horizontal-lg>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-lg>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-lg>.list-group-item.active{margin-top:0}.list-group-horizontal-lg>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-lg>.list-group-item+.list-group-item.active{margin-left:calc(-1 * var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}@media (min-width:1200px){.list-group-horizontal-xl{flex-direction:row}.list-group-horizontal-xl>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-xl>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-xl>.list-group-item.active{margin-top:0}.list-group-horizontal-xl>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-xl>.list-group-item+.list-group-item.active{margin-left:calc(-1 * var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}@media (min-width:1400px){.list-group-horizontal-xxl{flex-direction:row}.list-group-horizontal-xxl>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-xxl>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-xxl>.list-group-item.active{margin-top:0}.list-group-horizontal-xxl>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-xxl>.list-group-item+.list-group-item.active{margin-left:calc(-1 * var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}.list-group-flush{border-radius:0}.list-group-flush>.list-group-item{border-width:0 0 var(--bs-list-group-border-width)}.list-group-flush>.list-group-item:last-child{border-bottom-width:0}.list-group-item-primary{--bs-list-group-color:var(--bs-primary-text-emphasis);--bs-list-group-bg:var(--bs-primary-bg-subtle);--bs-list-group-border-color:var(--bs-primary-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-primary-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-primary-border-subtle);--bs-list-group-active-color:var(--bs-primary-bg-subtle);--bs-list-group-active-bg:var(--bs-primary-text-emphasis);--bs-list-group-active-border-color:var(--bs-primary-text-emphasis)}.list-group-item-secondary{--bs-list-group-color:var(--bs-secondary-text-emphasis);--bs-list-group-bg:var(--bs-secondary-bg-subtle);--bs-list-group-border-color:var(--bs-secondary-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-secondary-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-secondary-border-subtle);--bs-list-group-active-color:var(--bs-secondary-bg-subtle);--bs-list-group-active-bg:var(--bs-secondary-text-emphasis);--bs-list-group-active-border-color:var(--bs-secondary-text-emphasis)}.list-group-item-success{--bs-list-group-color:var(--bs-success-text-emphasis);--bs-list-group-bg:var(--bs-success-bg-subtle);--bs-list-group-border-color:var(--bs-success-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-success-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-success-border-subtle);--bs-list-group-active-color:var(--bs-success-bg-subtle);--bs-list-group-active-bg:var(--bs-success-text-emphasis);--bs-list-group-active-border-color:var(--bs-success-text-emphasis)}.list-group-item-info{--bs-list-group-color:var(--bs-info-text-emphasis);--bs-list-group-bg:var(--bs-info-bg-subtle);--bs-list-group-border-color:var(--bs-info-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-info-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-info-border-subtle);--bs-list-group-active-color:var(--bs-info-bg-subtle);--bs-list-group-active-bg:var(--bs-info-text-emphasis);--bs-list-group-active-border-color:var(--bs-info-text-emphasis)}.list-group-item-warning{--bs-list-group-color:var(--bs-warning-text-emphasis);--bs-list-group-bg:var(--bs-warning-bg-subtle);--bs-list-group-border-color:var(--bs-warning-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-warning-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-warning-border-subtle);--bs-list-group-active-color:var(--bs-warning-bg-subtle);--bs-list-group-active-bg:var(--bs-warning-text-emphasis);--bs-list-group-active-border-color:var(--bs-warning-text-emphasis)}.list-group-item-danger{--bs-list-group-color:var(--bs-danger-text-emphasis);--bs-list-group-bg:var(--bs-danger-bg-subtle);--bs-list-group-border-color:var(--bs-danger-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-danger-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-danger-border-subtle);--bs-list-group-active-color:var(--bs-danger-bg-subtle);--bs-list-group-active-bg:var(--bs-danger-text-emphasis);--bs-list-group-active-border-color:var(--bs-danger-text-emphasis)}.list-group-item-light{--bs-list-group-color:var(--bs-light-text-emphasis);--bs-list-group-bg:var(--bs-light-bg-subtle);--bs-list-group-border-color:var(--bs-light-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-light-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-light-border-subtle);--bs-list-group-active-color:var(--bs-light-bg-subtle);--bs-list-group-active-bg:var(--bs-light-text-emphasis);--bs-list-group-active-border-color:var(--bs-light-text-emphasis)}.list-group-item-dark{--bs-list-group-color:var(--bs-dark-text-emphasis);--bs-list-group-bg:var(--bs-dark-bg-subtle);--bs-list-group-border-color:var(--bs-dark-border-subtle);--bs-list-group-action-hover-color:var(--bs-emphasis-color);--bs-list-group-action-hover-bg:var(--bs-dark-border-subtle);--bs-list-group-action-active-color:var(--bs-emphasis-color);--bs-list-group-action-active-bg:var(--bs-dark-border-subtle);--bs-list-group-active-color:var(--bs-dark-bg-subtle);--bs-list-group-active-bg:var(--bs-dark-text-emphasis);--bs-list-group-active-border-color:var(--bs-dark-text-emphasis)}.btn-close{--bs-btn-close-color:#000;--bs-btn-close-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");--bs-btn-close-opacity:0.5;--bs-btn-close-hover-opacity:0.75;--bs-btn-close-focus-shadow:0 0 0 0.25rem rgba(13, 110, 253, 0.25);--bs-btn-close-focus-opacity:1;--bs-btn-close-disabled-opacity:0.25;--bs-btn-close-white-filter:invert(1) grayscale(100%) brightness(200%);box-sizing:content-box;width:1em;height:1em;padding:.25em .25em;color:var(--bs-btn-close-color);background:transparent var(--bs-btn-close-bg) center/1em auto no-repeat;border:0;border-radius:.375rem;opacity:var(--bs-btn-close-opacity)}.btn-close:hover{color:var(--bs-btn-close-color);text-decoration:none;opacity:var(--bs-btn-close-hover-opacity)}.btn-close:focus{outline:0;box-shadow:var(--bs-btn-close-focus-shadow);opacity:var(--bs-btn-close-focus-opacity)}.btn-close.disabled,.btn-close:disabled{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--bs-btn-close-disabled-opacity)}.btn-close-white{filter:var(--bs-btn-close-white-filter)}[data-bs-theme=dark] .btn-close{filter:var(--bs-btn-close-white-filter)}.toast{--bs-toast-zindex:1090;--bs-toast-padding-x:0.75rem;--bs-toast-padding-y:0.5rem;--bs-toast-spacing:1.5rem;--bs-toast-max-width:350px;--bs-toast-font-size:0.875rem;--bs-toast-color: ;--bs-toast-bg:rgba(var(--bs-body-bg-rgb), 0.85);--bs-toast-border-width:var(--bs-border-width);--bs-toast-border-color:var(--bs-border-color-translucent);--bs-toast-border-radius:var(--bs-border-radius);--bs-toast-box-shadow:var(--bs-box-shadow);--bs-toast-header-color:var(--bs-secondary-color);--bs-toast-header-bg:rgba(var(--bs-body-bg-rgb), 0.85);--bs-toast-header-border-color:var(--bs-border-color-translucent);width:var(--bs-toast-max-width);max-width:100%;font-size:var(--bs-toast-font-size);color:var(--bs-toast-color);pointer-events:auto;background-color:var(--bs-toast-bg);background-clip:padding-box;border:var(--bs-toast-border-width) solid var(--bs-toast-border-color);box-shadow:var(--bs-toast-box-shadow);border-radius:var(--bs-toast-border-radius)}.toast.showing{opacity:0}.toast:not(.show){display:none}.toast-container{--bs-toast-zindex:1090;position:absolute;z-index:var(--bs-toast-zindex);width:-webkit-max-content;width:-moz-max-content;width:max-content;max-width:100%;pointer-events:none}.toast-container>:not(:last-child){margin-bottom:var(--bs-toast-spacing)}.toast-header{display:flex;align-items:center;padding:var(--bs-toast-padding-y) var(--bs-toast-padding-x);color:var(--bs-toast-header-color);background-color:var(--bs-toast-header-bg);background-clip:padding-box;border-bottom:var(--bs-toast-border-width) solid var(--bs-toast-header-border-color);border-top-left-radius:calc(var(--bs-toast-border-radius) - var(--bs-toast-border-width));border-top-right-radius:calc(var(--bs-toast-border-radius) - var(--bs-toast-border-width))}.toast-header .btn-close{margin-right:calc(-.5 * var(--bs-toast-padding-x));margin-left:var(--bs-toast-padding-x)}.toast-body{padding:var(--bs-toast-padding-x);word-wrap:break-word}.modal{--bs-modal-zindex:1055;--bs-modal-width:500px;--bs-modal-padding:1rem;--bs-modal-margin:0.5rem;--bs-modal-color: ;--bs-modal-bg:var(--bs-body-bg);--bs-modal-border-color:var(--bs-border-color-translucent);--bs-modal-border-width:var(--bs-border-width);--bs-modal-border-radius:var(--bs-border-radius-lg);--bs-modal-box-shadow:var(--bs-box-shadow-sm);--bs-modal-inner-border-radius:calc(var(--bs-border-radius-lg) - (var(--bs-border-width)));--bs-modal-header-padding-x:1rem;--bs-modal-header-padding-y:1rem;--bs-modal-header-padding:1rem 1rem;--bs-modal-header-border-color:var(--bs-border-color);--bs-modal-header-border-width:var(--bs-border-width);--bs-modal-title-line-height:1.5;--bs-modal-footer-gap:0.5rem;--bs-modal-footer-bg: ;--bs-modal-footer-border-color:var(--bs-border-color);--bs-modal-footer-border-width:var(--bs-border-width);position:fixed;top:0;left:0;z-index:var(--bs-modal-zindex);display:none;width:100%;height:100%;overflow-x:hidden;overflow-y:auto;outline:0}.modal-dialog{position:relative;width:auto;margin:var(--bs-modal-margin);pointer-events:none}.modal.fade .modal-dialog{transition:transform .3s ease-out;transform:translate(0,-50px)}@media (prefers-reduced-motion:reduce){.modal.fade .modal-dialog{transition:none}}.modal.show .modal-dialog{transform:none}.modal.modal-static .modal-dialog{transform:scale(1.02)}.modal-dialog-scrollable{height:calc(100% - var(--bs-modal-margin) * 2)}.modal-dialog-scrollable .modal-content{max-height:100%;overflow:hidden}.modal-dialog-scrollable .modal-body{overflow-y:auto}.modal-dialog-centered{display:flex;align-items:center;min-height:calc(100% - var(--bs-modal-margin) * 2)}.modal-content{position:relative;display:flex;flex-direction:column;width:100%;color:var(--bs-modal-color);pointer-events:auto;background-color:var(--bs-modal-bg);background-clip:padding-box;border:var(--bs-modal-border-width) solid var(--bs-modal-border-color);border-radius:var(--bs-modal-border-radius);outline:0}.modal-backdrop{--bs-backdrop-zindex:1050;--bs-backdrop-bg:#000;--bs-backdrop-opacity:0.5;position:fixed;top:0;left:0;z-index:var(--bs-backdrop-zindex);width:100vw;height:100vh;background-color:var(--bs-backdrop-bg)}.modal-backdrop.fade{opacity:0}.modal-backdrop.show{opacity:var(--bs-backdrop-opacity)}.modal-header{display:flex;flex-shrink:0;align-items:center;padding:var(--bs-modal-header-padding);border-bottom:var(--bs-modal-header-border-width) solid var(--bs-modal-header-border-color);border-top-left-radius:var(--bs-modal-inner-border-radius);border-top-right-radius:var(--bs-modal-inner-border-radius)}.modal-header .btn-close{padding:calc(var(--bs-modal-header-padding-y) * .5) calc(var(--bs-modal-header-padding-x) * .5);margin:calc(-.5 * var(--bs-modal-header-padding-y)) calc(-.5 * var(--bs-modal-header-padding-x)) calc(-.5 * var(--bs-modal-header-padding-y)) auto}.modal-title{margin-bottom:0;line-height:var(--bs-modal-title-line-height)}.modal-body{position:relative;flex:1 1 auto;padding:var(--bs-modal-padding)}.modal-footer{display:flex;flex-shrink:0;flex-wrap:wrap;align-items:center;justify-content:flex-end;padding:calc(var(--bs-modal-padding) - var(--bs-modal-footer-gap) * .5);background-color:var(--bs-modal-footer-bg);border-top:var(--bs-modal-footer-border-width) solid var(--bs-modal-footer-border-color);border-bottom-right-radius:var(--bs-modal-inner-border-radius);border-bottom-left-radius:var(--bs-modal-inner-border-radius)}.modal-footer>*{margin:calc(var(--bs-modal-footer-gap) * .5)}@media (min-width:576px){.modal{--bs-modal-margin:1.75rem;--bs-modal-box-shadow:var(--bs-box-shadow)}.modal-dialog{max-width:var(--bs-modal-width);margin-right:auto;margin-left:auto}.modal-sm{--bs-modal-width:300px}}@media (min-width:992px){.modal-lg,.modal-xl{--bs-modal-width:800px}}@media (min-width:1200px){.modal-xl{--bs-modal-width:1140px}}.modal-fullscreen{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen .modal-footer,.modal-fullscreen .modal-header{border-radius:0}.modal-fullscreen .modal-body{overflow-y:auto}@media (max-width:575.98px){.modal-fullscreen-sm-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-sm-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-sm-down .modal-footer,.modal-fullscreen-sm-down .modal-header{border-radius:0}.modal-fullscreen-sm-down .modal-body{overflow-y:auto}}@media (max-width:767.98px){.modal-fullscreen-md-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-md-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-md-down .modal-footer,.modal-fullscreen-md-down .modal-header{border-radius:0}.modal-fullscreen-md-down .modal-body{overflow-y:auto}}@media (max-width:991.98px){.modal-fullscreen-lg-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-lg-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-lg-down .modal-footer,.modal-fullscreen-lg-down .modal-header{border-radius:0}.modal-fullscreen-lg-down .modal-body{overflow-y:auto}}@media (max-width:1199.98px){.modal-fullscreen-xl-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-xl-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-xl-down .modal-footer,.modal-fullscreen-xl-down .modal-header{border-radius:0}.modal-fullscreen-xl-down .modal-body{overflow-y:auto}}@media (max-width:1399.98px){.modal-fullscreen-xxl-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-xxl-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-xxl-down .modal-footer,.modal-fullscreen-xxl-down .modal-header{border-radius:0}.modal-fullscreen-xxl-down .modal-body{overflow-y:auto}}.tooltip{--bs-tooltip-zindex:1080;--bs-tooltip-max-width:200px;--bs-tooltip-padding-x:0.5rem;--bs-tooltip-padding-y:0.25rem;--bs-tooltip-margin: ;--bs-tooltip-font-size:0.875rem;--bs-tooltip-color:var(--bs-body-bg);--bs-tooltip-bg:var(--bs-emphasis-color);--bs-tooltip-border-radius:var(--bs-border-radius);--bs-tooltip-opacity:0.9;--bs-tooltip-arrow-width:0.8rem;--bs-tooltip-arrow-height:0.4rem;z-index:var(--bs-tooltip-zindex);display:block;margin:var(--bs-tooltip-margin);font-family:var(--bs-font-sans-serif);font-style:normal;font-weight:400;line-height:1.5;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;word-break:normal;white-space:normal;word-spacing:normal;line-break:auto;font-size:var(--bs-tooltip-font-size);word-wrap:break-word;opacity:0}.tooltip.show{opacity:var(--bs-tooltip-opacity)}.tooltip .tooltip-arrow{display:block;width:var(--bs-tooltip-arrow-width);height:var(--bs-tooltip-arrow-height)}.tooltip .tooltip-arrow::before{position:absolute;content:"";border-color:transparent;border-style:solid}.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow,.bs-tooltip-top .tooltip-arrow{bottom:calc(-1 * var(--bs-tooltip-arrow-height))}.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before,.bs-tooltip-top .tooltip-arrow::before{top:-1px;border-width:var(--bs-tooltip-arrow-height) calc(var(--bs-tooltip-arrow-width) * .5) 0;border-top-color:var(--bs-tooltip-bg)}.bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow,.bs-tooltip-end .tooltip-arrow{left:calc(-1 * var(--bs-tooltip-arrow-height));width:var(--bs-tooltip-arrow-height);height:var(--bs-tooltip-arrow-width)}.bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow::before,.bs-tooltip-end .tooltip-arrow::before{right:-1px;border-width:calc(var(--bs-tooltip-arrow-width) * .5) var(--bs-tooltip-arrow-height) calc(var(--bs-tooltip-arrow-width) * .5) 0;border-right-color:var(--bs-tooltip-bg)}.bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow,.bs-tooltip-bottom .tooltip-arrow{top:calc(-1 * var(--bs-tooltip-arrow-height))}.bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow::before,.bs-tooltip-bottom .tooltip-arrow::before{bottom:-1px;border-width:0 calc(var(--bs-tooltip-arrow-width) * .5) var(--bs-tooltip-arrow-height);border-bottom-color:var(--bs-tooltip-bg)}.bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow,.bs-tooltip-start .tooltip-arrow{right:calc(-1 * var(--bs-tooltip-arrow-height));width:var(--bs-tooltip-arrow-height);height:var(--bs-tooltip-arrow-width)}.bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow::before,.bs-tooltip-start .tooltip-arrow::before{left:-1px;border-width:calc(var(--bs-tooltip-arrow-width) * .5) 0 calc(var(--bs-tooltip-arrow-width) * .5) var(--bs-tooltip-arrow-height);border-left-color:var(--bs-tooltip-bg)}.tooltip-inner{max-width:var(--bs-tooltip-max-width);padding:var(--bs-tooltip-padding-y) var(--bs-tooltip-padding-x);color:var(--bs-tooltip-color);text-align:center;background-color:var(--bs-tooltip-bg);border-radius:var(--bs-tooltip-border-radius)}.popover{--bs-popover-zindex:1070;--bs-popover-max-width:276px;--bs-popover-font-size:0.875rem;--bs-popover-bg:var(--bs-body-bg);--bs-popover-border-width:var(--bs-border-width);--bs-popover-border-color:var(--bs-border-color-translucent);--bs-popover-border-radius:var(--bs-border-radius-lg);--bs-popover-inner-border-radius:calc(var(--bs-border-radius-lg) - var(--bs-border-width));--bs-popover-box-shadow:var(--bs-box-shadow);--bs-popover-header-padding-x:1rem;--bs-popover-header-padding-y:0.5rem;--bs-popover-header-font-size:1rem;--bs-popover-header-color:inherit;--bs-popover-header-bg:var(--bs-secondary-bg);--bs-popover-body-padding-x:1rem;--bs-popover-body-padding-y:1rem;--bs-popover-body-color:var(--bs-body-color);--bs-popover-arrow-width:1rem;--bs-popover-arrow-height:0.5rem;--bs-popover-arrow-border:var(--bs-popover-border-color);z-index:var(--bs-popover-zindex);display:block;max-width:var(--bs-popover-max-width);font-family:var(--bs-font-sans-serif);font-style:normal;font-weight:400;line-height:1.5;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;word-break:normal;white-space:normal;word-spacing:normal;line-break:auto;font-size:var(--bs-popover-font-size);word-wrap:break-word;background-color:var(--bs-popover-bg);background-clip:padding-box;border:var(--bs-popover-border-width) solid var(--bs-popover-border-color);border-radius:var(--bs-popover-border-radius)}.popover .popover-arrow{display:block;width:var(--bs-popover-arrow-width);height:var(--bs-popover-arrow-height)}.popover .popover-arrow::after,.popover .popover-arrow::before{position:absolute;display:block;content:"";border-color:transparent;border-style:solid;border-width:0}.bs-popover-auto[data-popper-placement^=top]>.popover-arrow,.bs-popover-top>.popover-arrow{bottom:calc(-1 * (var(--bs-popover-arrow-height)) - var(--bs-popover-border-width))}.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::before,.bs-popover-top>.popover-arrow::after,.bs-popover-top>.popover-arrow::before{border-width:var(--bs-popover-arrow-height) calc(var(--bs-popover-arrow-width) * .5) 0}.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::before,.bs-popover-top>.popover-arrow::before{bottom:0;border-top-color:var(--bs-popover-arrow-border)}.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::after,.bs-popover-top>.popover-arrow::after{bottom:var(--bs-popover-border-width);border-top-color:var(--bs-popover-bg)}.bs-popover-auto[data-popper-placement^=right]>.popover-arrow,.bs-popover-end>.popover-arrow{left:calc(-1 * (var(--bs-popover-arrow-height)) - var(--bs-popover-border-width));width:var(--bs-popover-arrow-height);height:var(--bs-popover-arrow-width)}.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::before,.bs-popover-end>.popover-arrow::after,.bs-popover-end>.popover-arrow::before{border-width:calc(var(--bs-popover-arrow-width) * .5) var(--bs-popover-arrow-height) calc(var(--bs-popover-arrow-width) * .5) 0}.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::before,.bs-popover-end>.popover-arrow::before{left:0;border-right-color:var(--bs-popover-arrow-border)}.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::after,.bs-popover-end>.popover-arrow::after{left:var(--bs-popover-border-width);border-right-color:var(--bs-popover-bg)}.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow,.bs-popover-bottom>.popover-arrow{top:calc(-1 * (var(--bs-popover-arrow-height)) - var(--bs-popover-border-width))}.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::before,.bs-popover-bottom>.popover-arrow::after,.bs-popover-bottom>.popover-arrow::before{border-width:0 calc(var(--bs-popover-arrow-width) * .5) var(--bs-popover-arrow-height)}.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::before,.bs-popover-bottom>.popover-arrow::before{top:0;border-bottom-color:var(--bs-popover-arrow-border)}.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::after,.bs-popover-bottom>.popover-arrow::after{top:var(--bs-popover-border-width);border-bottom-color:var(--bs-popover-bg)}.bs-popover-auto[data-popper-placement^=bottom] .popover-header::before,.bs-popover-bottom .popover-header::before{position:absolute;top:0;left:50%;display:block;width:var(--bs-popover-arrow-width);margin-left:calc(-.5 * var(--bs-popover-arrow-width));content:"";border-bottom:var(--bs-popover-border-width) solid var(--bs-popover-header-bg)}.bs-popover-auto[data-popper-placement^=left]>.popover-arrow,.bs-popover-start>.popover-arrow{right:calc(-1 * (var(--bs-popover-arrow-height)) - var(--bs-popover-border-width));width:var(--bs-popover-arrow-height);height:var(--bs-popover-arrow-width)}.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::before,.bs-popover-start>.popover-arrow::after,.bs-popover-start>.popover-arrow::before{border-width:calc(var(--bs-popover-arrow-width) * .5) 0 calc(var(--bs-popover-arrow-width) * .5) var(--bs-popover-arrow-height)}.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::before,.bs-popover-start>.popover-arrow::before{right:0;border-left-color:var(--bs-popover-arrow-border)}.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::after,.bs-popover-start>.popover-arrow::after{right:var(--bs-popover-border-width);border-left-color:var(--bs-popover-bg)}.popover-header{padding:var(--bs-popover-header-padding-y) var(--bs-popover-header-padding-x);margin-bottom:0;font-size:var(--bs-popover-header-font-size);color:var(--bs-popover-header-color);background-color:var(--bs-popover-header-bg);border-bottom:var(--bs-popover-border-width) solid var(--bs-popover-border-color);border-top-left-radius:var(--bs-popover-inner-border-radius);border-top-right-radius:var(--bs-popover-inner-border-radius)}.popover-header:empty{display:none}.popover-body{padding:var(--bs-popover-body-padding-y) var(--bs-popover-body-padding-x);color:var(--bs-popover-body-color)}.carousel{position:relative}.carousel.pointer-event{touch-action:pan-y}.carousel-inner{position:relative;width:100%;overflow:hidden}.carousel-inner::after{display:block;clear:both;content:""}.carousel-item{position:relative;display:none;float:left;width:100%;margin-right:-100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:transform .6s ease-in-out}@media (prefers-reduced-motion:reduce){.carousel-item{transition:none}}.carousel-item-next,.carousel-item-prev,.carousel-item.active{display:block}.active.carousel-item-end,.carousel-item-next:not(.carousel-item-start){transform:translateX(100%)}.active.carousel-item-start,.carousel-item-prev:not(.carousel-item-end){transform:translateX(-100%)}.carousel-fade .carousel-item{opacity:0;transition-property:opacity;transform:none}.carousel-fade .carousel-item-next.carousel-item-start,.carousel-fade .carousel-item-prev.carousel-item-end,.carousel-fade .carousel-item.active{z-index:1;opacity:1}.carousel-fade .active.carousel-item-end,.carousel-fade .active.carousel-item-start{z-index:0;opacity:0;transition:opacity 0s .6s}@media (prefers-reduced-motion:reduce){.carousel-fade .active.carousel-item-end,.carousel-fade .active.carousel-item-start{transition:none}}.carousel-control-next,.carousel-control-prev{position:absolute;top:0;bottom:0;z-index:1;display:flex;align-items:center;justify-content:center;width:15%;padding:0;color:#fff;text-align:center;background:0 0;border:0;opacity:.5;transition:opacity .15s ease}@media (prefers-reduced-motion:reduce){.carousel-control-next,.carousel-control-prev{transition:none}}.carousel-control-next:focus,.carousel-control-next:hover,.carousel-control-prev:focus,.carousel-control-prev:hover{color:#fff;text-decoration:none;outline:0;opacity:.9}.carousel-control-prev{left:0}.carousel-control-next{right:0}.carousel-control-next-icon,.carousel-control-prev-icon{display:inline-block;width:2rem;height:2rem;background-repeat:no-repeat;background-position:50%;background-size:100% 100%}.carousel-control-prev-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e")}.carousel-control-next-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")}.carousel-indicators{position:absolute;right:0;bottom:0;left:0;z-index:2;display:flex;justify-content:center;padding:0;margin-right:15%;margin-bottom:1rem;margin-left:15%}.carousel-indicators [data-bs-target]{box-sizing:content-box;flex:0 1 auto;width:30px;height:3px;padding:0;margin-right:3px;margin-left:3px;text-indent:-999px;cursor:pointer;background-color:#fff;background-clip:padding-box;border:0;border-top:10px solid transparent;border-bottom:10px solid transparent;opacity:.5;transition:opacity .6s ease}@media (prefers-reduced-motion:reduce){.carousel-indicators [data-bs-target]{transition:none}}.carousel-indicators .active{opacity:1}.carousel-caption{position:absolute;right:15%;bottom:1.25rem;left:15%;padding-top:1.25rem;padding-bottom:1.25rem;color:#fff;text-align:center}.carousel-dark .carousel-control-next-icon,.carousel-dark .carousel-control-prev-icon{filter:invert(1) grayscale(100)}.carousel-dark .carousel-indicators [data-bs-target]{background-color:#000}.carousel-dark .carousel-caption{color:#000}[data-bs-theme=dark] .carousel .carousel-control-next-icon,[data-bs-theme=dark] .carousel .carousel-control-prev-icon,[data-bs-theme=dark].carousel .carousel-control-next-icon,[data-bs-theme=dark].carousel .carousel-control-prev-icon{filter:invert(1) grayscale(100)}[data-bs-theme=dark] .carousel .carousel-indicators [data-bs-target],[data-bs-theme=dark].carousel .carousel-indicators [data-bs-target]{background-color:#000}[data-bs-theme=dark] .carousel .carousel-caption,[data-bs-theme=dark].carousel .carousel-caption{color:#000}.spinner-border,.spinner-grow{display:inline-block;width:var(--bs-spinner-width);height:var(--bs-spinner-height);vertical-align:var(--bs-spinner-vertical-align);border-radius:50%;animation:var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name)}@keyframes spinner-border{to{transform:rotate(360deg)}}.spinner-border{--bs-spinner-width:2rem;--bs-spinner-height:2rem;--bs-spinner-vertical-align:-0.125em;--bs-spinner-border-width:0.25em;--bs-spinner-animation-speed:0.75s;--bs-spinner-animation-name:spinner-border;border:var(--bs-spinner-border-width) solid currentcolor;border-right-color:transparent}.spinner-border-sm{--bs-spinner-width:1rem;--bs-spinner-height:1rem;--bs-spinner-border-width:0.2em}@keyframes spinner-grow{0%{transform:scale(0)}50%{opacity:1;transform:none}}.spinner-grow{--bs-spinner-width:2rem;--bs-spinner-height:2rem;--bs-spinner-vertical-align:-0.125em;--bs-spinner-animation-speed:0.75s;--bs-spinner-animation-name:spinner-grow;background-color:currentcolor;opacity:0}.spinner-grow-sm{--bs-spinner-width:1rem;--bs-spinner-height:1rem}@media (prefers-reduced-motion:reduce){.spinner-border,.spinner-grow{--bs-spinner-animation-speed:1.5s}}.offcanvas,.offcanvas-lg,.offcanvas-md,.offcanvas-sm,.offcanvas-xl,.offcanvas-xxl{--bs-offcanvas-zindex:1045;--bs-offcanvas-width:400px;--bs-offcanvas-height:30vh;--bs-offcanvas-padding-x:1rem;--bs-offcanvas-padding-y:1rem;--bs-offcanvas-color:var(--bs-body-color);--bs-offcanvas-bg:var(--bs-body-bg);--bs-offcanvas-border-width:var(--bs-border-width);--bs-offcanvas-border-color:var(--bs-border-color-translucent);--bs-offcanvas-box-shadow:var(--bs-box-shadow-sm);--bs-offcanvas-transition:transform 0.3s ease-in-out;--bs-offcanvas-title-line-height:1.5}@media (max-width:575.98px){.offcanvas-sm{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:var(--bs-offcanvas-transition)}}@media (max-width:575.98px) and (prefers-reduced-motion:reduce){.offcanvas-sm{transition:none}}@media (max-width:575.98px){.offcanvas-sm.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}.offcanvas-sm.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}.offcanvas-sm.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}.offcanvas-sm.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}.offcanvas-sm.show:not(.hiding),.offcanvas-sm.showing{transform:none}.offcanvas-sm.hiding,.offcanvas-sm.show,.offcanvas-sm.showing{visibility:visible}}@media (min-width:576px){.offcanvas-sm{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-sm .offcanvas-header{display:none}.offcanvas-sm .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}@media (max-width:767.98px){.offcanvas-md{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:var(--bs-offcanvas-transition)}}@media (max-width:767.98px) and (prefers-reduced-motion:reduce){.offcanvas-md{transition:none}}@media (max-width:767.98px){.offcanvas-md.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}.offcanvas-md.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}.offcanvas-md.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}.offcanvas-md.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}.offcanvas-md.show:not(.hiding),.offcanvas-md.showing{transform:none}.offcanvas-md.hiding,.offcanvas-md.show,.offcanvas-md.showing{visibility:visible}}@media (min-width:768px){.offcanvas-md{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-md .offcanvas-header{display:none}.offcanvas-md .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}@media (max-width:991.98px){.offcanvas-lg{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:var(--bs-offcanvas-transition)}}@media (max-width:991.98px) and (prefers-reduced-motion:reduce){.offcanvas-lg{transition:none}}@media (max-width:991.98px){.offcanvas-lg.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}.offcanvas-lg.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}.offcanvas-lg.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}.offcanvas-lg.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}.offcanvas-lg.show:not(.hiding),.offcanvas-lg.showing{transform:none}.offcanvas-lg.hiding,.offcanvas-lg.show,.offcanvas-lg.showing{visibility:visible}}@media (min-width:992px){.offcanvas-lg{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-lg .offcanvas-header{display:none}.offcanvas-lg .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}@media (max-width:1199.98px){.offcanvas-xl{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:var(--bs-offcanvas-transition)}}@media (max-width:1199.98px) and (prefers-reduced-motion:reduce){.offcanvas-xl{transition:none}}@media (max-width:1199.98px){.offcanvas-xl.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}.offcanvas-xl.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}.offcanvas-xl.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}.offcanvas-xl.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}.offcanvas-xl.show:not(.hiding),.offcanvas-xl.showing{transform:none}.offcanvas-xl.hiding,.offcanvas-xl.show,.offcanvas-xl.showing{visibility:visible}}@media (min-width:1200px){.offcanvas-xl{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-xl .offcanvas-header{display:none}.offcanvas-xl .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}@media (max-width:1399.98px){.offcanvas-xxl{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:var(--bs-offcanvas-transition)}}@media (max-width:1399.98px) and (prefers-reduced-motion:reduce){.offcanvas-xxl{transition:none}}@media (max-width:1399.98px){.offcanvas-xxl.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}.offcanvas-xxl.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}.offcanvas-xxl.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}.offcanvas-xxl.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}.offcanvas-xxl.show:not(.hiding),.offcanvas-xxl.showing{transform:none}.offcanvas-xxl.hiding,.offcanvas-xxl.show,.offcanvas-xxl.showing{visibility:visible}}@media (min-width:1400px){.offcanvas-xxl{--bs-offcanvas-height:auto;--bs-offcanvas-border-width:0;background-color:transparent!important}.offcanvas-xxl .offcanvas-header{display:none}.offcanvas-xxl .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:transparent!important}}.offcanvas{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:var(--bs-offcanvas-transition)}@media (prefers-reduced-motion:reduce){.offcanvas{transition:none}}.offcanvas.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}.offcanvas.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}.offcanvas.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}.offcanvas.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}.offcanvas.show:not(.hiding),.offcanvas.showing{transform:none}.offcanvas.hiding,.offcanvas.show,.offcanvas.showing{visibility:visible}.offcanvas-backdrop{position:fixed;top:0;left:0;z-index:1040;width:100vw;height:100vh;background-color:#000}.offcanvas-backdrop.fade{opacity:0}.offcanvas-backdrop.show{opacity:.5}.offcanvas-header{display:flex;align-items:center;padding:var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x)}.offcanvas-header .btn-close{padding:calc(var(--bs-offcanvas-padding-y) * .5) calc(var(--bs-offcanvas-padding-x) * .5);margin:calc(-.5 * var(--bs-offcanvas-padding-y)) calc(-.5 * var(--bs-offcanvas-padding-x)) calc(-.5 * var(--bs-offcanvas-padding-y)) auto}.offcanvas-title{margin-bottom:0;line-height:var(--bs-offcanvas-title-line-height)}.offcanvas-body{flex-grow:1;padding:var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x);overflow-y:auto}.placeholder{display:inline-block;min-height:1em;vertical-align:middle;cursor:wait;background-color:currentcolor;opacity:.5}.placeholder.btn::before{display:inline-block;content:""}.placeholder-xs{min-height:.6em}.placeholder-sm{min-height:.8em}.placeholder-lg{min-height:1.2em}.placeholder-glow .placeholder{animation:placeholder-glow 2s ease-in-out infinite}@keyframes placeholder-glow{50%{opacity:.2}}.placeholder-wave{-webkit-mask-image:linear-gradient(130deg,#000 55%,rgba(0,0,0,0.8) 75%,#000 95%);mask-image:linear-gradient(130deg,#000 55%,rgba(0,0,0,0.8) 75%,#000 95%);-webkit-mask-size:200% 100%;mask-size:200% 100%;animation:placeholder-wave 2s linear infinite}@keyframes placeholder-wave{100%{-webkit-mask-position:-200% 0%;mask-position:-200% 0%}}.clearfix::after{display:block;clear:both;content:""}.text-bg-primary{color:#fff!important;background-color:RGBA(var(--bs-primary-rgb),var(--bs-bg-opacity,1))!important}.text-bg-secondary{color:#fff!important;background-color:RGBA(var(--bs-secondary-rgb),var(--bs-bg-opacity,1))!important}.text-bg-success{color:#fff!important;background-color:RGBA(var(--bs-success-rgb),var(--bs-bg-opacity,1))!important}.text-bg-info{color:#000!important;background-color:RGBA(var(--bs-info-rgb),var(--bs-bg-opacity,1))!important}.text-bg-warning{color:#000!important;background-color:RGBA(var(--bs-warning-rgb),var(--bs-bg-opacity,1))!important}.text-bg-danger{color:#fff!important;background-color:RGBA(var(--bs-danger-rgb),var(--bs-bg-opacity,1))!important}.text-bg-light{color:#000!important;background-color:RGBA(var(--bs-light-rgb),var(--bs-bg-opacity,1))!important}.text-bg-dark{color:#fff!important;background-color:RGBA(var(--bs-dark-rgb),var(--bs-bg-opacity,1))!important}.link-primary{color:RGBA(var(--bs-primary-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(var(--bs-primary-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(var(--bs-primary-rgb),var(--bs-link-underline-opacity,1))!important}.link-primary:focus,.link-primary:hover{color:RGBA(10,88,202,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(10,88,202,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(10,88,202,var(--bs-link-underline-opacity,1))!important}.link-secondary{color:RGBA(var(--bs-secondary-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(var(--bs-secondary-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(var(--bs-secondary-rgb),var(--bs-link-underline-opacity,1))!important}.link-secondary:focus,.link-secondary:hover{color:RGBA(86,94,100,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(86,94,100,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(86,94,100,var(--bs-link-underline-opacity,1))!important}.link-success{color:RGBA(var(--bs-success-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(var(--bs-success-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(var(--bs-success-rgb),var(--bs-link-underline-opacity,1))!important}.link-success:focus,.link-success:hover{color:RGBA(20,108,67,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(20,108,67,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(20,108,67,var(--bs-link-underline-opacity,1))!important}.link-info{color:RGBA(var(--bs-info-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(var(--bs-info-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(var(--bs-info-rgb),var(--bs-link-underline-opacity,1))!important}.link-info:focus,.link-info:hover{color:RGBA(61,213,243,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(61,213,243,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(61,213,243,var(--bs-link-underline-opacity,1))!important}.link-warning{color:RGBA(var(--bs-warning-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(var(--bs-warning-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(var(--bs-warning-rgb),var(--bs-link-underline-opacity,1))!important}.link-warning:focus,.link-warning:hover{color:RGBA(255,205,57,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(255,205,57,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(255,205,57,var(--bs-link-underline-opacity,1))!important}.link-danger{color:RGBA(var(--bs-danger-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(var(--bs-danger-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(var(--bs-danger-rgb),var(--bs-link-underline-opacity,1))!important}.link-danger:focus,.link-danger:hover{color:RGBA(176,42,55,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(176,42,55,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(176,42,55,var(--bs-link-underline-opacity,1))!important}.link-light{color:RGBA(var(--bs-light-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(var(--bs-light-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(var(--bs-light-rgb),var(--bs-link-underline-opacity,1))!important}.link-light:focus,.link-light:hover{color:RGBA(249,250,251,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(249,250,251,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(249,250,251,var(--bs-link-underline-opacity,1))!important}.link-dark{color:RGBA(var(--bs-dark-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(var(--bs-dark-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(var(--bs-dark-rgb),var(--bs-link-underline-opacity,1))!important}.link-dark:focus,.link-dark:hover{color:RGBA(26,30,33,var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(26,30,33,var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(26,30,33,var(--bs-link-underline-opacity,1))!important}.link-body-emphasis{color:RGBA(var(--bs-emphasis-color-rgb),var(--bs-link-opacity,1))!important;-webkit-text-decoration-color:RGBA(var(--bs-emphasis-color-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:RGBA(var(--bs-emphasis-color-rgb),var(--bs-link-underline-opacity,1))!important}.link-body-emphasis:focus,.link-body-emphasis:hover{color:RGBA(var(--bs-emphasis-color-rgb),var(--bs-link-opacity,.75))!important;-webkit-text-decoration-color:RGBA(var(--bs-emphasis-color-rgb),var(--bs-link-underline-opacity,0.75))!important;text-decoration-color:RGBA(var(--bs-emphasis-color-rgb),var(--bs-link-underline-opacity,0.75))!important}.focus-ring:focus{outline:0;box-shadow:var(--bs-focus-ring-x,0) var(--bs-focus-ring-y,0) var(--bs-focus-ring-blur,0) var(--bs-focus-ring-width) var(--bs-focus-ring-color)}.icon-link{display:inline-flex;gap:.375rem;align-items:center;-webkit-text-decoration-color:rgba(var(--bs-link-color-rgb),var(--bs-link-opacity,0.5));text-decoration-color:rgba(var(--bs-link-color-rgb),var(--bs-link-opacity,0.5));text-underline-offset:0.25em;-webkit-backface-visibility:hidden;backface-visibility:hidden}.icon-link>.bi{flex-shrink:0;width:1em;height:1em;fill:currentcolor;transition:.2s ease-in-out transform}@media (prefers-reduced-motion:reduce){.icon-link>.bi{transition:none}}.icon-link-hover:focus-visible>.bi,.icon-link-hover:hover>.bi{transform:var(--bs-icon-link-transform,translate3d(.25em,0,0))}.ratio{position:relative;width:100%}.ratio::before{display:block;padding-top:var(--bs-aspect-ratio);content:""}.ratio>*{position:absolute;top:0;left:0;width:100%;height:100%}.ratio-1x1{--bs-aspect-ratio:100%}.ratio-4x3{--bs-aspect-ratio:75%}.ratio-16x9{--bs-aspect-ratio:56.25%}.ratio-21x9{--bs-aspect-ratio:42.8571428571%}.fixed-top{position:fixed;top:0;right:0;left:0;z-index:1030}.fixed-bottom{position:fixed;right:0;bottom:0;left:0;z-index:1030}.sticky-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}.sticky-bottom{position:-webkit-sticky;position:sticky;bottom:0;z-index:1020}@media (min-width:576px){.sticky-sm-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}.sticky-sm-bottom{position:-webkit-sticky;position:sticky;bottom:0;z-index:1020}}@media (min-width:768px){.sticky-md-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}.sticky-md-bottom{position:-webkit-sticky;position:sticky;bottom:0;z-index:1020}}@media (min-width:992px){.sticky-lg-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}.sticky-lg-bottom{position:-webkit-sticky;position:sticky;bottom:0;z-index:1020}}@media (min-width:1200px){.sticky-xl-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}.sticky-xl-bottom{position:-webkit-sticky;position:sticky;bottom:0;z-index:1020}}@media (min-width:1400px){.sticky-xxl-top{position:-webkit-sticky;position:sticky;top:0;z-index:1020}.sticky-xxl-bottom{position:-webkit-sticky;position:sticky;bottom:0;z-index:1020}}.hstack{display:flex;flex-direction:row;align-items:center;align-self:stretch}.vstack{display:flex;flex:1 1 auto;flex-direction:column;align-self:stretch}.visually-hidden,.visually-hidden-focusable:not(:focus):not(:focus-within){width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.visually-hidden-focusable:not(:focus):not(:focus-within):not(caption),.visually-hidden:not(caption){position:absolute!important}.stretched-link::after{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;content:""}.text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vr{display:inline-block;align-self:stretch;width:var(--bs-border-width);min-height:1em;background-color:currentcolor;opacity:.25}.align-baseline{vertical-align:baseline!important}.align-top{vertical-align:top!important}.align-middle{vertical-align:middle!important}.align-bottom{vertical-align:bottom!important}.align-text-bottom{vertical-align:text-bottom!important}.align-text-top{vertical-align:text-top!important}.float-start{float:left!important}.float-end{float:right!important}.float-none{float:none!important}.object-fit-contain{-o-object-fit:contain!important;object-fit:contain!important}.object-fit-cover{-o-object-fit:cover!important;object-fit:cover!important}.object-fit-fill{-o-object-fit:fill!important;object-fit:fill!important}.object-fit-scale{-o-object-fit:scale-down!important;object-fit:scale-down!important}.object-fit-none{-o-object-fit:none!important;object-fit:none!important}.opacity-0{opacity:0!important}.opacity-25{opacity:.25!important}.opacity-50{opacity:.5!important}.opacity-75{opacity:.75!important}.opacity-100{opacity:1!important}.overflow-auto{overflow:auto!important}.overflow-hidden{overflow:hidden!important}.overflow-visible{overflow:visible!important}.overflow-scroll{overflow:scroll!important}.overflow-x-auto{overflow-x:auto!important}.overflow-x-hidden{overflow-x:hidden!important}.overflow-x-visible{overflow-x:visible!important}.overflow-x-scroll{overflow-x:scroll!important}.overflow-y-auto{overflow-y:auto!important}.overflow-y-hidden{overflow-y:hidden!important}.overflow-y-visible{overflow-y:visible!important}.overflow-y-scroll{overflow-y:scroll!important}.d-inline{display:inline!important}.d-inline-block{display:inline-block!important}.d-block{display:block!important}.d-grid{display:grid!important}.d-inline-grid{display:inline-grid!important}.d-table{display:table!important}.d-table-row{display:table-row!important}.d-table-cell{display:table-cell!important}.d-flex{display:flex!important}.d-inline-flex{display:inline-flex!important}.d-none{display:none!important}.shadow{box-shadow:var(--bs-box-shadow)!important}.shadow-sm{box-shadow:var(--bs-box-shadow-sm)!important}.shadow-lg{box-shadow:var(--bs-box-shadow-lg)!important}.shadow-none{box-shadow:none!important}.focus-ring-primary{--bs-focus-ring-color:rgba(var(--bs-primary-rgb), var(--bs-focus-ring-opacity))}.focus-ring-secondary{--bs-focus-ring-color:rgba(var(--bs-secondary-rgb), var(--bs-focus-ring-opacity))}.focus-ring-success{--bs-focus-ring-color:rgba(var(--bs-success-rgb), var(--bs-focus-ring-opacity))}.focus-ring-info{--bs-focus-ring-color:rgba(var(--bs-info-rgb), var(--bs-focus-ring-opacity))}.focus-ring-warning{--bs-focus-ring-color:rgba(var(--bs-warning-rgb), var(--bs-focus-ring-opacity))}.focus-ring-danger{--bs-focus-ring-color:rgba(var(--bs-danger-rgb), var(--bs-focus-ring-opacity))}.focus-ring-light{--bs-focus-ring-color:rgba(var(--bs-light-rgb), var(--bs-focus-ring-opacity))}.focus-ring-dark{--bs-focus-ring-color:rgba(var(--bs-dark-rgb), var(--bs-focus-ring-opacity))}.position-static{position:static!important}.position-relative{position:relative!important}.position-absolute{position:absolute!important}.position-fixed{position:fixed!important}.position-sticky{position:-webkit-sticky!important;position:sticky!important}.top-0{top:0!important}.top-50{top:50%!important}.top-100{top:100%!important}.bottom-0{bottom:0!important}.bottom-50{bottom:50%!important}.bottom-100{bottom:100%!important}.start-0{left:0!important}.start-50{left:50%!important}.start-100{left:100%!important}.end-0{right:0!important}.end-50{right:50%!important}.end-100{right:100%!important}.translate-middle{transform:translate(-50%,-50%)!important}.translate-middle-x{transform:translateX(-50%)!important}.translate-middle-y{transform:translateY(-50%)!important}.border{border:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important}.border-0{border:0!important}.border-top{border-top:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important}.border-top-0{border-top:0!important}.border-end{border-right:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important}.border-end-0{border-right:0!important}.border-bottom{border-bottom:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important}.border-bottom-0{border-bottom:0!important}.border-start{border-left:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important}.border-start-0{border-left:0!important}.border-primary{--bs-border-opacity:1;border-color:rgba(var(--bs-primary-rgb),var(--bs-border-opacity))!important}.border-secondary{--bs-border-opacity:1;border-color:rgba(var(--bs-secondary-rgb),var(--bs-border-opacity))!important}.border-success{--bs-border-opacity:1;border-color:rgba(var(--bs-success-rgb),var(--bs-border-opacity))!important}.border-info{--bs-border-opacity:1;border-color:rgba(var(--bs-info-rgb),var(--bs-border-opacity))!important}.border-warning{--bs-border-opacity:1;border-color:rgba(var(--bs-warning-rgb),var(--bs-border-opacity))!important}.border-danger{--bs-border-opacity:1;border-color:rgba(var(--bs-danger-rgb),var(--bs-border-opacity))!important}.border-light{--bs-border-opacity:1;border-color:rgba(var(--bs-light-rgb),var(--bs-border-opacity))!important}.border-dark{--bs-border-opacity:1;border-color:rgba(var(--bs-dark-rgb),var(--bs-border-opacity))!important}.border-black{--bs-border-opacity:1;border-color:rgba(var(--bs-black-rgb),var(--bs-border-opacity))!important}.border-white{--bs-border-opacity:1;border-color:rgba(var(--bs-white-rgb),var(--bs-border-opacity))!important}.border-primary-subtle{border-color:var(--bs-primary-border-subtle)!important}.border-secondary-subtle{border-color:var(--bs-secondary-border-subtle)!important}.border-success-subtle{border-color:var(--bs-success-border-subtle)!important}.border-info-subtle{border-color:var(--bs-info-border-subtle)!important}.border-warning-subtle{border-color:var(--bs-warning-border-subtle)!important}.border-danger-subtle{border-color:var(--bs-danger-border-subtle)!important}.border-light-subtle{border-color:var(--bs-light-border-subtle)!important}.border-dark-subtle{border-color:var(--bs-dark-border-subtle)!important}.border-1{border-width:1px!important}.border-2{border-width:2px!important}.border-3{border-width:3px!important}.border-4{border-width:4px!important}.border-5{border-width:5px!important}.border-opacity-10{--bs-border-opacity:0.1}.border-opacity-25{--bs-border-opacity:0.25}.border-opacity-50{--bs-border-opacity:0.5}.border-opacity-75{--bs-border-opacity:0.75}.border-opacity-100{--bs-border-opacity:1}.w-25{width:25%!important}.w-50{width:50%!important}.w-75{width:75%!important}.w-100{width:100%!important}.w-auto{width:auto!important}.mw-100{max-width:100%!important}.vw-100{width:100vw!important}.min-vw-100{min-width:100vw!important}.h-25{height:25%!important}.h-50{height:50%!important}.h-75{height:75%!important}.h-100{height:100%!important}.h-auto{height:auto!important}.mh-100{max-height:100%!important}.vh-100{height:100vh!important}.min-vh-100{min-height:100vh!important}.flex-fill{flex:1 1 auto!important}.flex-row{flex-direction:row!important}.flex-column{flex-direction:column!important}.flex-row-reverse{flex-direction:row-reverse!important}.flex-column-reverse{flex-direction:column-reverse!important}.flex-grow-0{flex-grow:0!important}.flex-grow-1{flex-grow:1!important}.flex-shrink-0{flex-shrink:0!important}.flex-shrink-1{flex-shrink:1!important}.flex-wrap{flex-wrap:wrap!important}.flex-nowrap{flex-wrap:nowrap!important}.flex-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-start{justify-content:flex-start!important}.justify-content-end{justify-content:flex-end!important}.justify-content-center{justify-content:center!important}.justify-content-between{justify-content:space-between!important}.justify-content-around{justify-content:space-around!important}.justify-content-evenly{justify-content:space-evenly!important}.align-items-start{align-items:flex-start!important}.align-items-end{align-items:flex-end!important}.align-items-center{align-items:center!important}.align-items-baseline{align-items:baseline!important}.align-items-stretch{align-items:stretch!important}.align-content-start{align-content:flex-start!important}.align-content-end{align-content:flex-end!important}.align-content-center{align-content:center!important}.align-content-between{align-content:space-between!important}.align-content-around{align-content:space-around!important}.align-content-stretch{align-content:stretch!important}.align-self-auto{align-self:auto!important}.align-self-start{align-self:flex-start!important}.align-self-end{align-self:flex-end!important}.align-self-center{align-self:center!important}.align-self-baseline{align-self:baseline!important}.align-self-stretch{align-self:stretch!important}.order-first{order:-1!important}.order-0{order:0!important}.order-1{order:1!important}.order-2{order:2!important}.order-3{order:3!important}.order-4{order:4!important}.order-5{order:5!important}.order-last{order:6!important}.m-0{margin:0!important}.m-1{margin:.25rem!important}.m-2{margin:.5rem!important}.m-3{margin:1rem!important}.m-4{margin:1.5rem!important}.m-5{margin:3rem!important}.m-auto{margin:auto!important}.mx-0{margin-right:0!important;margin-left:0!important}.mx-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-3{margin-right:1rem!important;margin-left:1rem!important}.mx-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-5{margin-right:3rem!important;margin-left:3rem!important}.mx-auto{margin-right:auto!important;margin-left:auto!important}.my-0{margin-top:0!important;margin-bottom:0!important}.my-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-0{margin-top:0!important}.mt-1{margin-top:.25rem!important}.mt-2{margin-top:.5rem!important}.mt-3{margin-top:1rem!important}.mt-4{margin-top:1.5rem!important}.mt-5{margin-top:3rem!important}.mt-auto{margin-top:auto!important}.me-0{margin-right:0!important}.me-1{margin-right:.25rem!important}.me-2{margin-right:.5rem!important}.me-3{margin-right:1rem!important}.me-4{margin-right:1.5rem!important}.me-5{margin-right:3rem!important}.me-auto{margin-right:auto!important}.mb-0{margin-bottom:0!important}.mb-1{margin-bottom:.25rem!important}.mb-2{margin-bottom:.5rem!important}.mb-3{margin-bottom:1rem!important}.mb-4{margin-bottom:1.5rem!important}.mb-5{margin-bottom:3rem!important}.mb-auto{margin-bottom:auto!important}.ms-0{margin-left:0!important}.ms-1{margin-left:.25rem!important}.ms-2{margin-left:.5rem!important}.ms-3{margin-left:1rem!important}.ms-4{margin-left:1.5rem!important}.ms-5{margin-left:3rem!important}.ms-auto{margin-left:auto!important}.p-0{padding:0!important}.p-1{padding:.25rem!important}.p-2{padding:.5rem!important}.p-3{padding:1rem!important}.p-4{padding:1.5rem!important}.p-5{padding:3rem!important}.px-0{padding-right:0!important;padding-left:0!important}.px-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-3{padding-right:1rem!important;padding-left:1rem!important}.px-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-5{padding-right:3rem!important;padding-left:3rem!important}.py-0{padding-top:0!important;padding-bottom:0!important}.py-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-0{padding-top:0!important}.pt-1{padding-top:.25rem!important}.pt-2{padding-top:.5rem!important}.pt-3{padding-top:1rem!important}.pt-4{padding-top:1.5rem!important}.pt-5{padding-top:3rem!important}.pe-0{padding-right:0!important}.pe-1{padding-right:.25rem!important}.pe-2{padding-right:.5rem!important}.pe-3{padding-right:1rem!important}.pe-4{padding-right:1.5rem!important}.pe-5{padding-right:3rem!important}.pb-0{padding-bottom:0!important}.pb-1{padding-bottom:.25rem!important}.pb-2{padding-bottom:.5rem!important}.pb-3{padding-bottom:1rem!important}.pb-4{padding-bottom:1.5rem!important}.pb-5{padding-bottom:3rem!important}.ps-0{padding-left:0!important}.ps-1{padding-left:.25rem!important}.ps-2{padding-left:.5rem!important}.ps-3{padding-left:1rem!important}.ps-4{padding-left:1.5rem!important}.ps-5{padding-left:3rem!important}.gap-0{gap:0!important}.gap-1{gap:.25rem!important}.gap-2{gap:.5rem!important}.gap-3{gap:1rem!important}.gap-4{gap:1.5rem!important}.gap-5{gap:3rem!important}.row-gap-0{row-gap:0!important}.row-gap-1{row-gap:.25rem!important}.row-gap-2{row-gap:.5rem!important}.row-gap-3{row-gap:1rem!important}.row-gap-4{row-gap:1.5rem!important}.row-gap-5{row-gap:3rem!important}.column-gap-0{-moz-column-gap:0!important;column-gap:0!important}.column-gap-1{-moz-column-gap:0.25rem!important;column-gap:.25rem!important}.column-gap-2{-moz-column-gap:0.5rem!important;column-gap:.5rem!important}.column-gap-3{-moz-column-gap:1rem!important;column-gap:1rem!important}.column-gap-4{-moz-column-gap:1.5rem!important;column-gap:1.5rem!important}.column-gap-5{-moz-column-gap:3rem!important;column-gap:3rem!important}.font-monospace{font-family:var(--bs-font-monospace)!important}.fs-1{font-size:calc(1.375rem + 1.5vw)!important}.fs-2{font-size:calc(1.325rem + .9vw)!important}.fs-3{font-size:calc(1.3rem + .6vw)!important}.fs-4{font-size:calc(1.275rem + .3vw)!important}.fs-5{font-size:1.25rem!important}.fs-6{font-size:1rem!important}.fst-italic{font-style:italic!important}.fst-normal{font-style:normal!important}.fw-lighter{font-weight:lighter!important}.fw-light{font-weight:300!important}.fw-normal{font-weight:400!important}.fw-medium{font-weight:500!important}.fw-semibold{font-weight:600!important}.fw-bold{font-weight:700!important}.fw-bolder{font-weight:bolder!important}.lh-1{line-height:1!important}.lh-sm{line-height:1.25!important}.lh-base{line-height:1.5!important}.lh-lg{line-height:2!important}.text-start{text-align:left!important}.text-end{text-align:right!important}.text-center{text-align:center!important}.text-decoration-none{text-decoration:none!important}.text-decoration-underline{text-decoration:underline!important}.text-decoration-line-through{text-decoration:line-through!important}.text-lowercase{text-transform:lowercase!important}.text-uppercase{text-transform:uppercase!important}.text-capitalize{text-transform:capitalize!important}.text-wrap{white-space:normal!important}.text-nowrap{white-space:nowrap!important}.text-break{word-wrap:break-word!important;word-break:break-word!important}.text-primary{--bs-text-opacity:1;color:rgba(var(--bs-primary-rgb),var(--bs-text-opacity))!important}.text-secondary{--bs-text-opacity:1;color:rgba(var(--bs-secondary-rgb),var(--bs-text-opacity))!important}.text-success{--bs-text-opacity:1;color:rgba(var(--bs-success-rgb),var(--bs-text-opacity))!important}.text-info{--bs-text-opacity:1;color:rgba(var(--bs-info-rgb),var(--bs-text-opacity))!important}.text-warning{--bs-text-opacity:1;color:rgba(var(--bs-warning-rgb),var(--bs-text-opacity))!important}.text-danger{--bs-text-opacity:1;color:rgba(var(--bs-danger-rgb),var(--bs-text-opacity))!important}.text-light{--bs-text-opacity:1;color:rgba(var(--bs-light-rgb),var(--bs-text-opacity))!important}.text-dark{--bs-text-opacity:1;color:rgba(var(--bs-dark-rgb),var(--bs-text-opacity))!important}.text-black{--bs-text-opacity:1;color:rgba(var(--bs-black-rgb),var(--bs-text-opacity))!important}.text-white{--bs-text-opacity:1;color:rgba(var(--bs-white-rgb),var(--bs-text-opacity))!important}.text-body{--bs-text-opacity:1;color:rgba(var(--bs-body-color-rgb),var(--bs-text-opacity))!important}.text-muted{--bs-text-opacity:1;color:var(--bs-secondary-color)!important}.text-black-50{--bs-text-opacity:1;color:rgba(0,0,0,.5)!important}.text-white-50{--bs-text-opacity:1;color:rgba(255,255,255,.5)!important}.text-body-secondary{--bs-text-opacity:1;color:var(--bs-secondary-color)!important}.text-body-tertiary{--bs-text-opacity:1;color:var(--bs-tertiary-color)!important}.text-body-emphasis{--bs-text-opacity:1;color:var(--bs-emphasis-color)!important}.text-reset{--bs-text-opacity:1;color:inherit!important}.text-opacity-25{--bs-text-opacity:0.25}.text-opacity-50{--bs-text-opacity:0.5}.text-opacity-75{--bs-text-opacity:0.75}.text-opacity-100{--bs-text-opacity:1}.text-primary-emphasis{color:var(--bs-primary-text-emphasis)!important}.text-secondary-emphasis{color:var(--bs-secondary-text-emphasis)!important}.text-success-emphasis{color:var(--bs-success-text-emphasis)!important}.text-info-emphasis{color:var(--bs-info-text-emphasis)!important}.text-warning-emphasis{color:var(--bs-warning-text-emphasis)!important}.text-danger-emphasis{color:var(--bs-danger-text-emphasis)!important}.text-light-emphasis{color:var(--bs-light-text-emphasis)!important}.text-dark-emphasis{color:var(--bs-dark-text-emphasis)!important}.link-opacity-10{--bs-link-opacity:0.1}.link-opacity-10-hover:hover{--bs-link-opacity:0.1}.link-opacity-25{--bs-link-opacity:0.25}.link-opacity-25-hover:hover{--bs-link-opacity:0.25}.link-opacity-50{--bs-link-opacity:0.5}.link-opacity-50-hover:hover{--bs-link-opacity:0.5}.link-opacity-75{--bs-link-opacity:0.75}.link-opacity-75-hover:hover{--bs-link-opacity:0.75}.link-opacity-100{--bs-link-opacity:1}.link-opacity-100-hover:hover{--bs-link-opacity:1}.link-offset-1{text-underline-offset:0.125em!important}.link-offset-1-hover:hover{text-underline-offset:0.125em!important}.link-offset-2{text-underline-offset:0.25em!important}.link-offset-2-hover:hover{text-underline-offset:0.25em!important}.link-offset-3{text-underline-offset:0.375em!important}.link-offset-3-hover:hover{text-underline-offset:0.375em!important}.link-underline-primary{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(var(--bs-primary-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-primary-rgb),var(--bs-link-underline-opacity))!important}.link-underline-secondary{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(var(--bs-secondary-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-secondary-rgb),var(--bs-link-underline-opacity))!important}.link-underline-success{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(var(--bs-success-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-success-rgb),var(--bs-link-underline-opacity))!important}.link-underline-info{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(var(--bs-info-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-info-rgb),var(--bs-link-underline-opacity))!important}.link-underline-warning{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(var(--bs-warning-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-warning-rgb),var(--bs-link-underline-opacity))!important}.link-underline-danger{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(var(--bs-danger-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-danger-rgb),var(--bs-link-underline-opacity))!important}.link-underline-light{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(var(--bs-light-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-light-rgb),var(--bs-link-underline-opacity))!important}.link-underline-dark{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(var(--bs-dark-rgb),var(--bs-link-underline-opacity))!important;text-decoration-color:rgba(var(--bs-dark-rgb),var(--bs-link-underline-opacity))!important}.link-underline{--bs-link-underline-opacity:1;-webkit-text-decoration-color:rgba(var(--bs-link-color-rgb),var(--bs-link-underline-opacity,1))!important;text-decoration-color:rgba(var(--bs-link-color-rgb),var(--bs-link-underline-opacity,1))!important}.link-underline-opacity-0{--bs-link-underline-opacity:0}.link-underline-opacity-0-hover:hover{--bs-link-underline-opacity:0}.link-underline-opacity-10{--bs-link-underline-opacity:0.1}.link-underline-opacity-10-hover:hover{--bs-link-underline-opacity:0.1}.link-underline-opacity-25{--bs-link-underline-opacity:0.25}.link-underline-opacity-25-hover:hover{--bs-link-underline-opacity:0.25}.link-underline-opacity-50{--bs-link-underline-opacity:0.5}.link-underline-opacity-50-hover:hover{--bs-link-underline-opacity:0.5}.link-underline-opacity-75{--bs-link-underline-opacity:0.75}.link-underline-opacity-75-hover:hover{--bs-link-underline-opacity:0.75}.link-underline-opacity-100{--bs-link-underline-opacity:1}.link-underline-opacity-100-hover:hover{--bs-link-underline-opacity:1}.bg-primary{--bs-bg-opacity:1;background-color:rgba(var(--bs-primary-rgb),var(--bs-bg-opacity))!important}.bg-secondary{--bs-bg-opacity:1;background-color:rgba(var(--bs-secondary-rgb),var(--bs-bg-opacity))!important}.bg-success{--bs-bg-opacity:1;background-color:rgba(var(--bs-success-rgb),var(--bs-bg-opacity))!important}.bg-info{--bs-bg-opacity:1;background-color:rgba(var(--bs-info-rgb),var(--bs-bg-opacity))!important}.bg-warning{--bs-bg-opacity:1;background-color:rgba(var(--bs-warning-rgb),var(--bs-bg-opacity))!important}.bg-danger{--bs-bg-opacity:1;background-color:rgba(var(--bs-danger-rgb),var(--bs-bg-opacity))!important}.bg-light{--bs-bg-opacity:1;background-color:rgba(var(--bs-light-rgb),var(--bs-bg-opacity))!important}.bg-dark{--bs-bg-opacity:1;background-color:rgba(var(--bs-dark-rgb),var(--bs-bg-opacity))!important}.bg-black{--bs-bg-opacity:1;background-color:rgba(var(--bs-black-rgb),var(--bs-bg-opacity))!important}.bg-white{--bs-bg-opacity:1;background-color:rgba(var(--bs-white-rgb),var(--bs-bg-opacity))!important}.bg-body{--bs-bg-opacity:1;background-color:rgba(var(--bs-body-bg-rgb),var(--bs-bg-opacity))!important}.bg-transparent{--bs-bg-opacity:1;background-color:transparent!important}.bg-body-secondary{--bs-bg-opacity:1;background-color:rgba(var(--bs-secondary-bg-rgb),var(--bs-bg-opacity))!important}.bg-body-tertiary{--bs-bg-opacity:1;background-color:rgba(var(--bs-tertiary-bg-rgb),var(--bs-bg-opacity))!important}.bg-opacity-10{--bs-bg-opacity:0.1}.bg-opacity-25{--bs-bg-opacity:0.25}.bg-opacity-50{--bs-bg-opacity:0.5}.bg-opacity-75{--bs-bg-opacity:0.75}.bg-opacity-100{--bs-bg-opacity:1}.bg-primary-subtle{background-color:var(--bs-primary-bg-subtle)!important}.bg-secondary-subtle{background-color:var(--bs-secondary-bg-subtle)!important}.bg-success-subtle{background-color:var(--bs-success-bg-subtle)!important}.bg-info-subtle{background-color:var(--bs-info-bg-subtle)!important}.bg-warning-subtle{background-color:var(--bs-warning-bg-subtle)!important}.bg-danger-subtle{background-color:var(--bs-danger-bg-subtle)!important}.bg-light-subtle{background-color:var(--bs-light-bg-subtle)!important}.bg-dark-subtle{background-color:var(--bs-dark-bg-subtle)!important}.bg-gradient{background-image:var(--bs-gradient)!important}.user-select-all{-webkit-user-select:all!important;-moz-user-select:all!important;user-select:all!important}.user-select-auto{-webkit-user-select:auto!important;-moz-user-select:auto!important;user-select:auto!important}.user-select-none{-webkit-user-select:none!important;-moz-user-select:none!important;user-select:none!important}.pe-none{pointer-events:none!important}.pe-auto{pointer-events:auto!important}.rounded{border-radius:var(--bs-border-radius)!important}.rounded-0{border-radius:0!important}.rounded-1{border-radius:var(--bs-border-radius-sm)!important}.rounded-2{border-radius:var(--bs-border-radius)!important}.rounded-3{border-radius:var(--bs-border-radius-lg)!important}.rounded-4{border-radius:var(--bs-border-radius-xl)!important}.rounded-5{border-radius:var(--bs-border-radius-xxl)!important}.rounded-circle{border-radius:50%!important}.rounded-pill{border-radius:var(--bs-border-radius-pill)!important}.rounded-top{border-top-left-radius:var(--bs-border-radius)!important;border-top-right-radius:var(--bs-border-radius)!important}.rounded-top-0{border-top-left-radius:0!important;border-top-right-radius:0!important}.rounded-top-1{border-top-left-radius:var(--bs-border-radius-sm)!important;border-top-right-radius:var(--bs-border-radius-sm)!important}.rounded-top-2{border-top-left-radius:var(--bs-border-radius)!important;border-top-right-radius:var(--bs-border-radius)!important}.rounded-top-3{border-top-left-radius:var(--bs-border-radius-lg)!important;border-top-right-radius:var(--bs-border-radius-lg)!important}.rounded-top-4{border-top-left-radius:var(--bs-border-radius-xl)!important;border-top-right-radius:var(--bs-border-radius-xl)!important}.rounded-top-5{border-top-left-radius:var(--bs-border-radius-xxl)!important;border-top-right-radius:var(--bs-border-radius-xxl)!important}.rounded-top-circle{border-top-left-radius:50%!important;border-top-right-radius:50%!important}.rounded-top-pill{border-top-left-radius:var(--bs-border-radius-pill)!important;border-top-right-radius:var(--bs-border-radius-pill)!important}.rounded-end{border-top-right-radius:var(--bs-border-radius)!important;border-bottom-right-radius:var(--bs-border-radius)!important}.rounded-end-0{border-top-right-radius:0!important;border-bottom-right-radius:0!important}.rounded-end-1{border-top-right-radius:var(--bs-border-radius-sm)!important;border-bottom-right-radius:var(--bs-border-radius-sm)!important}.rounded-end-2{border-top-right-radius:var(--bs-border-radius)!important;border-bottom-right-radius:var(--bs-border-radius)!important}.rounded-end-3{border-top-right-radius:var(--bs-border-radius-lg)!important;border-bottom-right-radius:var(--bs-border-radius-lg)!important}.rounded-end-4{border-top-right-radius:var(--bs-border-radius-xl)!important;border-bottom-right-radius:var(--bs-border-radius-xl)!important}.rounded-end-5{border-top-right-radius:var(--bs-border-radius-xxl)!important;border-bottom-right-radius:var(--bs-border-radius-xxl)!important}.rounded-end-circle{border-top-right-radius:50%!important;border-bottom-right-radius:50%!important}.rounded-end-pill{border-top-right-radius:var(--bs-border-radius-pill)!important;border-bottom-right-radius:var(--bs-border-radius-pill)!important}.rounded-bottom{border-bottom-right-radius:var(--bs-border-radius)!important;border-bottom-left-radius:var(--bs-border-radius)!important}.rounded-bottom-0{border-bottom-right-radius:0!important;border-bottom-left-radius:0!important}.rounded-bottom-1{border-bottom-right-radius:var(--bs-border-radius-sm)!important;border-bottom-left-radius:var(--bs-border-radius-sm)!important}.rounded-bottom-2{border-bottom-right-radius:var(--bs-border-radius)!important;border-bottom-left-radius:var(--bs-border-radius)!important}.rounded-bottom-3{border-bottom-right-radius:var(--bs-border-radius-lg)!important;border-bottom-left-radius:var(--bs-border-radius-lg)!important}.rounded-bottom-4{border-bottom-right-radius:var(--bs-border-radius-xl)!important;border-bottom-left-radius:var(--bs-border-radius-xl)!important}.rounded-bottom-5{border-bottom-right-radius:var(--bs-border-radius-xxl)!important;border-bottom-left-radius:var(--bs-border-radius-xxl)!important}.rounded-bottom-circle{border-bottom-right-radius:50%!important;border-bottom-left-radius:50%!important}.rounded-bottom-pill{border-bottom-right-radius:var(--bs-border-radius-pill)!important;border-bottom-left-radius:var(--bs-border-radius-pill)!important}.rounded-start{border-bottom-left-radius:var(--bs-border-radius)!important;border-top-left-radius:var(--bs-border-radius)!important}.rounded-start-0{border-bottom-left-radius:0!important;border-top-left-radius:0!important}.rounded-start-1{border-bottom-left-radius:var(--bs-border-radius-sm)!important;border-top-left-radius:var(--bs-border-radius-sm)!important}.rounded-start-2{border-bottom-left-radius:var(--bs-border-radius)!important;border-top-left-radius:var(--bs-border-radius)!important}.rounded-start-3{border-bottom-left-radius:var(--bs-border-radius-lg)!important;border-top-left-radius:var(--bs-border-radius-lg)!important}.rounded-start-4{border-bottom-left-radius:var(--bs-border-radius-xl)!important;border-top-left-radius:var(--bs-border-radius-xl)!important}.rounded-start-5{border-bottom-left-radius:var(--bs-border-radius-xxl)!important;border-top-left-radius:var(--bs-border-radius-xxl)!important}.rounded-start-circle{border-bottom-left-radius:50%!important;border-top-left-radius:50%!important}.rounded-start-pill{border-bottom-left-radius:var(--bs-border-radius-pill)!important;border-top-left-radius:var(--bs-border-radius-pill)!important}.visible{visibility:visible!important}.invisible{visibility:hidden!important}.z-n1{z-index:-1!important}.z-0{z-index:0!important}.z-1{z-index:1!important}.z-2{z-index:2!important}.z-3{z-index:3!important}@media (min-width:576px){.float-sm-start{float:left!important}.float-sm-end{float:right!important}.float-sm-none{float:none!important}.object-fit-sm-contain{-o-object-fit:contain!important;object-fit:contain!important}.object-fit-sm-cover{-o-object-fit:cover!important;object-fit:cover!important}.object-fit-sm-fill{-o-object-fit:fill!important;object-fit:fill!important}.object-fit-sm-scale{-o-object-fit:scale-down!important;object-fit:scale-down!important}.object-fit-sm-none{-o-object-fit:none!important;object-fit:none!important}.d-sm-inline{display:inline!important}.d-sm-inline-block{display:inline-block!important}.d-sm-block{display:block!important}.d-sm-grid{display:grid!important}.d-sm-inline-grid{display:inline-grid!important}.d-sm-table{display:table!important}.d-sm-table-row{display:table-row!important}.d-sm-table-cell{display:table-cell!important}.d-sm-flex{display:flex!important}.d-sm-inline-flex{display:inline-flex!important}.d-sm-none{display:none!important}.flex-sm-fill{flex:1 1 auto!important}.flex-sm-row{flex-direction:row!important}.flex-sm-column{flex-direction:column!important}.flex-sm-row-reverse{flex-direction:row-reverse!important}.flex-sm-column-reverse{flex-direction:column-reverse!important}.flex-sm-grow-0{flex-grow:0!important}.flex-sm-grow-1{flex-grow:1!important}.flex-sm-shrink-0{flex-shrink:0!important}.flex-sm-shrink-1{flex-shrink:1!important}.flex-sm-wrap{flex-wrap:wrap!important}.flex-sm-nowrap{flex-wrap:nowrap!important}.flex-sm-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-sm-start{justify-content:flex-start!important}.justify-content-sm-end{justify-content:flex-end!important}.justify-content-sm-center{justify-content:center!important}.justify-content-sm-between{justify-content:space-between!important}.justify-content-sm-around{justify-content:space-around!important}.justify-content-sm-evenly{justify-content:space-evenly!important}.align-items-sm-start{align-items:flex-start!important}.align-items-sm-end{align-items:flex-end!important}.align-items-sm-center{align-items:center!important}.align-items-sm-baseline{align-items:baseline!important}.align-items-sm-stretch{align-items:stretch!important}.align-content-sm-start{align-content:flex-start!important}.align-content-sm-end{align-content:flex-end!important}.align-content-sm-center{align-content:center!important}.align-content-sm-between{align-content:space-between!important}.align-content-sm-around{align-content:space-around!important}.align-content-sm-stretch{align-content:stretch!important}.align-self-sm-auto{align-self:auto!important}.align-self-sm-start{align-self:flex-start!important}.align-self-sm-end{align-self:flex-end!important}.align-self-sm-center{align-self:center!important}.align-self-sm-baseline{align-self:baseline!important}.align-self-sm-stretch{align-self:stretch!important}.order-sm-first{order:-1!important}.order-sm-0{order:0!important}.order-sm-1{order:1!important}.order-sm-2{order:2!important}.order-sm-3{order:3!important}.order-sm-4{order:4!important}.order-sm-5{order:5!important}.order-sm-last{order:6!important}.m-sm-0{margin:0!important}.m-sm-1{margin:.25rem!important}.m-sm-2{margin:.5rem!important}.m-sm-3{margin:1rem!important}.m-sm-4{margin:1.5rem!important}.m-sm-5{margin:3rem!important}.m-sm-auto{margin:auto!important}.mx-sm-0{margin-right:0!important;margin-left:0!important}.mx-sm-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-sm-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-sm-3{margin-right:1rem!important;margin-left:1rem!important}.mx-sm-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-sm-5{margin-right:3rem!important;margin-left:3rem!important}.mx-sm-auto{margin-right:auto!important;margin-left:auto!important}.my-sm-0{margin-top:0!important;margin-bottom:0!important}.my-sm-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-sm-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-sm-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-sm-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-sm-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-sm-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-sm-0{margin-top:0!important}.mt-sm-1{margin-top:.25rem!important}.mt-sm-2{margin-top:.5rem!important}.mt-sm-3{margin-top:1rem!important}.mt-sm-4{margin-top:1.5rem!important}.mt-sm-5{margin-top:3rem!important}.mt-sm-auto{margin-top:auto!important}.me-sm-0{margin-right:0!important}.me-sm-1{margin-right:.25rem!important}.me-sm-2{margin-right:.5rem!important}.me-sm-3{margin-right:1rem!important}.me-sm-4{margin-right:1.5rem!important}.me-sm-5{margin-right:3rem!important}.me-sm-auto{margin-right:auto!important}.mb-sm-0{margin-bottom:0!important}.mb-sm-1{margin-bottom:.25rem!important}.mb-sm-2{margin-bottom:.5rem!important}.mb-sm-3{margin-bottom:1rem!important}.mb-sm-4{margin-bottom:1.5rem!important}.mb-sm-5{margin-bottom:3rem!important}.mb-sm-auto{margin-bottom:auto!important}.ms-sm-0{margin-left:0!important}.ms-sm-1{margin-left:.25rem!important}.ms-sm-2{margin-left:.5rem!important}.ms-sm-3{margin-left:1rem!important}.ms-sm-4{margin-left:1.5rem!important}.ms-sm-5{margin-left:3rem!important}.ms-sm-auto{margin-left:auto!important}.p-sm-0{padding:0!important}.p-sm-1{padding:.25rem!important}.p-sm-2{padding:.5rem!important}.p-sm-3{padding:1rem!important}.p-sm-4{padding:1.5rem!important}.p-sm-5{padding:3rem!important}.px-sm-0{padding-right:0!important;padding-left:0!important}.px-sm-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-sm-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-sm-3{padding-right:1rem!important;padding-left:1rem!important}.px-sm-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-sm-5{padding-right:3rem!important;padding-left:3rem!important}.py-sm-0{padding-top:0!important;padding-bottom:0!important}.py-sm-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-sm-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-sm-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-sm-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-sm-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-sm-0{padding-top:0!important}.pt-sm-1{padding-top:.25rem!important}.pt-sm-2{padding-top:.5rem!important}.pt-sm-3{padding-top:1rem!important}.pt-sm-4{padding-top:1.5rem!important}.pt-sm-5{padding-top:3rem!important}.pe-sm-0{padding-right:0!important}.pe-sm-1{padding-right:.25rem!important}.pe-sm-2{padding-right:.5rem!important}.pe-sm-3{padding-right:1rem!important}.pe-sm-4{padding-right:1.5rem!important}.pe-sm-5{padding-right:3rem!important}.pb-sm-0{padding-bottom:0!important}.pb-sm-1{padding-bottom:.25rem!important}.pb-sm-2{padding-bottom:.5rem!important}.pb-sm-3{padding-bottom:1rem!important}.pb-sm-4{padding-bottom:1.5rem!important}.pb-sm-5{padding-bottom:3rem!important}.ps-sm-0{padding-left:0!important}.ps-sm-1{padding-left:.25rem!important}.ps-sm-2{padding-left:.5rem!important}.ps-sm-3{padding-left:1rem!important}.ps-sm-4{padding-left:1.5rem!important}.ps-sm-5{padding-left:3rem!important}.gap-sm-0{gap:0!important}.gap-sm-1{gap:.25rem!important}.gap-sm-2{gap:.5rem!important}.gap-sm-3{gap:1rem!important}.gap-sm-4{gap:1.5rem!important}.gap-sm-5{gap:3rem!important}.row-gap-sm-0{row-gap:0!important}.row-gap-sm-1{row-gap:.25rem!important}.row-gap-sm-2{row-gap:.5rem!important}.row-gap-sm-3{row-gap:1rem!important}.row-gap-sm-4{row-gap:1.5rem!important}.row-gap-sm-5{row-gap:3rem!important}.column-gap-sm-0{-moz-column-gap:0!important;column-gap:0!important}.column-gap-sm-1{-moz-column-gap:0.25rem!important;column-gap:.25rem!important}.column-gap-sm-2{-moz-column-gap:0.5rem!important;column-gap:.5rem!important}.column-gap-sm-3{-moz-column-gap:1rem!important;column-gap:1rem!important}.column-gap-sm-4{-moz-column-gap:1.5rem!important;column-gap:1.5rem!important}.column-gap-sm-5{-moz-column-gap:3rem!important;column-gap:3rem!important}.text-sm-start{text-align:left!important}.text-sm-end{text-align:right!important}.text-sm-center{text-align:center!important}}@media (min-width:768px){.float-md-start{float:left!important}.float-md-end{float:right!important}.float-md-none{float:none!important}.object-fit-md-contain{-o-object-fit:contain!important;object-fit:contain!important}.object-fit-md-cover{-o-object-fit:cover!important;object-fit:cover!important}.object-fit-md-fill{-o-object-fit:fill!important;object-fit:fill!important}.object-fit-md-scale{-o-object-fit:scale-down!important;object-fit:scale-down!important}.object-fit-md-none{-o-object-fit:none!important;object-fit:none!important}.d-md-inline{display:inline!important}.d-md-inline-block{display:inline-block!important}.d-md-block{display:block!important}.d-md-grid{display:grid!important}.d-md-inline-grid{display:inline-grid!important}.d-md-table{display:table!important}.d-md-table-row{display:table-row!important}.d-md-table-cell{display:table-cell!important}.d-md-flex{display:flex!important}.d-md-inline-flex{display:inline-flex!important}.d-md-none{display:none!important}.flex-md-fill{flex:1 1 auto!important}.flex-md-row{flex-direction:row!important}.flex-md-column{flex-direction:column!important}.flex-md-row-reverse{flex-direction:row-reverse!important}.flex-md-column-reverse{flex-direction:column-reverse!important}.flex-md-grow-0{flex-grow:0!important}.flex-md-grow-1{flex-grow:1!important}.flex-md-shrink-0{flex-shrink:0!important}.flex-md-shrink-1{flex-shrink:1!important}.flex-md-wrap{flex-wrap:wrap!important}.flex-md-nowrap{flex-wrap:nowrap!important}.flex-md-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-md-start{justify-content:flex-start!important}.justify-content-md-end{justify-content:flex-end!important}.justify-content-md-center{justify-content:center!important}.justify-content-md-between{justify-content:space-between!important}.justify-content-md-around{justify-content:space-around!important}.justify-content-md-evenly{justify-content:space-evenly!important}.align-items-md-start{align-items:flex-start!important}.align-items-md-end{align-items:flex-end!important}.align-items-md-center{align-items:center!important}.align-items-md-baseline{align-items:baseline!important}.align-items-md-stretch{align-items:stretch!important}.align-content-md-start{align-content:flex-start!important}.align-content-md-end{align-content:flex-end!important}.align-content-md-center{align-content:center!important}.align-content-md-between{align-content:space-between!important}.align-content-md-around{align-content:space-around!important}.align-content-md-stretch{align-content:stretch!important}.align-self-md-auto{align-self:auto!important}.align-self-md-start{align-self:flex-start!important}.align-self-md-end{align-self:flex-end!important}.align-self-md-center{align-self:center!important}.align-self-md-baseline{align-self:baseline!important}.align-self-md-stretch{align-self:stretch!important}.order-md-first{order:-1!important}.order-md-0{order:0!important}.order-md-1{order:1!important}.order-md-2{order:2!important}.order-md-3{order:3!important}.order-md-4{order:4!important}.order-md-5{order:5!important}.order-md-last{order:6!important}.m-md-0{margin:0!important}.m-md-1{margin:.25rem!important}.m-md-2{margin:.5rem!important}.m-md-3{margin:1rem!important}.m-md-4{margin:1.5rem!important}.m-md-5{margin:3rem!important}.m-md-auto{margin:auto!important}.mx-md-0{margin-right:0!important;margin-left:0!important}.mx-md-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-md-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-md-3{margin-right:1rem!important;margin-left:1rem!important}.mx-md-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-md-5{margin-right:3rem!important;margin-left:3rem!important}.mx-md-auto{margin-right:auto!important;margin-left:auto!important}.my-md-0{margin-top:0!important;margin-bottom:0!important}.my-md-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-md-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-md-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-md-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-md-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-md-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-md-0{margin-top:0!important}.mt-md-1{margin-top:.25rem!important}.mt-md-2{margin-top:.5rem!important}.mt-md-3{margin-top:1rem!important}.mt-md-4{margin-top:1.5rem!important}.mt-md-5{margin-top:3rem!important}.mt-md-auto{margin-top:auto!important}.me-md-0{margin-right:0!important}.me-md-1{margin-right:.25rem!important}.me-md-2{margin-right:.5rem!important}.me-md-3{margin-right:1rem!important}.me-md-4{margin-right:1.5rem!important}.me-md-5{margin-right:3rem!important}.me-md-auto{margin-right:auto!important}.mb-md-0{margin-bottom:0!important}.mb-md-1{margin-bottom:.25rem!important}.mb-md-2{margin-bottom:.5rem!important}.mb-md-3{margin-bottom:1rem!important}.mb-md-4{margin-bottom:1.5rem!important}.mb-md-5{margin-bottom:3rem!important}.mb-md-auto{margin-bottom:auto!important}.ms-md-0{margin-left:0!important}.ms-md-1{margin-left:.25rem!important}.ms-md-2{margin-left:.5rem!important}.ms-md-3{margin-left:1rem!important}.ms-md-4{margin-left:1.5rem!important}.ms-md-5{margin-left:3rem!important}.ms-md-auto{margin-left:auto!important}.p-md-0{padding:0!important}.p-md-1{padding:.25rem!important}.p-md-2{padding:.5rem!important}.p-md-3{padding:1rem!important}.p-md-4{padding:1.5rem!important}.p-md-5{padding:3rem!important}.px-md-0{padding-right:0!important;padding-left:0!important}.px-md-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-md-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-md-3{padding-right:1rem!important;padding-left:1rem!important}.px-md-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-md-5{padding-right:3rem!important;padding-left:3rem!important}.py-md-0{padding-top:0!important;padding-bottom:0!important}.py-md-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-md-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-md-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-md-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-md-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-md-0{padding-top:0!important}.pt-md-1{padding-top:.25rem!important}.pt-md-2{padding-top:.5rem!important}.pt-md-3{padding-top:1rem!important}.pt-md-4{padding-top:1.5rem!important}.pt-md-5{padding-top:3rem!important}.pe-md-0{padding-right:0!important}.pe-md-1{padding-right:.25rem!important}.pe-md-2{padding-right:.5rem!important}.pe-md-3{padding-right:1rem!important}.pe-md-4{padding-right:1.5rem!important}.pe-md-5{padding-right:3rem!important}.pb-md-0{padding-bottom:0!important}.pb-md-1{padding-bottom:.25rem!important}.pb-md-2{padding-bottom:.5rem!important}.pb-md-3{padding-bottom:1rem!important}.pb-md-4{padding-bottom:1.5rem!important}.pb-md-5{padding-bottom:3rem!important}.ps-md-0{padding-left:0!important}.ps-md-1{padding-left:.25rem!important}.ps-md-2{padding-left:.5rem!important}.ps-md-3{padding-left:1rem!important}.ps-md-4{padding-left:1.5rem!important}.ps-md-5{padding-left:3rem!important}.gap-md-0{gap:0!important}.gap-md-1{gap:.25rem!important}.gap-md-2{gap:.5rem!important}.gap-md-3{gap:1rem!important}.gap-md-4{gap:1.5rem!important}.gap-md-5{gap:3rem!important}.row-gap-md-0{row-gap:0!important}.row-gap-md-1{row-gap:.25rem!important}.row-gap-md-2{row-gap:.5rem!important}.row-gap-md-3{row-gap:1rem!important}.row-gap-md-4{row-gap:1.5rem!important}.row-gap-md-5{row-gap:3rem!important}.column-gap-md-0{-moz-column-gap:0!important;column-gap:0!important}.column-gap-md-1{-moz-column-gap:0.25rem!important;column-gap:.25rem!important}.column-gap-md-2{-moz-column-gap:0.5rem!important;column-gap:.5rem!important}.column-gap-md-3{-moz-column-gap:1rem!important;column-gap:1rem!important}.column-gap-md-4{-moz-column-gap:1.5rem!important;column-gap:1.5rem!important}.column-gap-md-5{-moz-column-gap:3rem!important;column-gap:3rem!important}.text-md-start{text-align:left!important}.text-md-end{text-align:right!important}.text-md-center{text-align:center!important}}@media (min-width:992px){.float-lg-start{float:left!important}.float-lg-end{float:right!important}.float-lg-none{float:none!important}.object-fit-lg-contain{-o-object-fit:contain!important;object-fit:contain!important}.object-fit-lg-cover{-o-object-fit:cover!important;object-fit:cover!important}.object-fit-lg-fill{-o-object-fit:fill!important;object-fit:fill!important}.object-fit-lg-scale{-o-object-fit:scale-down!important;object-fit:scale-down!important}.object-fit-lg-none{-o-object-fit:none!important;object-fit:none!important}.d-lg-inline{display:inline!important}.d-lg-inline-block{display:inline-block!important}.d-lg-block{display:block!important}.d-lg-grid{display:grid!important}.d-lg-inline-grid{display:inline-grid!important}.d-lg-table{display:table!important}.d-lg-table-row{display:table-row!important}.d-lg-table-cell{display:table-cell!important}.d-lg-flex{display:flex!important}.d-lg-inline-flex{display:inline-flex!important}.d-lg-none{display:none!important}.flex-lg-fill{flex:1 1 auto!important}.flex-lg-row{flex-direction:row!important}.flex-lg-column{flex-direction:column!important}.flex-lg-row-reverse{flex-direction:row-reverse!important}.flex-lg-column-reverse{flex-direction:column-reverse!important}.flex-lg-grow-0{flex-grow:0!important}.flex-lg-grow-1{flex-grow:1!important}.flex-lg-shrink-0{flex-shrink:0!important}.flex-lg-shrink-1{flex-shrink:1!important}.flex-lg-wrap{flex-wrap:wrap!important}.flex-lg-nowrap{flex-wrap:nowrap!important}.flex-lg-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-lg-start{justify-content:flex-start!important}.justify-content-lg-end{justify-content:flex-end!important}.justify-content-lg-center{justify-content:center!important}.justify-content-lg-between{justify-content:space-between!important}.justify-content-lg-around{justify-content:space-around!important}.justify-content-lg-evenly{justify-content:space-evenly!important}.align-items-lg-start{align-items:flex-start!important}.align-items-lg-end{align-items:flex-end!important}.align-items-lg-center{align-items:center!important}.align-items-lg-baseline{align-items:baseline!important}.align-items-lg-stretch{align-items:stretch!important}.align-content-lg-start{align-content:flex-start!important}.align-content-lg-end{align-content:flex-end!important}.align-content-lg-center{align-content:center!important}.align-content-lg-between{align-content:space-between!important}.align-content-lg-around{align-content:space-around!important}.align-content-lg-stretch{align-content:stretch!important}.align-self-lg-auto{align-self:auto!important}.align-self-lg-start{align-self:flex-start!important}.align-self-lg-end{align-self:flex-end!important}.align-self-lg-center{align-self:center!important}.align-self-lg-baseline{align-self:baseline!important}.align-self-lg-stretch{align-self:stretch!important}.order-lg-first{order:-1!important}.order-lg-0{order:0!important}.order-lg-1{order:1!important}.order-lg-2{order:2!important}.order-lg-3{order:3!important}.order-lg-4{order:4!important}.order-lg-5{order:5!important}.order-lg-last{order:6!important}.m-lg-0{margin:0!important}.m-lg-1{margin:.25rem!important}.m-lg-2{margin:.5rem!important}.m-lg-3{margin:1rem!important}.m-lg-4{margin:1.5rem!important}.m-lg-5{margin:3rem!important}.m-lg-auto{margin:auto!important}.mx-lg-0{margin-right:0!important;margin-left:0!important}.mx-lg-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-lg-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-lg-3{margin-right:1rem!important;margin-left:1rem!important}.mx-lg-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-lg-5{margin-right:3rem!important;margin-left:3rem!important}.mx-lg-auto{margin-right:auto!important;margin-left:auto!important}.my-lg-0{margin-top:0!important;margin-bottom:0!important}.my-lg-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-lg-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-lg-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-lg-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-lg-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-lg-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-lg-0{margin-top:0!important}.mt-lg-1{margin-top:.25rem!important}.mt-lg-2{margin-top:.5rem!important}.mt-lg-3{margin-top:1rem!important}.mt-lg-4{margin-top:1.5rem!important}.mt-lg-5{margin-top:3rem!important}.mt-lg-auto{margin-top:auto!important}.me-lg-0{margin-right:0!important}.me-lg-1{margin-right:.25rem!important}.me-lg-2{margin-right:.5rem!important}.me-lg-3{margin-right:1rem!important}.me-lg-4{margin-right:1.5rem!important}.me-lg-5{margin-right:3rem!important}.me-lg-auto{margin-right:auto!important}.mb-lg-0{margin-bottom:0!important}.mb-lg-1{margin-bottom:.25rem!important}.mb-lg-2{margin-bottom:.5rem!important}.mb-lg-3{margin-bottom:1rem!important}.mb-lg-4{margin-bottom:1.5rem!important}.mb-lg-5{margin-bottom:3rem!important}.mb-lg-auto{margin-bottom:auto!important}.ms-lg-0{margin-left:0!important}.ms-lg-1{margin-left:.25rem!important}.ms-lg-2{margin-left:.5rem!important}.ms-lg-3{margin-left:1rem!important}.ms-lg-4{margin-left:1.5rem!important}.ms-lg-5{margin-left:3rem!important}.ms-lg-auto{margin-left:auto!important}.p-lg-0{padding:0!important}.p-lg-1{padding:.25rem!important}.p-lg-2{padding:.5rem!important}.p-lg-3{padding:1rem!important}.p-lg-4{padding:1.5rem!important}.p-lg-5{padding:3rem!important}.px-lg-0{padding-right:0!important;padding-left:0!important}.px-lg-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-lg-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-lg-3{padding-right:1rem!important;padding-left:1rem!important}.px-lg-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-lg-5{padding-right:3rem!important;padding-left:3rem!important}.py-lg-0{padding-top:0!important;padding-bottom:0!important}.py-lg-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-lg-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-lg-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-lg-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-lg-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-lg-0{padding-top:0!important}.pt-lg-1{padding-top:.25rem!important}.pt-lg-2{padding-top:.5rem!important}.pt-lg-3{padding-top:1rem!important}.pt-lg-4{padding-top:1.5rem!important}.pt-lg-5{padding-top:3rem!important}.pe-lg-0{padding-right:0!important}.pe-lg-1{padding-right:.25rem!important}.pe-lg-2{padding-right:.5rem!important}.pe-lg-3{padding-right:1rem!important}.pe-lg-4{padding-right:1.5rem!important}.pe-lg-5{padding-right:3rem!important}.pb-lg-0{padding-bottom:0!important}.pb-lg-1{padding-bottom:.25rem!important}.pb-lg-2{padding-bottom:.5rem!important}.pb-lg-3{padding-bottom:1rem!important}.pb-lg-4{padding-bottom:1.5rem!important}.pb-lg-5{padding-bottom:3rem!important}.ps-lg-0{padding-left:0!important}.ps-lg-1{padding-left:.25rem!important}.ps-lg-2{padding-left:.5rem!important}.ps-lg-3{padding-left:1rem!important}.ps-lg-4{padding-left:1.5rem!important}.ps-lg-5{padding-left:3rem!important}.gap-lg-0{gap:0!important}.gap-lg-1{gap:.25rem!important}.gap-lg-2{gap:.5rem!important}.gap-lg-3{gap:1rem!important}.gap-lg-4{gap:1.5rem!important}.gap-lg-5{gap:3rem!important}.row-gap-lg-0{row-gap:0!important}.row-gap-lg-1{row-gap:.25rem!important}.row-gap-lg-2{row-gap:.5rem!important}.row-gap-lg-3{row-gap:1rem!important}.row-gap-lg-4{row-gap:1.5rem!important}.row-gap-lg-5{row-gap:3rem!important}.column-gap-lg-0{-moz-column-gap:0!important;column-gap:0!important}.column-gap-lg-1{-moz-column-gap:0.25rem!important;column-gap:.25rem!important}.column-gap-lg-2{-moz-column-gap:0.5rem!important;column-gap:.5rem!important}.column-gap-lg-3{-moz-column-gap:1rem!important;column-gap:1rem!important}.column-gap-lg-4{-moz-column-gap:1.5rem!important;column-gap:1.5rem!important}.column-gap-lg-5{-moz-column-gap:3rem!important;column-gap:3rem!important}.text-lg-start{text-align:left!important}.text-lg-end{text-align:right!important}.text-lg-center{text-align:center!important}}@media (min-width:1200px){.float-xl-start{float:left!important}.float-xl-end{float:right!important}.float-xl-none{float:none!important}.object-fit-xl-contain{-o-object-fit:contain!important;object-fit:contain!important}.object-fit-xl-cover{-o-object-fit:cover!important;object-fit:cover!important}.object-fit-xl-fill{-o-object-fit:fill!important;object-fit:fill!important}.object-fit-xl-scale{-o-object-fit:scale-down!important;object-fit:scale-down!important}.object-fit-xl-none{-o-object-fit:none!important;object-fit:none!important}.d-xl-inline{display:inline!important}.d-xl-inline-block{display:inline-block!important}.d-xl-block{display:block!important}.d-xl-grid{display:grid!important}.d-xl-inline-grid{display:inline-grid!important}.d-xl-table{display:table!important}.d-xl-table-row{display:table-row!important}.d-xl-table-cell{display:table-cell!important}.d-xl-flex{display:flex!important}.d-xl-inline-flex{display:inline-flex!important}.d-xl-none{display:none!important}.flex-xl-fill{flex:1 1 auto!important}.flex-xl-row{flex-direction:row!important}.flex-xl-column{flex-direction:column!important}.flex-xl-row-reverse{flex-direction:row-reverse!important}.flex-xl-column-reverse{flex-direction:column-reverse!important}.flex-xl-grow-0{flex-grow:0!important}.flex-xl-grow-1{flex-grow:1!important}.flex-xl-shrink-0{flex-shrink:0!important}.flex-xl-shrink-1{flex-shrink:1!important}.flex-xl-wrap{flex-wrap:wrap!important}.flex-xl-nowrap{flex-wrap:nowrap!important}.flex-xl-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-xl-start{justify-content:flex-start!important}.justify-content-xl-end{justify-content:flex-end!important}.justify-content-xl-center{justify-content:center!important}.justify-content-xl-between{justify-content:space-between!important}.justify-content-xl-around{justify-content:space-around!important}.justify-content-xl-evenly{justify-content:space-evenly!important}.align-items-xl-start{align-items:flex-start!important}.align-items-xl-end{align-items:flex-end!important}.align-items-xl-center{align-items:center!important}.align-items-xl-baseline{align-items:baseline!important}.align-items-xl-stretch{align-items:stretch!important}.align-content-xl-start{align-content:flex-start!important}.align-content-xl-end{align-content:flex-end!important}.align-content-xl-center{align-content:center!important}.align-content-xl-between{align-content:space-between!important}.align-content-xl-around{align-content:space-around!important}.align-content-xl-stretch{align-content:stretch!important}.align-self-xl-auto{align-self:auto!important}.align-self-xl-start{align-self:flex-start!important}.align-self-xl-end{align-self:flex-end!important}.align-self-xl-center{align-self:center!important}.align-self-xl-baseline{align-self:baseline!important}.align-self-xl-stretch{align-self:stretch!important}.order-xl-first{order:-1!important}.order-xl-0{order:0!important}.order-xl-1{order:1!important}.order-xl-2{order:2!important}.order-xl-3{order:3!important}.order-xl-4{order:4!important}.order-xl-5{order:5!important}.order-xl-last{order:6!important}.m-xl-0{margin:0!important}.m-xl-1{margin:.25rem!important}.m-xl-2{margin:.5rem!important}.m-xl-3{margin:1rem!important}.m-xl-4{margin:1.5rem!important}.m-xl-5{margin:3rem!important}.m-xl-auto{margin:auto!important}.mx-xl-0{margin-right:0!important;margin-left:0!important}.mx-xl-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-xl-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-xl-3{margin-right:1rem!important;margin-left:1rem!important}.mx-xl-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-xl-5{margin-right:3rem!important;margin-left:3rem!important}.mx-xl-auto{margin-right:auto!important;margin-left:auto!important}.my-xl-0{margin-top:0!important;margin-bottom:0!important}.my-xl-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-xl-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-xl-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-xl-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-xl-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-xl-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-xl-0{margin-top:0!important}.mt-xl-1{margin-top:.25rem!important}.mt-xl-2{margin-top:.5rem!important}.mt-xl-3{margin-top:1rem!important}.mt-xl-4{margin-top:1.5rem!important}.mt-xl-5{margin-top:3rem!important}.mt-xl-auto{margin-top:auto!important}.me-xl-0{margin-right:0!important}.me-xl-1{margin-right:.25rem!important}.me-xl-2{margin-right:.5rem!important}.me-xl-3{margin-right:1rem!important}.me-xl-4{margin-right:1.5rem!important}.me-xl-5{margin-right:3rem!important}.me-xl-auto{margin-right:auto!important}.mb-xl-0{margin-bottom:0!important}.mb-xl-1{margin-bottom:.25rem!important}.mb-xl-2{margin-bottom:.5rem!important}.mb-xl-3{margin-bottom:1rem!important}.mb-xl-4{margin-bottom:1.5rem!important}.mb-xl-5{margin-bottom:3rem!important}.mb-xl-auto{margin-bottom:auto!important}.ms-xl-0{margin-left:0!important}.ms-xl-1{margin-left:.25rem!important}.ms-xl-2{margin-left:.5rem!important}.ms-xl-3{margin-left:1rem!important}.ms-xl-4{margin-left:1.5rem!important}.ms-xl-5{margin-left:3rem!important}.ms-xl-auto{margin-left:auto!important}.p-xl-0{padding:0!important}.p-xl-1{padding:.25rem!important}.p-xl-2{padding:.5rem!important}.p-xl-3{padding:1rem!important}.p-xl-4{padding:1.5rem!important}.p-xl-5{padding:3rem!important}.px-xl-0{padding-right:0!important;padding-left:0!important}.px-xl-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-xl-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-xl-3{padding-right:1rem!important;padding-left:1rem!important}.px-xl-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-xl-5{padding-right:3rem!important;padding-left:3rem!important}.py-xl-0{padding-top:0!important;padding-bottom:0!important}.py-xl-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-xl-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-xl-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-xl-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-xl-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-xl-0{padding-top:0!important}.pt-xl-1{padding-top:.25rem!important}.pt-xl-2{padding-top:.5rem!important}.pt-xl-3{padding-top:1rem!important}.pt-xl-4{padding-top:1.5rem!important}.pt-xl-5{padding-top:3rem!important}.pe-xl-0{padding-right:0!important}.pe-xl-1{padding-right:.25rem!important}.pe-xl-2{padding-right:.5rem!important}.pe-xl-3{padding-right:1rem!important}.pe-xl-4{padding-right:1.5rem!important}.pe-xl-5{padding-right:3rem!important}.pb-xl-0{padding-bottom:0!important}.pb-xl-1{padding-bottom:.25rem!important}.pb-xl-2{padding-bottom:.5rem!important}.pb-xl-3{padding-bottom:1rem!important}.pb-xl-4{padding-bottom:1.5rem!important}.pb-xl-5{padding-bottom:3rem!important}.ps-xl-0{padding-left:0!important}.ps-xl-1{padding-left:.25rem!important}.ps-xl-2{padding-left:.5rem!important}.ps-xl-3{padding-left:1rem!important}.ps-xl-4{padding-left:1.5rem!important}.ps-xl-5{padding-left:3rem!important}.gap-xl-0{gap:0!important}.gap-xl-1{gap:.25rem!important}.gap-xl-2{gap:.5rem!important}.gap-xl-3{gap:1rem!important}.gap-xl-4{gap:1.5rem!important}.gap-xl-5{gap:3rem!important}.row-gap-xl-0{row-gap:0!important}.row-gap-xl-1{row-gap:.25rem!important}.row-gap-xl-2{row-gap:.5rem!important}.row-gap-xl-3{row-gap:1rem!important}.row-gap-xl-4{row-gap:1.5rem!important}.row-gap-xl-5{row-gap:3rem!important}.column-gap-xl-0{-moz-column-gap:0!important;column-gap:0!important}.column-gap-xl-1{-moz-column-gap:0.25rem!important;column-gap:.25rem!important}.column-gap-xl-2{-moz-column-gap:0.5rem!important;column-gap:.5rem!important}.column-gap-xl-3{-moz-column-gap:1rem!important;column-gap:1rem!important}.column-gap-xl-4{-moz-column-gap:1.5rem!important;column-gap:1.5rem!important}.column-gap-xl-5{-moz-column-gap:3rem!important;column-gap:3rem!important}.text-xl-start{text-align:left!important}.text-xl-end{text-align:right!important}.text-xl-center{text-align:center!important}}@media (min-width:1400px){.float-xxl-start{float:left!important}.float-xxl-end{float:right!important}.float-xxl-none{float:none!important}.object-fit-xxl-contain{-o-object-fit:contain!important;object-fit:contain!important}.object-fit-xxl-cover{-o-object-fit:cover!important;object-fit:cover!important}.object-fit-xxl-fill{-o-object-fit:fill!important;object-fit:fill!important}.object-fit-xxl-scale{-o-object-fit:scale-down!important;object-fit:scale-down!important}.object-fit-xxl-none{-o-object-fit:none!important;object-fit:none!important}.d-xxl-inline{display:inline!important}.d-xxl-inline-block{display:inline-block!important}.d-xxl-block{display:block!important}.d-xxl-grid{display:grid!important}.d-xxl-inline-grid{display:inline-grid!important}.d-xxl-table{display:table!important}.d-xxl-table-row{display:table-row!important}.d-xxl-table-cell{display:table-cell!important}.d-xxl-flex{display:flex!important}.d-xxl-inline-flex{display:inline-flex!important}.d-xxl-none{display:none!important}.flex-xxl-fill{flex:1 1 auto!important}.flex-xxl-row{flex-direction:row!important}.flex-xxl-column{flex-direction:column!important}.flex-xxl-row-reverse{flex-direction:row-reverse!important}.flex-xxl-column-reverse{flex-direction:column-reverse!important}.flex-xxl-grow-0{flex-grow:0!important}.flex-xxl-grow-1{flex-grow:1!important}.flex-xxl-shrink-0{flex-shrink:0!important}.flex-xxl-shrink-1{flex-shrink:1!important}.flex-xxl-wrap{flex-wrap:wrap!important}.flex-xxl-nowrap{flex-wrap:nowrap!important}.flex-xxl-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-xxl-start{justify-content:flex-start!important}.justify-content-xxl-end{justify-content:flex-end!important}.justify-content-xxl-center{justify-content:center!important}.justify-content-xxl-between{justify-content:space-between!important}.justify-content-xxl-around{justify-content:space-around!important}.justify-content-xxl-evenly{justify-content:space-evenly!important}.align-items-xxl-start{align-items:flex-start!important}.align-items-xxl-end{align-items:flex-end!important}.align-items-xxl-center{align-items:center!important}.align-items-xxl-baseline{align-items:baseline!important}.align-items-xxl-stretch{align-items:stretch!important}.align-content-xxl-start{align-content:flex-start!important}.align-content-xxl-end{align-content:flex-end!important}.align-content-xxl-center{align-content:center!important}.align-content-xxl-between{align-content:space-between!important}.align-content-xxl-around{align-content:space-around!important}.align-content-xxl-stretch{align-content:stretch!important}.align-self-xxl-auto{align-self:auto!important}.align-self-xxl-start{align-self:flex-start!important}.align-self-xxl-end{align-self:flex-end!important}.align-self-xxl-center{align-self:center!important}.align-self-xxl-baseline{align-self:baseline!important}.align-self-xxl-stretch{align-self:stretch!important}.order-xxl-first{order:-1!important}.order-xxl-0{order:0!important}.order-xxl-1{order:1!important}.order-xxl-2{order:2!important}.order-xxl-3{order:3!important}.order-xxl-4{order:4!important}.order-xxl-5{order:5!important}.order-xxl-last{order:6!important}.m-xxl-0{margin:0!important}.m-xxl-1{margin:.25rem!important}.m-xxl-2{margin:.5rem!important}.m-xxl-3{margin:1rem!important}.m-xxl-4{margin:1.5rem!important}.m-xxl-5{margin:3rem!important}.m-xxl-auto{margin:auto!important}.mx-xxl-0{margin-right:0!important;margin-left:0!important}.mx-xxl-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-xxl-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-xxl-3{margin-right:1rem!important;margin-left:1rem!important}.mx-xxl-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-xxl-5{margin-right:3rem!important;margin-left:3rem!important}.mx-xxl-auto{margin-right:auto!important;margin-left:auto!important}.my-xxl-0{margin-top:0!important;margin-bottom:0!important}.my-xxl-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-xxl-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-xxl-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-xxl-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-xxl-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-xxl-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-xxl-0{margin-top:0!important}.mt-xxl-1{margin-top:.25rem!important}.mt-xxl-2{margin-top:.5rem!important}.mt-xxl-3{margin-top:1rem!important}.mt-xxl-4{margin-top:1.5rem!important}.mt-xxl-5{margin-top:3rem!important}.mt-xxl-auto{margin-top:auto!important}.me-xxl-0{margin-right:0!important}.me-xxl-1{margin-right:.25rem!important}.me-xxl-2{margin-right:.5rem!important}.me-xxl-3{margin-right:1rem!important}.me-xxl-4{margin-right:1.5rem!important}.me-xxl-5{margin-right:3rem!important}.me-xxl-auto{margin-right:auto!important}.mb-xxl-0{margin-bottom:0!important}.mb-xxl-1{margin-bottom:.25rem!important}.mb-xxl-2{margin-bottom:.5rem!important}.mb-xxl-3{margin-bottom:1rem!important}.mb-xxl-4{margin-bottom:1.5rem!important}.mb-xxl-5{margin-bottom:3rem!important}.mb-xxl-auto{margin-bottom:auto!important}.ms-xxl-0{margin-left:0!important}.ms-xxl-1{margin-left:.25rem!important}.ms-xxl-2{margin-left:.5rem!important}.ms-xxl-3{margin-left:1rem!important}.ms-xxl-4{margin-left:1.5rem!important}.ms-xxl-5{margin-left:3rem!important}.ms-xxl-auto{margin-left:auto!important}.p-xxl-0{padding:0!important}.p-xxl-1{padding:.25rem!important}.p-xxl-2{padding:.5rem!important}.p-xxl-3{padding:1rem!important}.p-xxl-4{padding:1.5rem!important}.p-xxl-5{padding:3rem!important}.px-xxl-0{padding-right:0!important;padding-left:0!important}.px-xxl-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-xxl-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-xxl-3{padding-right:1rem!important;padding-left:1rem!important}.px-xxl-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-xxl-5{padding-right:3rem!important;padding-left:3rem!important}.py-xxl-0{padding-top:0!important;padding-bottom:0!important}.py-xxl-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-xxl-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-xxl-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-xxl-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-xxl-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-xxl-0{padding-top:0!important}.pt-xxl-1{padding-top:.25rem!important}.pt-xxl-2{padding-top:.5rem!important}.pt-xxl-3{padding-top:1rem!important}.pt-xxl-4{padding-top:1.5rem!important}.pt-xxl-5{padding-top:3rem!important}.pe-xxl-0{padding-right:0!important}.pe-xxl-1{padding-right:.25rem!important}.pe-xxl-2{padding-right:.5rem!important}.pe-xxl-3{padding-right:1rem!important}.pe-xxl-4{padding-right:1.5rem!important}.pe-xxl-5{padding-right:3rem!important}.pb-xxl-0{padding-bottom:0!important}.pb-xxl-1{padding-bottom:.25rem!important}.pb-xxl-2{padding-bottom:.5rem!important}.pb-xxl-3{padding-bottom:1rem!important}.pb-xxl-4{padding-bottom:1.5rem!important}.pb-xxl-5{padding-bottom:3rem!important}.ps-xxl-0{padding-left:0!important}.ps-xxl-1{padding-left:.25rem!important}.ps-xxl-2{padding-left:.5rem!important}.ps-xxl-3{padding-left:1rem!important}.ps-xxl-4{padding-left:1.5rem!important}.ps-xxl-5{padding-left:3rem!important}.gap-xxl-0{gap:0!important}.gap-xxl-1{gap:.25rem!important}.gap-xxl-2{gap:.5rem!important}.gap-xxl-3{gap:1rem!important}.gap-xxl-4{gap:1.5rem!important}.gap-xxl-5{gap:3rem!important}.row-gap-xxl-0{row-gap:0!important}.row-gap-xxl-1{row-gap:.25rem!important}.row-gap-xxl-2{row-gap:.5rem!important}.row-gap-xxl-3{row-gap:1rem!important}.row-gap-xxl-4{row-gap:1.5rem!important}.row-gap-xxl-5{row-gap:3rem!important}.column-gap-xxl-0{-moz-column-gap:0!important;column-gap:0!important}.column-gap-xxl-1{-moz-column-gap:0.25rem!important;column-gap:.25rem!important}.column-gap-xxl-2{-moz-column-gap:0.5rem!important;column-gap:.5rem!important}.column-gap-xxl-3{-moz-column-gap:1rem!important;column-gap:1rem!important}.column-gap-xxl-4{-moz-column-gap:1.5rem!important;column-gap:1.5rem!important}.column-gap-xxl-5{-moz-column-gap:3rem!important;column-gap:3rem!important}.text-xxl-start{text-align:left!important}.text-xxl-end{text-align:right!important}.text-xxl-center{text-align:center!important}}@media (min-width:1200px){.fs-1{font-size:2.5rem!important}.fs-2{font-size:2rem!important}.fs-3{font-size:1.75rem!important}.fs-4{font-size:1.5rem!important}}@media print{.d-print-inline{display:inline!important}.d-print-inline-block{display:inline-block!important}.d-print-block{display:block!important}.d-print-grid{display:grid!important}.d-print-inline-grid{display:inline-grid!important}.d-print-table{display:table!important}.d-print-table-row{display:table-row!important}.d-print-table-cell{display:table-cell!important}.d-print-flex{display:flex!important}.d-print-inline-flex{display:inline-flex!important}.d-print-none{display:none!important}}
+/*# sourceMappingURL=bootstrap.min.css.map */
\ No newline at end of file
diff --git a/test/builtins.test.js b/test/builtins.test.js
new file mode 100644
index 0000000..fcb19ae
--- /dev/null
+++ b/test/builtins.test.js
@@ -0,0 +1,46 @@
+const { test } = require("node:test");
+const assert = require("node:assert");
+const builtins = require("../lib/builtins");
+const { compileTheme } = require("../lib/compile");
+const { normalizeTokens } = require("../lib/themeSchema");
+
+
+test("listBuiltins returns frozen starters with namespaced ids", () => {
+    const list = builtins.listBuiltins();
+    assert.ok(list.length >= 3);
+    for (const t of list) {
+        assert.ok(builtins.isBuiltinId(t.id), `${t.id} is namespaced`);
+        assert.ok(Object.isFrozen(t));
+        assert.equal(t.engine, "bootstrap5");
+    }
+});
+
+
+test("getBuiltin / get resolve by id, default is a real builtin", () => {
+    assert.equal(builtins.getBuiltin("builtin:flatly").name, "Flatly");
+    assert.equal(builtins.get("builtin:darkly").name, "Darkly");
+    assert.equal(builtins.getBuiltin("builtin:nope"), null);
+    assert.ok(builtins.getBuiltin(builtins.defaultId()));
+});
+
+
+test("isBuiltinId distinguishes builtins from uuid rows", () => {
+    assert.equal(builtins.isBuiltinId("builtin:flatly"), true);
+    assert.equal(builtins.isBuiltinId("ab12cd34-..."), false);
+    assert.equal(builtins.isBuiltinId(undefined), false);
+});
+
+
+test("fallbackCss is valid, brace-free CSS", () => {
+    const css = builtins.fallbackCss();
+    assert.equal(typeof css, "string");
+    assert.doesNotMatch(css, /[{}]/);
+});
+
+
+test("every builtin compiles to balanced CSS", () => {
+    for (const t of builtins.listBuiltins()) {
+        const out = compileTheme(normalizeTokens(t.tokens));
+        assert.ok(!out.warnings.some((w) => /unbalanced|invalid/.test(w)), `${t.id} compiles cleanly`);
+    }
+});
diff --git a/test/compile.test.js b/test/compile.test.js
new file mode 100644
index 0000000..4e86553
--- /dev/null
+++ b/test/compile.test.js
@@ -0,0 +1,74 @@
+const { test } = require("node:test");
+const assert = require("node:assert");
+const { compileTheme, emitOverlayCss, robustnessGuard, contentHash, deriveRgb } = require("../lib/compile");
+const { normalizeTokens } = require("../lib/themeSchema");
+
+
+function bracesBalanced(css) {
+    let depth = 0;
+    for (const ch of css) {
+        if (ch === "{") depth += 1;
+        else if (ch === "}") { depth -= 1; if (depth < 0) return false; }
+    }
+    return depth === 0;
+}
+
+
+test("compileTheme emits --bs-* overlay with derived rgb companion", () => {
+    const out = compileTheme(normalizeTokens({ colors: { primary: "#ff0000" } }));
+    assert.match(out.css, /--bs-primary: #ff0000;/);
+    assert.match(out.css, /--bs-primary-rgb: 255, 0, 0;/);
+    assert.equal(out.engine, "overlay");
+    assert.ok(bracesBalanced(out.css));
+});
+
+
+test("compileTheme NEVER throws and is balanced even for a brace-injecting token", () => {
+    // A value containing "}" would close :root{} early -> it must be DROPPED.
+    const out = compileTheme(normalizeTokens({ colors: { primary: "#fff} body{display:none" } }));
+    assert.ok(bracesBalanced(out.css), "braces stay balanced");
+    assert.doesNotMatch(out.css, /display:none/);
+    assert.ok(out.warnings.length >= 1);
+});
+
+
+test("targeted rule tokens emit their own block", () => {
+    const out = emitOverlayCss(normalizeTokens({ components: { navbarBg: "#101010" } }));
+    assert.match(out.css, /\.navbar\{--bs-navbar-bg: #101010;\}/);
+    assert.ok(bracesBalanced(out.css));
+});
+
+
+test("empty/default theme compiles to valid non-white-screen CSS", () => {
+    const out = compileTheme(normalizeTokens({}));
+    assert.ok(bracesBalanced(out.css));
+    assert.match(out.css, /:root\{/);
+});
+
+
+test("custom raw vars pass through, malformed keys are skipped", () => {
+    const out = emitOverlayCss(normalizeTokens({ custom: { "--my-var": "10px", "bad key": "x" } }));
+    assert.match(out.css, /--my-var: 10px;/);
+    assert.doesNotMatch(out.css, /bad key/);
+});
+
+
+test("deriveRgb handles #rgb, #rrggbb, and rejects non-hex", () => {
+    assert.equal(deriveRgb("#fff"), "255, 255, 255");
+    assert.equal(deriveRgb("#0d6efd"), "13, 110, 253");
+    assert.equal(deriveRgb("rebeccapurple"), null);
+});
+
+
+test("robustnessGuard collapses unbalanced CSS to an empty sentinel", () => {
+    const g = robustnessGuard(":root{--x: 1;", []);
+    assert.match(g.css, /empty \(invalid\)/);
+});
+
+
+test("contentHash is stable and 8 hex chars", () => {
+    const a = contentHash(":root{--bs-primary: #000;}");
+    const b = contentHash(":root{--bs-primary: #000;}");
+    assert.equal(a, b);
+    assert.match(a, /^[0-9a-f]{8}$/);
+});
diff --git a/test/deepOverlay.test.js b/test/deepOverlay.test.js
new file mode 100644
index 0000000..c3464a1
--- /dev/null
+++ b/test/deepOverlay.test.js
@@ -0,0 +1,72 @@
+const { test } = require("node:test");
+const assert = require("node:assert");
+const { colorContrast, shade, tint, toHex, parseHexColor } = require("../lib/bootstrapColor");
+const { solidButtonRule, outlineButtonRule, emitButtonRules } = require("../lib/deepOverlay");
+
+// Ground truth extracted from the vendored Bootstrap 5.3.3 compiled CSS:
+// each variant -> { bg, color, hoverBg, activeBorder }.
+const ORACLES = {
+    primary:   { bg: "#0d6efd", color: "#ffffff", hoverBg: "#0b5ed7", activeBorder: "#0a53be" },
+    secondary: { bg: "#6c757d", color: "#ffffff", hoverBg: "#5c636a", activeBorder: "#51585e" },
+    success:   { bg: "#198754", color: "#ffffff", hoverBg: "#157347", activeBorder: "#13653f" },
+    info:      { bg: "#0dcaf0", color: "#000000", hoverBg: "#31d2f2", activeBorder: "#25cff2" },
+    warning:   { bg: "#ffc107", color: "#000000", hoverBg: "#ffca2c", activeBorder: "#ffc720" },
+    danger:    { bg: "#dc3545", color: "#ffffff", hoverBg: "#bb2d3b", activeBorder: "#a52834" },
+    light:     { bg: "#f8f9fa", color: "#000000", hoverBg: "#d3d4d5", activeBorder: "#babbbc" },
+    dark:      { bg: "#212529", color: "#ffffff", hoverBg: "#424649", activeBorder: "#373b3e" },
+};
+
+
+test("colorContrast matches Bootstrap's --bs-btn-color for all 8 variants", () => {
+    for (const [name, o] of Object.entries(ORACLES)) {
+        assert.equal(colorContrast(o.bg), o.color, `${name} (${o.bg})`);
+    }
+});
+
+
+test("solid .btn-<variant> rules match Bootstrap's compiled hover/active colors", () => {
+    for (const [name, o] of Object.entries(ORACLES)) {
+        const rule = solidButtonRule(name, o.bg);
+        assert.ok(rule.includes(`--bs-btn-hover-bg:${o.hoverBg};`), `${name} hover-bg -> ${o.hoverBg}\n${rule}`);
+        assert.ok(rule.includes(`--bs-btn-active-border-color:${o.activeBorder};`), `${name} active-border -> ${o.activeBorder}`);
+        assert.ok(rule.includes(`--bs-btn-bg:${o.bg};`), `${name} bg`);
+    }
+});
+
+
+test("primary focus-shadow-rgb matches Bootstrap (49, 132, 253)", () => {
+    assert.ok(solidButtonRule("primary", "#0d6efd").includes("--bs-btn-focus-shadow-rgb:49, 132, 253;"));
+    assert.ok(solidButtonRule("warning", "#ffc107").includes("--bs-btn-focus-shadow-rgb:217, 164, 6;"));
+});
+
+
+test("shade/tint match Bootstrap's Sass math", () => {
+    assert.equal(toHex(shade(parseHexColor("#0d6efd"), 15)), "#0b5ed7");
+    assert.equal(toHex(tint(parseHexColor("#ffc107"), 15)), "#ffca2c");
+    assert.equal(toHex(shade(parseHexColor("#f8f9fa"), 25)), "#babbbc"); // light force-shade
+    assert.equal(toHex(tint(parseHexColor("#212529"), 10)), "#373b3e");  // dark force-tint
+});
+
+
+test("outline button inverts to the variant color", () => {
+    const r = outlineButtonRule("primary", "#0d6efd");
+    assert.ok(r.includes("--bs-btn-color:#0d6efd;"));
+    assert.ok(r.includes("--bs-btn-hover-bg:#0d6efd;"));
+    assert.ok(r.includes("--bs-btn-disabled-bg:transparent;"));
+});
+
+
+test("a recolored primary produces a recolored button (the whole point)", () => {
+    const css = emitButtonRules({ primary: "#e83e8c" });
+    assert.match(css, /\.btn-primary\{[^}]*--bs-btn-bg:#e83e8c;/);
+    // #e83e8c gets BLACK text via color-contrast -> tint mode -> hover LIGHTENS:
+    assert.match(css, /--bs-btn-hover-bg:#eb5b9d;/);   // tint(#e83e8c,15%)
+    assert.match(css, /--bs-btn-color:#000000;/);      // contrast picks dark text
+});
+
+
+test("non-hex variant colors are skipped (no throw)", () => {
+    const css = emitButtonRules({ primary: "var(--x)", success: "#198754" });
+    assert.doesNotMatch(css, /\.btn-primary\{/);
+    assert.match(css, /\.btn-success\{/);
+});
diff --git a/test/integration.js b/test/integration.js
new file mode 100644
index 0000000..99e81f6
--- /dev/null
+++ b/test/integration.js
@@ -0,0 +1,219 @@
+// In-process integration smoke test against a REAL Saltcorn DB (not the unit
+// suite -- needs @saltcorn + an initialized DB, so it is NOT a *.test.js file).
+//
+//   ./test/runIntegration.sh        (self-contained: throwaway DB + NODE_PATH)
+//
+// Registers theme-builder by location (runs the real onLoad -> Table.create),
+// then drives the actual apiHandlers with mock req/res through the full Phase-1
+// lifecycle. Exits non-zero on the first failure.
+
+const path = require("path");
+const db = require("@saltcorn/data/db");
+const { getState } = require("@saltcorn/data/db/state");
+const Plugin = require("@saltcorn/data/models/plugin");
+const Table = require("@saltcorn/data/models/table");
+
+const PLUGIN_DIR = path.resolve(__dirname, "..");
+const { PLUGIN_NAME, THEME_TABLE } = require("../lib/constants");
+
+let failures = 0;
+
+
+function ok(label, cond, detail) {
+    const tag = cond ? "PASS" : "FAIL";
+    if (!cond) failures += 1;
+    console.log(`  [${tag}] ${label}${detail ? "  -- " + detail : ""}`);
+}
+
+
+function mkRes() {
+    const r = { statusCode: 200, headers: {}, body: undefined };
+    r.status = (c) => { r.statusCode = c; return r; };
+    r.json = (o) => { r.body = o; r._json = o; return r; };
+    r.send = (s) => { r.body = s; r._sent = s; return r; };
+    r.set = (k, v) => { if (k && typeof k === "object") Object.assign(r.headers, k); else r.headers[String(k).toLowerCase()] = v; return r; };
+    r.get = (k) => r.headers[String(k).toLowerCase()];
+    r.redirect = (u) => { r._redirect = u; return r; };
+    r.end = () => { r._ended = true; return r; };
+    return r;
+}
+
+
+function mkReq(over) {
+    return Object.assign({
+        user: { role_id: 1, tenant: db.getTenantSchema(), email: "admin@test" },
+        params: {}, query: {}, body: {}, headers: {}, xhr: true,
+        path: "/theme-builder/api/x", originalUrl: "/theme-builder/api/x",
+        get: () => undefined, csrfToken: () => "testcsrf",
+    }, over);
+}
+
+
+async function step(label, fn) {
+    try {
+        await fn();
+    } catch (e) {
+        failures += 1;
+        console.log(`  [FAIL] ${label} THREW -- ${e && (e.stack || e.message)}`);
+    }
+}
+
+
+async function main() {
+    console.log(`DB = ${process.env.SQLITE_FILEPATH}`);
+
+    // --- bootstrap state + register the plugin by location (runs onLoad) ---
+    await Plugin.loadAllPlugins();
+    const plugin = new Plugin({ name: PLUGIN_NAME, source: "local", location: PLUGIN_DIR, configuration: {} });
+    await Plugin.loadAndSaveNewPlugin(plugin, true, false);
+    console.log("registered theme-builder; cfg =", JSON.stringify(getState().plugin_cfgs[PLUGIN_NAME] || {}));
+
+    const h = require("../lib/apiHandlers");
+    const liveCfg = () => getState().plugin_cfgs[PLUGIN_NAME] || {};
+
+    console.log("\n# onLoad / table");
+    await step("ensureTable created the themes Table", async () => {
+        const t = Table.findOne({ name: THEME_TABLE });
+        ok("Table registered in _sc_tables", !!t, t ? `id=${t.id}` : "missing");
+    });
+
+    console.log("\n# GET /api/state");
+    let createdId;
+    await step("buildState lists builtins", async () => {
+        const res = mkRes();
+        await h.getState_(mkReq(), res);
+        const themes = res.body && res.body.themes;
+        ok("state returns themes array", Array.isArray(themes), `count=${themes && themes.length}`);
+        ok("builtins present (>=3)", themes && themes.filter((x) => x.builtin).length >= 3);
+    });
+
+    console.log("\n# create -> save -> activate");
+    await step("create a theme", async () => {
+        const res = mkRes();
+        await h.createTheme(mkReq({ body: { name: "My Theme" } }), res);
+        ok("create returns a theme with uuid id + version 1", !!(res.body && res.body.theme && res.body.theme.id && res.body.theme.version === 1), JSON.stringify(res.body && res.body.theme));
+        createdId = res.body && res.body.theme && res.body.theme.id;
+    });
+
+    await step("save tokens (CAS on version)", async () => {
+        const res = mkRes();
+        const tokens = { $tokensVersion: 1, colors: { primary: "#abcdef" } };
+        await h.saveTheme(mkReq({ params: { id: createdId }, body: { tokens, baseVersion: 1 } }), res);
+        ok("save bumps version to 2", !!(res.body && res.body.theme && res.body.theme.version === 2), JSON.stringify(res.body && (res.body.theme || res.body.error)));
+    });
+
+    await step("stale save -> 409 version_conflict", async () => {
+        const res = mkRes();
+        await h.saveTheme(mkReq({ params: { id: createdId }, body: { tokens: { colors: {} }, baseVersion: 1 } }), res);
+        ok("stale baseVersion rejected with 409", res.statusCode === 409 && res.body.error && res.body.error.code === "version_conflict", `status=${res.statusCode}`);
+    });
+
+    await step("activate the theme (the only live-mutating op)", async () => {
+        const res = mkRes();
+        await h.activateTheme(mkReq({ params: { id: createdId } }), res);
+        ok("activate ok + pointer set", !!(res.body && res.body.ok && res.body.activeThemeId === createdId), JSON.stringify(res.body));
+        ok("activeThemeId persisted to cfg", liveCfg().activeThemeId === createdId, `cfg.activeThemeId=${liveCfg().activeThemeId}`);
+        ok("activeHash written", !!liveCfg().activeHash, `hash=${liveCfg().activeHash}`);
+    });
+
+    console.log("\n# GET /theme.css (public)");
+    await step("serve active overlay CSS", async () => {
+        const res = mkRes();
+        await h.getThemeCss(mkReq({ query: {}, user: undefined }), res, liveCfg());
+        const css = res.body || "";
+        ok("returns text/css", (res.get("content-type") || "").includes("text/css"));
+        ok("css contains the saved --bs-primary", css.includes("--bs-primary: #abcdef;"), css.slice(0, 80));
+        ok("deep overlay recolors buttons", css.includes(".btn-primary{") && css.includes("--bs-btn-bg:#abcdef;"));
+        ok("braces balanced", (css.match(/{/g) || []).length === (css.match(/}/g) || []).length);
+    });
+
+    console.log("\n# export -> import");
+    let exportedJson;
+    await step("export the theme", async () => {
+        const res = mkRes();
+        await h.exportTheme(mkReq({ params: { id: createdId } }), res);
+        const raw = typeof res.body === "string" ? res.body : JSON.stringify(res.body);
+        exportedJson = raw;
+        const env = JSON.parse(raw);
+        ok("envelope has $schema + tokens", env.$schema === "saltcorn-theme" && !!env.tokens, env.$schema);
+        ok("Content-Disposition attachment set", (res.get("content-disposition") || "").includes("attachment"));
+    });
+
+    await step("import the exported envelope -> fresh id", async () => {
+        const res = mkRes();
+        await h.importTheme(mkReq({ body: JSON.parse(exportedJson) }), res);
+        ok("import creates a new theme", !!(res.body && res.body.theme && res.body.theme.id && res.body.theme.id !== createdId), JSON.stringify(res.body && (res.body.theme || res.body.error)));
+    });
+
+    console.log("\n# activate a BUILTIN (seam fix)");
+    await step("activate builtin:darkly", async () => {
+        const res = mkRes();
+        await h.activateTheme(mkReq({ params: { id: "builtin:darkly" } }), res);
+        ok("builtin activate ok", !!(res.body && res.body.ok), JSON.stringify(res.body));
+        const cssRes = mkRes();
+        await h.getThemeCss(mkReq({ query: {}, user: undefined }), cssRes, liveCfg());
+        ok("builtin CSS served (darkly primary #375a7f)", String(cssRes.body || "").includes("--bs-primary: #375a7f;"), String(cssRes.body || "").slice(0, 80));
+    });
+
+    console.log("\n# preview-css (editor WYSIWYG, same compiler as production)");
+    await step("preview-css compiles draft tokens incl. deep button overlay", async () => {
+        const res = mkRes();
+        await h.previewCss(mkReq({ body: { tokens: { colors: { primary: "#e83e8c" } } } }), res);
+        const css = res.body || "";
+        ok("returns text/css no-store", (res.get("content-type") || "").includes("text/css") && res.get("cache-control") === "no-store");
+        ok("preview recolors .btn-primary to draft color", css.includes(".btn-primary{") && css.includes("--bs-btn-bg:#e83e8c;"));
+    });
+
+    console.log("\n# LAYOUT MODE: enable -> register as layout -> wrap() renders the page");
+    const activePointer = require("../lib/activePointer");
+    const cfgReaders = require("../lib/cfgReaders");
+    const { getPreset } = require("../lib/layoutTree");
+    let p2Id;
+
+    await step("enable layout mode registers theme-builder as a layout", async () => {
+        await activePointer.setActivePointer({ layoutMode: true });
+        ok("cfg.layoutMode is true", liveCfg().layoutMode === true);
+        ok("registered in getState().layouts", !!getState().layouts[PLUGIN_NAME]);
+    });
+
+    await step("create + save a theme with a sidebar layout tree, then activate", async () => {
+        let res = mkRes();
+        await h.createTheme(mkReq({ body: { name: "P2 Theme" } }), res);
+        p2Id = res.body.theme.id;
+        res = mkRes();
+        await h.saveTheme(mkReq({ params: { id: p2Id }, body: { tokens: { colors: { primary: "#112233" } }, layoutTree: getPreset("sidebar"), baseVersion: 1 } }), res);
+        ok("save persisted layoutTree", !!(res.body.theme && res.body.theme.layoutTree), JSON.stringify(res.body.theme && res.body.theme.layoutTree ? res.body.theme.layoutTree.type : res.body.error));
+        res = mkRes();
+        await h.activateTheme(mkReq({ params: { id: p2Id } }), res);
+        ok("activate (layout mode) persisted activeLayoutTree", !!liveCfg().activeLayoutTree, liveCfg().activeLayoutTree && liveCfg().activeLayoutTree.type);
+    });
+
+    await step("layout(cfg).wrap() renders the full themed document", async () => {
+        const L = require("../lib/layout").layout(liveCfg());
+        ok("layout(cfg) returns a PluginLayout", !!(L && typeof L.wrap === "function"));
+        const html = L.wrap({
+            title: "Home", body: "<p id='pg'>page</p>", brand: { name: "Acme" },
+            menu: [{ items: [{ label: "Home", link: "/" }] }], alerts: [{ type: "success", msg: "ok" }],
+            headers: [], role: 1, currentUrl: "/",
+        });
+        ok("links vendored Bootstrap", html.includes("/themeBootstrap.min.css"));
+        ok("links the theme overlay css", html.includes("/theme-builder/theme.css?v="));
+        ok("renders the layout tree (tb-root + sidebar)", html.includes("id=\"tb-root\"") && html.includes("tb-sidebar"));
+        ok("injects the page body + brand", html.includes("id='pg'") && html.includes("Acme"));
+        ok("angle brackets balanced", (html.match(/</g) || []).length === (html.match(/>/g) || []).length);
+    });
+
+    await step("Phase-2 overlay header is suppressed for theme-builder-served requests", async () => {
+        const req = mkReq({ user: { role_id: 1, tenant: db.getTenantSchema() } });
+        const rendersTB = cfgReaders.requestRendersViaThemeBuilder(req);
+        const hdrs = require("../lib/headers").headers(liveCfg());
+        ok("overlay only_if returns boolean", typeof hdrs[0].only_if(req) === "boolean");
+        ok("overlay suppressed exactly when rendered via theme-builder", hdrs[0].only_if(req) === !rendersTB, `rendersTB=${rendersTB}`);
+    });
+
+    console.log(`\n==== ${failures === 0 ? "ALL GREEN" : failures + " FAILURE(S)"} ====`);
+    process.exit(failures === 0 ? 0 : 1);
+}
+
+
+main().catch((e) => { console.error("HARNESS CRASH:", e && (e.stack || e.message)); process.exit(2); });
diff --git a/test/layoutTree.test.js b/test/layoutTree.test.js
new file mode 100644
index 0000000..bbab544
--- /dev/null
+++ b/test/layoutTree.test.js
@@ -0,0 +1,48 @@
+const { test } = require("node:test");
+const assert = require("node:assert");
+const {
+    PRESETS, DEFAULT_LAYOUT_TREE, listPresets, getPreset,
+    validateLayoutTree, normalizeLayoutTree,
+} = require("../lib/layoutTree");
+
+
+test("built-in presets are valid layout trees", () => {
+    assert.ok(PRESETS.length >= 2);
+    for (const p of PRESETS) {
+        const v = validateLayoutTree(p.tree);
+        assert.ok(v.ok, `${p.id} valid: ${v.errors.join("; ")}`);
+    }
+});
+
+
+test("listPresets / getPreset", () => {
+    const ids = listPresets().map((p) => p.id);
+    assert.ok(ids.includes("topnav") && ids.includes("sidebar"));
+    assert.equal(getPreset("topnav").type, "Root");
+    assert.equal(getPreset("nope"), null);
+});
+
+
+test("validateLayoutTree requires Root + exactly one Content", () => {
+    assert.equal(validateLayoutTree({ type: "Navbar" }).ok, false);
+    const noContent = { type: "Root", children: [{ type: "Navbar" }] };
+    assert.equal(validateLayoutTree(noContent).ok, false);
+    const twoContent = { type: "Root", children: [{ type: "Content" }, { type: "Content" }] };
+    assert.equal(validateLayoutTree(twoContent).ok, false);
+    assert.equal(validateLayoutTree({ type: "Root", children: [{ type: "Content" }] }).ok, true);
+});
+
+
+test("validateLayoutTree rejects unknown node types", () => {
+    const v = validateLayoutTree({ type: "Root", children: [{ type: "Content" }, { type: "Evil" }] });
+    assert.equal(v.ok, false);
+    assert.ok(v.errors.some((e) => e.includes("Evil")));
+});
+
+
+test("normalizeLayoutTree falls back to default for junk", () => {
+    assert.deepEqual(normalizeLayoutTree(null), DEFAULT_LAYOUT_TREE);
+    assert.deepEqual(normalizeLayoutTree({ type: "Bad" }), DEFAULT_LAYOUT_TREE);
+    const good = getPreset("sidebar");
+    assert.deepEqual(normalizeLayoutTree(good), good);   // valid tree preserved
+});
diff --git a/test/portability.test.js b/test/portability.test.js
new file mode 100644
index 0000000..e2cee5c
--- /dev/null
+++ b/test/portability.test.js
@@ -0,0 +1,61 @@
+const { test } = require("node:test");
+const assert = require("node:assert");
+const { buildEnvelope, parseEnvelope, upcastEnvelope } = require("../lib/portability");
+const { normalizeTokens } = require("../lib/themeSchema");
+const { SCHEMA_ID, FORMAT_VERSION, ENGINE } = require("../lib/constants");
+
+
+test("buildEnvelope produces a self-describing, id-less envelope", () => {
+    const env = buildEnvelope({ name: "Solar", engine: ENGINE, tokens: { colors: { primary: "#111" } } });
+    assert.equal(env.$schema, SCHEMA_ID);
+    assert.equal(env.formatVersion, FORMAT_VERSION);
+    assert.equal(env.name, "Solar");
+    assert.ok(!("id" in env) && !("version" in env));
+});
+
+
+test("export -> import round-trips", async () => {
+    const env = buildEnvelope({ name: "Solar", engine: ENGINE, tokens: normalizeTokens({ colors: { primary: "#abcdef" } }) });
+    const res = await parseEnvelope(JSON.stringify(env));
+    assert.equal(res.ok, true);
+    assert.equal(res.draft.name, "Solar");
+    assert.equal(res.draft.tokens.colors.primary, "#abcdef");
+});
+
+
+test("import rejects a non-saltcorn file", async () => {
+    const res = await parseEnvelope(JSON.stringify({ hello: "world" }));
+    assert.equal(res.ok, false);
+    assert.match(res.error, /Not a saltcorn-theme/);
+});
+
+
+test("import rejects invalid JSON and oversized files", async () => {
+    assert.equal((await parseEnvelope("{not json")).ok, false);
+    const huge = JSON.stringify({ $schema: SCHEMA_ID, formatVersion: 1, x: "y".repeat(3 * 1024 * 1024) });
+    const res = await parseEnvelope(huge);
+    assert.equal(res.ok, false);
+    assert.match(res.error, /size limit/);
+});
+
+
+test("upcastEnvelope lifts a formatVersion-0 (vars) export to current", () => {
+    const up = upcastEnvelope({ $schema: SCHEMA_ID, name: "Old", vars: { colors: { primary: "#222" } } });
+    assert.equal(up.formatVersion, FORMAT_VERSION);
+    assert.equal(up.tokens.colors.primary, "#222");
+});
+
+
+test("import upcasts a legacy envelope end-to-end", async () => {
+    const legacy = JSON.stringify({ $schema: SCHEMA_ID, name: "Legacy", vars: { colors: { primary: "#333" } } });
+    const res = await parseEnvelope(legacy);
+    assert.equal(res.ok, true);
+    assert.equal(res.draft.tokens.colors.primary, "#333");
+});
+
+
+test("import rejects an unsupported engine", async () => {
+    const res = await parseEnvelope(JSON.stringify({ $schema: SCHEMA_ID, formatVersion: 1, name: "X", engine: "tailwind", tokens: {} }));
+    assert.equal(res.ok, false);
+    assert.match(res.error, /Unsupported engine/);
+});
diff --git a/test/renderTree.test.js b/test/renderTree.test.js
new file mode 100644
index 0000000..42e4714
--- /dev/null
+++ b/test/renderTree.test.js
@@ -0,0 +1,66 @@
+const { test } = require("node:test");
+const assert = require("node:assert");
+const { renderTreeToHtml, renderMenu, esc } = require("../lib/renderTree");
+const { getPreset } = require("../lib/layoutTree");
+
+const CTX = {
+    title: "T",
+    body: "<p id='the-body'>BODY</p>",
+    brand: { name: "Acme", logo: null },
+    menu: [{ items: [{ label: "Home", link: "/" }, { label: "Views", link: "/viewedit", subitems: [{ label: "New", link: "/viewedit/new" }] }] }],
+    alerts: [{ type: "success", msg: "saved" }],
+    currentUrl: "/",
+};
+
+
+function balanced(html) {
+    // crude tag-name-agnostic sanity: angle brackets balance
+    return (html.match(/</g) || []).length === (html.match(/>/g) || []).length;
+}
+
+
+test("topnav preset renders navbar + body slot + footer", () => {
+    const html = renderTreeToHtml(getPreset("topnav"), CTX);
+    assert.match(html, /<nav class="navbar/);
+    assert.match(html, /id='the-body'/, "body injected into Content slot");
+    assert.match(html, /navbar-brand[^>]*>.*Acme/s, "brand rendered");
+    assert.match(html, /<footer/);
+    assert.ok(balanced(html));
+});
+
+
+test("sidebar preset renders an aside + body", () => {
+    const html = renderTreeToHtml(getPreset("sidebar"), CTX);
+    assert.match(html, /<aside class="tb-sidebar/);
+    assert.match(html, /id='the-body'/);
+    assert.ok(balanced(html));
+});
+
+
+test("body + alerts always emitted even if tree omits the slots", () => {
+    const bare = { type: "Root", children: [{ type: "Content" }] }; // no AlertsSlot
+    const html = renderTreeToHtml(bare, CTX);
+    assert.match(html, /id='the-body'/);
+    assert.match(html, /alert-success/, "alerts appended when no AlertsSlot");
+});
+
+
+test("junk tree falls back to default (still renders body)", () => {
+    const html = renderTreeToHtml({ type: "Nope" }, CTX);
+    assert.match(html, /id='the-body'/);
+});
+
+
+test("menu renders links + a dropdown for subitems; marks active", () => {
+    const html = renderMenu(CTX.menu, "navbar", CTX);
+    assert.match(html, /href="\/"[^>]*>.*Home/s);
+    assert.match(html, /dropdown/);
+    assert.match(html, /nav-link active/, "current url marked active");
+});
+
+
+test("esc escapes text but body HTML is passed through", () => {
+    assert.equal(esc(`<b>&"'`), "&lt;b&gt;&amp;&quot;&#39;");
+    const html = renderTreeToHtml(getPreset("topnav"), { ...CTX, body: "<script>x</script>" });
+    assert.match(html, /<script>x<\/script>/, "trusted server body not escaped");
+});
diff --git a/test/runIntegration.sh b/test/runIntegration.sh
new file mode 100755
index 0000000..ae04ce3
--- /dev/null
+++ b/test/runIntegration.sh
@@ -0,0 +1,30 @@
+#!/usr/bin/env bash
+# Reproducible, SELF-CONTAINED in-process integration test for theme-builder.
+# Spins up a throwaway SQLite DB under ./.test-state, runs Saltcorn migrations,
+# then drives the real apiHandlers via test/integration.js. Touches no other
+# instance and no shared plugins folder.
+#
+#   ./test/runIntegration.sh
+#
+# @saltcorn/* are host-provided (this plugin declares no deps, per the
+# dev-deploy/idp convention), so the harness gets them via NODE_PATH pointing at
+# the upstream checkout's node_modules.
+set -e
+HERE="$(cd "$(dirname "$0")" && pwd)"
+PLUGIN="$(dirname "$HERE")"
+REPO="$(dirname "$PLUGIN")"
+SC_BIN="$REPO/saltcorn/packages/saltcorn-cli/bin/saltcorn"
+STATE="$PLUGIN/.test-state"
+
+mkdir -p "$STATE/files"
+export SQLITE_FILEPATH="$STATE/test.sqlite"
+export SALTCORN_FILE_STORE="$STATE/files"
+export SALTCORN_SESSION_SECRET="theme-builder-integration-test-secret"
+export SALTCORN_NWORKERS=1
+export NODE_PATH="$REPO/saltcorn/node_modules"
+
+rm -f "$SQLITE_FILEPATH"
+rm -rf "/tmp/$USER/saltcorn-tmp/temp_install/theme-builder" 2>/dev/null || true
+
+node "$SC_BIN" reset-schema --force >/dev/null
+exec node "$HERE/integration.js"
diff --git a/test/sanitize.test.js b/test/sanitize.test.js
new file mode 100644
index 0000000..9a13797
--- /dev/null
+++ b/test/sanitize.test.js
@@ -0,0 +1,34 @@
+const { test } = require("node:test");
+const assert = require("node:assert");
+const { sanitizeValue, sanitizeSelector } = require("../lib/sanitize");
+
+
+test("sanitizeValue passes ordinary CSS values", () => {
+    assert.equal(sanitizeValue("#ff0000"), "#ff0000");
+    assert.equal(sanitizeValue("1.5rem"), "1.5rem");
+    assert.equal(sanitizeValue("'Lato', sans-serif"), "'Lato', sans-serif");
+});
+
+
+test("sanitizeValue drops values that could escape their declaration", () => {
+    const w = [];
+    assert.equal(sanitizeValue("#fff}", w), null);          // closes :root{} early
+    assert.equal(sanitizeValue("red; }body{display:none", w), null);
+    assert.equal(sanitizeValue("red/* comment", w), null);
+    assert.equal(sanitizeValue("a</style>", w), null);
+    assert.ok(w.length >= 4, "each drop pushes a warning");
+});
+
+
+test("sanitizeValue drops over-length values and null", () => {
+    assert.equal(sanitizeValue(null), null);
+    assert.equal(sanitizeValue("x".repeat(5000)), null);
+});
+
+
+test("sanitizeSelector allows conservative selectors, drops breakouts", () => {
+    assert.equal(sanitizeSelector(".navbar"), ".navbar");
+    assert.equal(sanitizeSelector(".sidebar, #accordionSidebar"), ".sidebar, #accordionSidebar");
+    assert.equal(sanitizeSelector("a{color:red}"), null);
+    assert.equal(sanitizeSelector("x;y"), null);
+});
diff --git a/test/themeSchema.test.js b/test/themeSchema.test.js
new file mode 100644
index 0000000..cd17895
--- /dev/null
+++ b/test/themeSchema.test.js
@@ -0,0 +1,54 @@
+const { test } = require("node:test");
+const assert = require("node:assert");
+const {
+    DEFAULT_TOKENS, deepMerge, normalizeTokens, emptyTokens, tokensAreValid,
+} = require("../lib/themeSchema");
+
+
+test("normalizeTokens deep-merges a sparse theme over the defaults", () => {
+    const t = normalizeTokens({ colors: { primary: "#123456" } });
+    assert.equal(t.colors.primary, "#123456");           // override wins
+    assert.equal(t.colors.success, DEFAULT_TOKENS.colors.success); // default preserved
+    assert.equal(t.$tokensVersion, 1);
+});
+
+
+test("normalizeTokens never mutates the frozen DEFAULT_TOKENS", () => {
+    const before = DEFAULT_TOKENS.colors.primary;
+    const t = normalizeTokens({ colors: { primary: "#000000" } });
+    t.colors.primary = "#ffffff";
+    assert.equal(DEFAULT_TOKENS.colors.primary, before);
+});
+
+
+test("normalizeTokens tolerates junk input", () => {
+    assert.equal(normalizeTokens(null).$tokensVersion, 1);
+    assert.equal(normalizeTokens("nope").colors.primary, DEFAULT_TOKENS.colors.primary);
+});
+
+
+test("emptyTokens returns a mutable clone of the defaults", () => {
+    const e = emptyTokens();
+    e.colors.primary = "#abcdef";
+    assert.notEqual(DEFAULT_TOKENS.colors.primary, "#abcdef");
+});
+
+
+test("deepMerge replaces scalars and merges nested objects", () => {
+    const out = deepMerge({ a: 1, n: { x: 1, y: 2 } }, { a: 2, n: { y: 3 } });
+    assert.deepEqual(out, { a: 2, n: { x: 1, y: 3 } });
+});
+
+
+test("tokensAreValid accepts strings, rejects non-string leaves", () => {
+    assert.equal(tokensAreValid(normalizeTokens({})).ok, true);
+    const bad = tokensAreValid({ colors: { primary: 123 } });
+    assert.equal(bad.ok, false);
+    assert.ok(bad.errors.some((e) => e.includes("colors.primary")));
+});
+
+
+test("tokensAreValid rejects non-object input", () => {
+    assert.equal(tokensAreValid(null).ok, false);
+    assert.equal(tokensAreValid([]).ok, false);
+});