@velastack/cms 0.6.4 → 0.7.0

package/README.md

@@ -380,6 +380,131 @@ Rules every structured value follows (`core/structured.ts`):
 
 Iterates over a set of pages by route ID. Useful for index pages.
 
+## Forms
+
+`<CmsForm>` posts a form to a hosted form by `key` or to the template's own `action`. It does not care which: it renders a real `<form method="POST">`, so it works without JavaScript, and with JavaScript it posts in place through `use:enhance` and hands `children` the outcome.
+
+```svelte
+<script lang="ts">
+	import { CmsForm, CmsText } from '@velastack/cms';
+</script>
+
+<!-- Your own backend: fixed fields, editors change only the copy. -->
+<CmsForm action="?/contact" redirect="/thanks">
+	{#snippet children(form)}
+		<label
+			><CmsText name="contact.nameLabel" fallback="Name" /> <input name="name" required /></label
+		>
+		<label>
+			<CmsText name="contact.emailLabel" fallback="Email" />
+			<input name="email" type="email" required />
+		</label>
+		<button disabled={form.status === 'submitting'}>Send</button>
+		{#if form.status === 'success'}<p>Thanks, we'll be in touch.</p>{/if}
+		{#if form.status === 'failure'}<p>{form.message}</p>{/if}
+	{/snippet}
+</CmsForm>
+```
+
+- **Where it posts.** `action` wins when given: a route, or a SvelteKit action. Otherwise `key` names a hosted form, the forms a template's manifest declares: when the CMS endpoint is `…/v1/projects/<id>/cms`, the form posts to `…/v1/projects/<id>/forms/<key>`. Any other endpoint has no hosted forms and needs `action` (dev logs a warning).
+- **`children(form)`** gets `status` (`idle`, `submitting`, `success`, `failure`, `error`), the endpoint's or action's `message`, and the action's returned `data`. A successful post resets the form.
+- **Control fields.** `redirect` becomes `_redirect`: where a post without JavaScript lands, and where the form navigates after a successful enhanced post. Every form carries a hidden `_gotcha` honeypot, and a hosted form a load-time `_token`, fetched on mount, that marks its submissions verified. A same-app action receives these fields too and can ignore them.
+- In edit mode forms do not submit.
+
+### Editable fields: `<CmsFormFields>`
+
+Put `<CmsFormFields>` inside a form when editors should control the fields themselves: add, remove, reorder and retype them, and translate labels, placeholders and choices. The `field` snippet renders each one; without it, plain labelled inputs are rendered.
+
+```svelte
+<CmsForm key="contact">
+	{#snippet children(form)}
+		<CmsFormFields
+			name="contactFields"
+			fallback={[
+				{ name: 'name', label: 'Name', type: 'text', required: true },
+				{ name: 'email', label: 'Email', type: 'email', required: true },
+				{ name: 'message', label: 'Message', type: 'textarea' }
+			]}
+		>
+			{#snippet field(f)}
+				<label>
+					<span>{f.label}</span>
+					{#if f.type === 'textarea'}
+						<textarea name={f.name} required={f.required} placeholder={f.placeholder}></textarea>
+					{:else}
+						<input name={f.name} type={f.type} required={f.required} placeholder={f.placeholder} />
+					{/if}
+				</label>
+			{/snippet}
+		</CmsFormFields>
+		<button disabled={form.status === 'submitting'}>Send</button>
+	{/snippet}
+</CmsForm>
+```
+
+Types are `text`, `email`, `tel`, `number`, `date`, `textarea`, `select` (with `options`) and `checkbox`. A field's `name` is the key its answers are stored under and never follows a label edit: fallback fields carry their own, and a field an editor adds takes one from its first label (`Preferred date` → `preferred_date`). Since editors decide what is sent, pair `CmsFormFields` with a hosted form or an action that accepts any fields.
+
+### `<CmsWhatsAppForm>`
+
+The same form, but a submission opens a WhatsApp chat to the editor's number with the editor's message, the visitor's answers substituted for `{field}` placeholders. The answers are also posted to `key` or `action` in the background, so the lead is kept even if the visitor never sends the chat. Editors set the number and the message (translatable) from the pencil, which lists the placeholders the form's inputs provide.
+
+```svelte
+<CmsWhatsAppForm
+	key="booking"
+	name="whatsapp"
+	fallback={{ number: '+1 555 010 0199', message: "Hi, I'm {name}. A table for {guests}, please." }}
+>
+	{#snippet children(form)}
+		<label>Name <input name="name" required /></label>
+		<label>Guests <input name="guests" type="number" /></label>
+		<button>Chat on WhatsApp</button>
+		<noscript><a href={form.whatsappHref}>Message us on WhatsApp</a></noscript>
+	{/snippet}
+</CmsWhatsAppForm>
+```
+
+The chat opens in a new tab (this one, if the popup is blocked), and `redirect` then moves this tab on. Without JavaScript the form posts normally, so the answers are still stored; `form.whatsappHref` links to the number alone for a `<noscript>` fallback. `CmsFormFields` works inside it as in `CmsForm`.
+
+### `<CmsWhatsAppCart>` and `whatsappCart`
+
+A cart whose checkout is a WhatsApp chat. Visitors add items with `whatsappCart.add(...)`, kept in the browser. The checkout form asks for `name`, `phone` and an optional `note`, then opens a chat to the editor's number with the order as the message. It also records the order (reference, customer, lines, subtotal and message) to the hosted form `key`, so the order is kept even if the chat is never sent. Nothing is paid on the site: the business confirms and takes payment in the chat.
+
+```svelte
+<script lang="ts">
+	import { CmsWhatsAppCart, whatsappCart } from '@velastack/cms';
+</script>
+
+<button onclick={() => whatsappCart.add({ id: 'concha', name: 'Concha', price: 12 })}>
+	Add to order
+</button>
+
+<CmsWhatsAppCart key="order" name="whatsapp" scope="root">
+	{#snippet children({ cart, placed, formatPrice })}
+		{#if placed}
+			<p>Order {placed.ref} opened in WhatsApp.</p>
+			<a href={placed.href} target="_blank" rel="noopener">Open WhatsApp again</a>
+			<button type="button" onclick={() => cart.clear()}>Done</button>
+		{:else}
+			{#each cart.items as item (item.id)}
+				<p>{item.quantity} × {item.name}</p>
+			{/each}
+			{#if cart.subtotal !== undefined}<p>{formatPrice(cart.subtotal)}</p>{/if}
+			<label>Name <input name="name" required /></label>
+			<label>Phone <input name="phone" type="tel" required /></label>
+			<label>Note <textarea name="note"></textarea></label>
+			<button disabled={cart.count === 0}>Order on WhatsApp</button>
+		{/if}
+	{/snippet}
+</CmsWhatsAppCart>
+```
+
+- **One currency, the business's own.** Every price is in it, and the order and message are too. It comes from the `currency` site option (declare it in `createCms({ site })`), or the `currency` prop. `formatPrice` formats an amount in the page's language, so an English page shows MXN as `MX$5.50` and a Spanish one as `$5.50`.
+- **Prices are optional**, and written as an editor types them (`4.5`). `cart.subtotal` exists only when every item has a price; otherwise the business quotes the total in the chat.
+- **The message is the editor's**, set from the pencil like `CmsWhatsAppForm`'s, with `{ref}`, `{items}`, `{total}`, `{name}`, `{phone}` and `{note}`. Until one is set, a default lists the items, the total and the customer. Lines an empty placeholder leaves blank are dropped.
+- **After checkout**, `placed` holds the order's reference and chat link until `cart.clear()`. Adding an item starts the next order.
+- **The cart lives in the browser**, so the server renders it empty. `CmsWhatsAppCart` loads it on mount; a count shown elsewhere can call `whatsappCart.load()` in its own `onMount`.
+- Declare the `order` form in `template.json` `forms`, as for `contact`. The links, references and recording come from [`@velastack/whatsapp`](https://github.com/velastack/whatsapp).
+
 ## Custom CMS components
 
 VelaStack CMS discovers your custom or third-party CMS components by convention.

package/dist/components/admin-bar/admin-bar.css

@@ -1,5 +1,5 @@
 @layer properties, theme, base, components, utilities;
 @scope (.vela-admin-bar) {
 /*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
-@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial;--tw-ease:initial;--tw-animation-delay:0s;--tw-animation-direction:normal;--tw-animation-duration:initial;--tw-animation-fill-mode:none;--tw-animation-iteration-count:1;--tw-enter-blur:0;--tw-enter-opacity:1;--tw-enter-rotate:0;--tw-enter-scale:1;--tw-enter-translate-x:0;--tw-enter-translate-y:0;--tw-exit-blur:0;--tw-exit-opacity:1;--tw-exit-rotate:0;--tw-exit-scale:1;--tw-exit-translate-x:0;--tw-exit-translate-y:0}}}@layer theme{:scope{--vela-font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--vela-font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--vela-color-black:#000;--vela-color-white:#fff;--vela-spacing:.25rem;--vela-container-sm:24rem;--vela-text-xs:.75rem;--vela-text-xs--line-height:calc(1 / .75);--vela-text-sm:.875rem;--vela-text-sm--line-height:calc(1.25 / .875);--vela-font-weight-medium:500;--vela-font-weight-semibold:600;--vela-tracking-tight:-.025em;--vela-tracking-normal:0em;--vela-tracking-wider:.05em;--vela-tracking-widest:.1em;--vela-leading-snug:1.375;--vela-radius-2xl:1rem;--vela-radius-3xl:1.5rem;--vela-ease-in-out:cubic-bezier(.4, 0, .2, 1);--vela-animate-spin:spin 1s linear infinite;--vela-default-transition-duration:.15s;--vela-default-transition-timing-function:cubic-bezier(.4, 0, .2, 1)}}@layer base{:scope{--vela-background:oklch(14.5% 0 0);--vela-foreground:oklch(98.5% 0 0);--vela-card:oklch(20.5% 0 0);--vela-card-foreground:oklch(98.5% 0 0);--vela-popover:oklch(20.5% 0 0);--vela-popover-foreground:oklch(98.5% 0 0);--vela-primary:oklch(98.5% 0 0);--vela-primary-foreground:oklch(20.5% 0 0);--vela-secondary:oklch(26.9% 0 0);--vela-secondary-foreground:oklch(98.5% 0 0);--vela-muted:oklch(26.9% 0 0);--vela-muted-foreground:oklch(70.8% 0 0);--vela-accent:oklch(26.9% 0 0);--vela-accent-foreground:oklch(98.5% 0 0);--vela-destructive:oklch(70.4% .191 22.216);--vela-destructive-foreground:oklch(98.5% 0 0);--vela-border:oklch(100% 0 0/.1);--vela-input:oklch(100% 0 0/.15);--vela-ring:oklch(55.6% 0 0);--vela-radius:.5rem;--cms-bar-bg:#1f1f1f;--cms-bar-bg-hover:#2e2e2e;--cms-bar-divider:#3a3a3a;--cms-bar-text:#f5f5f5;--cms-bar-text-secondary:#a3a3a3;--cms-bar-text-tertiary:#737373;--cms-status-clean-dot:#5dcaa5;--cms-status-clean-text:#d4d4d4;--cms-status-warn-bg:#2a2416;--cms-status-warn-bg-hover:#3a2f1e;--cms-status-warn-text:#fac775;--cms-status-warn-dot:#ef9f27;--cms-status-edit-bg:#182338;--cms-status-edit-text:#85b7eb;--cms-status-edit-dot:#378add;--cms-sub-bar-bg:#2e2e2ebf;--cms-sub-bar-border:transparent;--cms-template-bg:#181818;--cms-template-accent-bg:#2a2740;--cms-template-accent-text:#afa9ec;--cms-status-error-bg:#2a1818;--cms-status-error-bg-hover:#3a1f1f;--cms-status-error-text:#f08a8a;--cms-status-error-text-hover:#ffb3b3;--cms-status-error-text-base:#e88a8a;--cms-status-error-border:#5a2a2a;--cms-status-success-bg:#162a1d;--cms-status-success-text:#7ed49a;--cms-accent:#534ab7}:scope[data-vela-theme=light]{--vela-background:oklch(100% 0 0);--vela-foreground:oklch(14.5% 0 0);--vela-card:oklch(100% 0 0);--vela-card-foreground:oklch(14.5% 0 0);--vela-popover:oklch(100% 0 0);--vela-popover-foreground:oklch(14.5% 0 0);--vela-primary:oklch(20.5% 0 0);--vela-primary-foreground:oklch(98.5% 0 0);--vela-secondary:oklch(97% 0 0);--vela-secondary-foreground:oklch(20.5% 0 0);--vela-muted:oklch(97% 0 0);--vela-muted-foreground:oklch(55.6% 0 0);--vela-accent:oklch(97% 0 0);--vela-accent-foreground:oklch(20.5% 0 0);--vela-destructive:oklch(57.7% .245 27.325);--vela-destructive-foreground:oklch(98.5% 0 0);--vela-border:oklch(0% 0 0/.1);--vela-input:oklch(0% 0 0/.15);--vela-ring:oklch(70.8% 0 0);--cms-bar-bg:#fff;--cms-bar-bg-hover:#f1f1f1;--cms-bar-divider:#e5e5e5;--cms-bar-text:#171717;--cms-bar-text-secondary:#525252;--cms-bar-text-tertiary:#a3a3a3;--cms-status-clean-dot:#16a34a;--cms-status-clean-text:#525252;--cms-status-warn-bg:#fff4dc;--cms-status-warn-bg-hover:#fce8c2;--cms-status-warn-text:#92400e;--cms-status-warn-dot:#d97706;--cms-status-edit-bg:#dbeafe;--cms-status-edit-text:#1e40af;--cms-status-edit-dot:#2563eb;--cms-sub-bar-bg:#f5f5f5d9;--cms-sub-bar-border:#e5e5e5;--cms-template-bg:#fafafa;--cms-template-accent-bg:#ece9ff;--cms-template-accent-text:#5b50c4;--cms-status-error-bg:#fee2e2;--cms-status-error-bg-hover:#fecaca;--cms-status-error-text:#b91c1c;--cms-status-error-text-hover:#7f1d1d;--cms-status-error-text-base:#dc2626;--cms-status-error-border:#fca5a5;--cms-status-success-bg:#dcfce7;--cms-status-success-text:#15803d;--cms-accent:#534ab7}:scope,:scope *,:scope :before,:scope :after{box-sizing:border-box;border-style:solid;border-width:0;border-color:var(--vela-border)}:scope button,:scope [type=button],:scope [type=submit],:scope [type=reset]{appearance:button;color:inherit;cursor:pointer;font:inherit;background-color:#0000;background-image:none;margin:0;padding:0}}@layer components;@layer utilities{.vela\:pointer-events-none{pointer-events:none}.vela\:sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.vela\:absolute{position:absolute}.vela\:fixed{position:fixed}.vela\:relative{position:relative}.vela\:inset-0{inset:0}.vela\:inset-x-0{inset-inline:0}.vela\:inset-y-0{inset-block:0}.vela\:end-2{inset-inline-end:calc(var(--vela-spacing) * 2)}.vela\:top-0{top:0}.vela\:top-1{top:var(--vela-spacing)}.vela\:top-1\/2{top:50%}.vela\:top-2{top:calc(var(--vela-spacing) * 2)}.vela\:top-3{top:calc(var(--vela-spacing) * 3)}.vela\:top-3\.5{top:calc(var(--vela-spacing) * 3.5)}.vela\:top-4{top:calc(var(--vela-spacing) * 4)}.vela\:top-10{top:calc(var(--vela-spacing) * 10)}.vela\:top-\[var\(--cms-panel-top\,72px\)\]{top:var(--cms-panel-top,72px)}.vela\:top-full{top:100%}.vela\:right-0{right:0}.vela\:right-1{right:var(--vela-spacing)}.vela\:right-2{right:calc(var(--vela-spacing) * 2)}.vela\:right-3{right:calc(var(--vela-spacing) * 3)}.vela\:bottom-0{bottom:0}.vela\:bottom-2{bottom:calc(var(--vela-spacing) * 2)}.vela\:bottom-4{bottom:calc(var(--vela-spacing) * 4)}.vela\:bottom-10{bottom:calc(var(--vela-spacing) * 10)}.vela\:left-0{left:0}.vela\:left-1\.5{left:calc(var(--vela-spacing) * 1.5)}.vela\:left-1\/2{left:50%}.vela\:left-2{left:calc(var(--vela-spacing) * 2)}.vela\:left-2\.5{left:calc(var(--vela-spacing) * 2.5)}.vela\:left-\[5px\]{left:5px}.vela\:isolate{isolation:isolate}.vela\:z-10{z-index:10}.vela\:z-30{z-index:30}.vela\:z-50{z-index:50}.vela\:z-\[9997\]{z-index:9997}.vela\:z-\[9998\]{z-index:9998}.vela\:z-\[9999\]{z-index:9999}.vela\:m-0{margin:0}.vela\:-mx-1{margin-inline:calc(var(--vela-spacing) * -1)}.vela\:mx-4{margin-inline:calc(var(--vela-spacing) * 4)}.vela\:mx-6{margin-inline:calc(var(--vela-spacing) * 6)}.vela\:my-1{margin-block:var(--vela-spacing)}.vela\:mt-0\.5{margin-top:calc(var(--vela-spacing) * .5)}.vela\:mt-1{margin-top:var(--vela-spacing)}.vela\:mt-1\.5{margin-top:calc(var(--vela-spacing) * 1.5)}.vela\:mt-2{margin-top:calc(var(--vela-spacing) * 2)}.vela\:mt-3{margin-top:calc(var(--vela-spacing) * 3)}.vela\:mt-auto{margin-top:auto}.vela\:mb-2{margin-bottom:calc(var(--vela-spacing) * 2)}.vela\:ml-2{margin-left:calc(var(--vela-spacing) * 2)}.vela\:ml-auto{margin-left:auto}.vela\:line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.vela\:block{display:block}.vela\:flex{display:flex}.vela\:grid{display:grid}.vela\:inline-flex{display:inline-flex}.vela\:aspect-\[1\.91\/1\]{aspect-ratio:1.91}.vela\:aspect-square{aspect-ratio:1}.vela\:size-3{width:calc(var(--vela-spacing) * 3);height:calc(var(--vela-spacing) * 3)}.vela\:size-3\.5{width:calc(var(--vela-spacing) * 3.5);height:calc(var(--vela-spacing) * 3.5)}.vela\:size-4{width:calc(var(--vela-spacing) * 4);height:calc(var(--vela-spacing) * 4)}.vela\:size-5{width:calc(var(--vela-spacing) * 5);height:calc(var(--vela-spacing) * 5)}.vela\:size-6{width:calc(var(--vela-spacing) * 6);height:calc(var(--vela-spacing) * 6)}.vela\:size-full{width:100%;height:100%}.vela\:h-\(--bits-select-anchor-height\){height:var(--bits-select-anchor-height)}.vela\:h-1\.5{height:calc(var(--vela-spacing) * 1.5)}.vela\:h-2{height:calc(var(--vela-spacing) * 2)}.vela\:h-3{height:calc(var(--vela-spacing) * 3)}.vela\:h-4{height:calc(var(--vela-spacing) * 4)}.vela\:h-5{height:calc(var(--vela-spacing) * 5)}.vela\:h-5\.5{height:calc(var(--vela-spacing) * 5.5)}.vela\:h-6{height:calc(var(--vela-spacing) * 6)}.vela\:h-7{height:calc(var(--vela-spacing) * 7)}.vela\:h-8{height:calc(var(--vela-spacing) * 8)}.vela\:h-9{height:calc(var(--vela-spacing) * 9)}.vela\:h-10{height:calc(var(--vela-spacing) * 10)}.vela\:h-12{height:calc(var(--vela-spacing) * 12)}.vela\:h-16{height:calc(var(--vela-spacing) * 16)}.vela\:h-\[11px\]{height:11px}.vela\:h-\[18px\]{height:18px}.vela\:h-auto{height:auto}.vela\:h-full{height:100%}.vela\:h-px{height:1px}.vela\:max-h-24{max-height:calc(var(--vela-spacing) * 24)}.vela\:max-h-\[40vh\]{max-height:40vh}.vela\:max-h-\[60vh\]{max-height:60vh}.vela\:max-h-\[85vh\]{max-height:85vh}.vela\:max-h-\[280px\]{max-height:280px}.vela\:max-h-\[calc\(100vh-var\(--cms-panel-top\,72px\)-1rem\)\]{max-height:calc(100vh - var(--cms-panel-top,72px) - 1rem)}.vela\:min-h-9{min-height:calc(var(--vela-spacing) * 9)}.vela\:min-h-\[56px\]{min-height:56px}.vela\:w-1\.5{width:calc(var(--vela-spacing) * 1.5)}.vela\:w-2{width:calc(var(--vela-spacing) * 2)}.vela\:w-3{width:calc(var(--vela-spacing) * 3)}.vela\:w-3\/4{width:75%}.vela\:w-4{width:calc(var(--vela-spacing) * 4)}.vela\:w-6{width:calc(var(--vela-spacing) * 6)}.vela\:w-7{width:calc(var(--vela-spacing) * 7)}.vela\:w-9{width:calc(var(--vela-spacing) * 9)}.vela\:w-12{width:calc(var(--vela-spacing) * 12)}.vela\:w-24{width:calc(var(--vela-spacing) * 24)}.vela\:w-64{width:calc(var(--vela-spacing) * 64)}.vela\:w-72{width:calc(var(--vela-spacing) * 72)}.vela\:w-80{width:calc(var(--vela-spacing) * 80)}.vela\:w-\[11px\]{width:11px}.vela\:w-\[420px\]{width:420px}.vela\:w-\[calc\(100\%-2rem\)\]{width:calc(100% - 2rem)}.vela\:w-auto{width:auto}.vela\:w-fit{width:fit-content}.vela\:w-full{width:100%}.vela\:w-px{width:1px}.vela\:max-w-\[28rem\]{max-width:28rem}.vela\:max-w-\[30rem\]{max-width:30rem}.vela\:max-w-\[34rem\]{max-width:34rem}.vela\:max-w-\[560px\]{max-width:560px}.vela\:max-w-\[calc\(100vw-2rem\)\]{max-width:calc(100vw - 2rem)}.vela\:max-w-sm{max-width:var(--vela-container-sm)}.vela\:min-w-\(--bits-select-anchor-width\){min-width:var(--bits-select-anchor-width)}.vela\:min-w-0{min-width:0}.vela\:min-w-5{min-width:calc(var(--vela-spacing) * 5)}.vela\:min-w-32{min-width:calc(var(--vela-spacing) * 32)}.vela\:min-w-36{min-width:calc(var(--vela-spacing) * 36)}.vela\:min-w-56{min-width:calc(var(--vela-spacing) * 56)}.vela\:min-w-\[18px\]{min-width:18px}.vela\:flex-1{flex:1}.vela\:shrink-0{flex-shrink:0}.vela\:origin-\(--bits-menubar-content-transform-origin\){transform-origin:var(--bits-menubar-content-transform-origin)}.vela\:-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.vela\:-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.vela\:animate-bar-pulse{animation:2.4s ease-in-out infinite bar-pulse}.vela\:animate-spin{animation:var(--vela-animate-spin)}.vela\:cursor-default{cursor:default}.vela\:cursor-pointer{cursor:pointer}.vela\:resize-y{resize:vertical}.vela\:scroll-my-1{scroll-margin-block:var(--vela-spacing)}.vela\:list-none{list-style-type:none}.vela\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.vela\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.vela\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.vela\:flex-col{flex-direction:column}.vela\:flex-wrap{flex-wrap:wrap}.vela\:items-baseline{align-items:baseline}.vela\:items-center{align-items:center}.vela\:items-end{align-items:flex-end}.vela\:items-start{align-items:flex-start}.vela\:justify-between{justify-content:space-between}.vela\:justify-center{justify-content:center}.vela\:justify-end{justify-content:flex-end}.vela\:gap-0{gap:0}.vela\:gap-0\.5{gap:calc(var(--vela-spacing) * .5)}.vela\:gap-1{gap:var(--vela-spacing)}.vela\:gap-1\.5{gap:calc(var(--vela-spacing) * 1.5)}.vela\:gap-2{gap:calc(var(--vela-spacing) * 2)}.vela\:gap-3{gap:calc(var(--vela-spacing) * 3)}.vela\:gap-4{gap:calc(var(--vela-spacing) * 4)}.vela\:gap-5{gap:calc(var(--vela-spacing) * 5)}.vela\:self-start{align-self:flex-start}.vela\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.vela\:overflow-hidden{overflow:hidden}.vela\:overflow-x-hidden{overflow-x:hidden}.vela\:overflow-y-auto{overflow-y:auto}.vela\:rounded{border-radius:.25rem}.vela\:rounded-2xl{border-radius:var(--vela-radius-2xl)}.vela\:rounded-\[4px\]{border-radius:4px}.vela\:rounded-full{border-radius:3.40282e38px}.vela\:rounded-lg{border-radius:var(--vela-radius)}.vela\:rounded-md{border-radius:calc(var(--vela-radius) - 2px)}.vela\:rounded-none{border-radius:0}.vela\:rounded-sm{border-radius:calc(var(--vela-radius) - 4px)}.vela\:rounded-xl{border-radius:calc(var(--vela-radius) + 4px)}.vela\:rounded-t-2xl{border-top-left-radius:var(--vela-radius-2xl);border-top-right-radius:var(--vela-radius-2xl)}.vela\:rounded-t-3xl{border-top-left-radius:var(--vela-radius-3xl);border-top-right-radius:var(--vela-radius-3xl)}.vela\:rounded-b-3xl{border-bottom-right-radius:var(--vela-radius-3xl);border-bottom-left-radius:var(--vela-radius-3xl)}.vela\:border{border-style:var(--tw-border-style);border-width:1px}.vela\:border-0{border-style:var(--tw-border-style);border-width:0}.vela\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.vela\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.vela\:border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.vela\:border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.vela\:border-\[\#e8eaed\]{border-color:#e8eaed}.vela\:border-\[var\(--cms-bar-divider\)\]{border-color:var(--cms-bar-divider)}.vela\:border-\[var\(--cms-status-error-border\)\]{border-color:var(--cms-status-error-border)}.vela\:border-\[var\(--cms-sub-bar-border\)\]{border-color:var(--cms-sub-bar-border)}.vela\:border-transparent{border-color:#0000}.vela\:bg-\[\#e8eaed\]{background-color:#e8eaed}.vela\:bg-\[\#f7f9fa\]{background-color:#f7f9fa}.vela\:bg-\[\#fafafa\]{background-color:#fafafa}.vela\:bg-\[var\(--cms-accent\)\]{background-color:var(--cms-accent)}.vela\:bg-\[var\(--cms-bar-bg-hover\)\]{background-color:var(--cms-bar-bg-hover)}.vela\:bg-\[var\(--cms-bar-divider\)\]{background-color:var(--cms-bar-divider)}.vela\:bg-\[var\(--cms-status-clean-dot\)\]{background-color:var(--cms-status-clean-dot)}.vela\:bg-\[var\(--cms-status-edit-bg\)\]{background-color:var(--cms-status-edit-bg)}.vela\:bg-\[var\(--cms-status-edit-dot\)\]{background-color:var(--cms-status-edit-dot)}.vela\:bg-\[var\(--cms-status-error-bg\)\]{background-color:var(--cms-status-error-bg)}.vela\:bg-\[var\(--cms-status-success-bg\)\]{background-color:var(--cms-status-success-bg)}.vela\:bg-\[var\(--cms-status-warn-bg\)\]{background-color:var(--cms-status-warn-bg)}.vela\:bg-\[var\(--cms-status-warn-dot\)\]{background-color:var(--cms-status-warn-dot)}.vela\:bg-\[var\(--cms-sub-bar-bg\)\]{background-color:var(--cms-sub-bar-bg)}.vela\:bg-\[var\(--cms-template-accent-bg\)\]{background-color:var(--cms-template-accent-bg)}.vela\:bg-\[var\(--cms-template-bg\)\]{background-color:var(--cms-template-bg)}.vela\:bg-bar-bg{background-color:var(--cms-bar-bg)}.vela\:bg-black\/35{background-color:var(--vela-color-black)}@supports (color:color-mix(in lab, red, red)){.vela\:bg-black\/35{background-color:color-mix(in oklab, var(--vela-color-black) 35%, transparent)}}.vela\:bg-black\/50{background-color:var(--vela-color-black)}@supports (color:color-mix(in lab, red, red)){.vela\:bg-black\/50{background-color:color-mix(in oklab, var(--vela-color-black) 50%, transparent)}}.vela\:bg-black\/55{background-color:var(--vela-color-black)}@supports (color:color-mix(in lab, red, red)){.vela\:bg-black\/55{background-color:color-mix(in oklab, var(--vela-color-black) 55%, transparent)}}.vela\:bg-black\/60{background-color:var(--vela-color-black)}@supports (color:color-mix(in lab, red, red)){.vela\:bg-black\/60{background-color:color-mix(in oklab, var(--vela-color-black) 60%, transparent)}}.vela\:bg-border{background-color:var(--vela-border)}.vela\:bg-destructive{background-color:var(--vela-destructive)}.vela\:bg-popover{background-color:var(--vela-popover)}.vela\:bg-primary{background-color:var(--vela-primary)}.vela\:bg-secondary{background-color:var(--vela-secondary)}.vela\:bg-transparent{background-color:#0000}.vela\:bg-white{background-color:var(--vela-color-white)}.vela\:object-contain{object-fit:contain}.vela\:object-cover{object-fit:cover}.vela\:p-0{padding:0}.vela\:p-0\.5{padding:calc(var(--vela-spacing) * .5)}.vela\:p-1{padding:var(--vela-spacing)}.vela\:p-1\.5{padding:calc(var(--vela-spacing) * 1.5)}.vela\:p-2{padding:calc(var(--vela-spacing) * 2)}.vela\:p-3{padding:calc(var(--vela-spacing) * 3)}.vela\:p-3\.5{padding:calc(var(--vela-spacing) * 3.5)}.vela\:p-\[3px\]{padding:3px}.vela\:px-1{padding-inline:var(--vela-spacing)}.vela\:px-1\.5{padding-inline:calc(var(--vela-spacing) * 1.5)}.vela\:px-2{padding-inline:calc(var(--vela-spacing) * 2)}.vela\:px-2\.5{padding-inline:calc(var(--vela-spacing) * 2.5)}.vela\:px-3{padding-inline:calc(var(--vela-spacing) * 3)}.vela\:px-3\.5{padding-inline:calc(var(--vela-spacing) * 3.5)}.vela\:px-4{padding-inline:calc(var(--vela-spacing) * 4)}.vela\:px-6{padding-inline:calc(var(--vela-spacing) * 6)}.vela\:px-8{padding-inline:calc(var(--vela-spacing) * 8)}.vela\:py-0\.5{padding-block:calc(var(--vela-spacing) * .5)}.vela\:py-1{padding-block:var(--vela-spacing)}.vela\:py-1\.5{padding-block:calc(var(--vela-spacing) * 1.5)}.vela\:py-2{padding-block:calc(var(--vela-spacing) * 2)}.vela\:py-2\.5{padding-block:calc(var(--vela-spacing) * 2.5)}.vela\:py-3{padding-block:calc(var(--vela-spacing) * 3)}.vela\:py-8{padding-block:calc(var(--vela-spacing) * 8)}.vela\:py-12{padding-block:calc(var(--vela-spacing) * 12)}.vela\:py-\[2px\]{padding-block:2px}.vela\:pt-1{padding-top:var(--vela-spacing)}.vela\:pt-2{padding-top:calc(var(--vela-spacing) * 2)}.vela\:pt-2\.5{padding-top:calc(var(--vela-spacing) * 2.5)}.vela\:pt-3{padding-top:calc(var(--vela-spacing) * 3)}.vela\:pt-3\.5{padding-top:calc(var(--vela-spacing) * 3.5)}.vela\:pt-4{padding-top:calc(var(--vela-spacing) * 4)}.vela\:pt-5{padding-top:calc(var(--vela-spacing) * 5)}.vela\:pr-1{padding-right:var(--vela-spacing)}.vela\:pr-1\.5{padding-right:calc(var(--vela-spacing) * 1.5)}.vela\:pr-2{padding-right:calc(var(--vela-spacing) * 2)}.vela\:pr-2\.5{padding-right:calc(var(--vela-spacing) * 2.5)}.vela\:pr-3{padding-right:calc(var(--vela-spacing) * 3)}.vela\:pr-7{padding-right:calc(var(--vela-spacing) * 7)}.vela\:pr-9{padding-right:calc(var(--vela-spacing) * 9)}.vela\:pb-1{padding-bottom:var(--vela-spacing)}.vela\:pb-1\.5{padding-bottom:calc(var(--vela-spacing) * 1.5)}.vela\:pb-2{padding-bottom:calc(var(--vela-spacing) * 2)}.vela\:pb-3{padding-bottom:calc(var(--vela-spacing) * 3)}.vela\:pb-4{padding-bottom:calc(var(--vela-spacing) * 4)}.vela\:pb-5{padding-bottom:calc(var(--vela-spacing) * 5)}.vela\:pl-0{padding-left:0}.vela\:pl-1{padding-left:var(--vela-spacing)}.vela\:pl-2{padding-left:calc(var(--vela-spacing) * 2)}.vela\:pl-2\.5{padding-left:calc(var(--vela-spacing) * 2.5)}.vela\:pl-6{padding-left:calc(var(--vela-spacing) * 6)}.vela\:pl-7{padding-left:calc(var(--vela-spacing) * 7)}.vela\:pl-8{padding-left:calc(var(--vela-spacing) * 8)}.vela\:text-center{text-align:center}.vela\:text-left{text-align:left}.vela\:font-mono{font-family:var(--vela-font-mono)}.vela\:font-sans{font-family:var(--vela-font-sans)}.vela\:text-sm{font-size:var(--vela-text-sm);line-height:var(--tw-leading,var(--vela-text-sm--line-height))}.vela\:text-xs{font-size:var(--vela-text-xs);line-height:var(--tw-leading,var(--vela-text-xs--line-height))}.vela\:text-\[10px\]{font-size:10px}.vela\:text-\[11px\]{font-size:11px}.vela\:text-\[12px\]{font-size:12px}.vela\:text-\[13px\]{font-size:13px}.vela\:text-\[14px\]{font-size:14px}.vela\:text-\[15px\]{font-size:15px}.vela\:text-\[18px\]{font-size:18px}.vela\:leading-none{--tw-leading:1;line-height:1}.vela\:leading-snug{--tw-leading:var(--vela-leading-snug);line-height:var(--vela-leading-snug)}.vela\:font-medium{--tw-font-weight:var(--vela-font-weight-medium);font-weight:var(--vela-font-weight-medium)}.vela\:font-semibold{--tw-font-weight:var(--vela-font-weight-semibold);font-weight:var(--vela-font-weight-semibold)}.vela\:tracking-normal{--tw-tracking:var(--vela-tracking-normal);letter-spacing:var(--vela-tracking-normal)}.vela\:tracking-tight{--tw-tracking:var(--vela-tracking-tight);letter-spacing:var(--vela-tracking-tight)}.vela\:tracking-wider{--tw-tracking:var(--vela-tracking-wider);letter-spacing:var(--vela-tracking-wider)}.vela\:tracking-widest{--tw-tracking:var(--vela-tracking-widest);letter-spacing:var(--vela-tracking-widest)}.vela\:whitespace-nowrap{white-space:nowrap}.vela\:text-\[\#0f1419\]{color:#0f1419}.vela\:text-\[\#1a0dab\]{color:#1a0dab}.vela\:text-\[\#4d5156\]{color:#4d5156}.vela\:text-\[\#5f6368\]{color:#5f6368}.vela\:text-\[\#202124\]{color:#202124}.vela\:text-\[\#536471\]{color:#536471}.vela\:text-\[var\(--cms-status-clean-dot\)\]{color:var(--cms-status-clean-dot)}.vela\:text-\[var\(--cms-status-clean-text\)\]{color:var(--cms-status-clean-text)}.vela\:text-\[var\(--cms-status-edit-text\)\]{color:var(--cms-status-edit-text)}.vela\:text-\[var\(--cms-status-error-text\)\]{color:var(--cms-status-error-text)}.vela\:text-\[var\(--cms-status-error-text-base\)\]{color:var(--cms-status-error-text-base)}.vela\:text-\[var\(--cms-status-success-text\)\]{color:var(--cms-status-success-text)}.vela\:text-\[var\(--cms-status-warn-text\)\]{color:var(--cms-status-warn-text)}.vela\:text-\[var\(--cms-template-accent-text\)\]{color:var(--cms-template-accent-text)}.vela\:text-bar-text{color:var(--cms-bar-text)}.vela\:text-bar-text-secondary{color:var(--cms-bar-text-secondary)}.vela\:text-bar-text-tertiary{color:var(--cms-bar-text-tertiary)}.vela\:text-current{color:currentColor}.vela\:text-destructive{color:var(--vela-destructive)}.vela\:text-destructive-foreground{color:var(--vela-destructive-foreground)}.vela\:text-muted-foreground{color:var(--vela-muted-foreground)}.vela\:text-popover-foreground{color:var(--vela-popover-foreground)}.vela\:text-primary{color:var(--vela-primary)}.vela\:text-primary-foreground{color:var(--vela-primary-foreground)}.vela\:text-secondary-foreground{color:var(--vela-secondary-foreground)}.vela\:text-white{color:var(--vela-color-white)}.vela\:capitalize{text-transform:capitalize}.vela\:uppercase{text-transform:uppercase}.vela\:tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.vela\:underline-offset-4{text-underline-offset:4px}.vela\:opacity-0{opacity:0}.vela\:opacity-50{opacity:.5}.vela\:shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:shadow-\[0_8px_24px_rgba\(0\,0\,0\,0\.25\)\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:shadow-\[0_8px_24px_rgba\(0\,0\,0\,0\.35\)\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#00000059);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:shadow-\[0_12px_32px_rgba\(0\,0\,0\,0\.45\)\]{--tw-shadow:0 12px 32px var(--tw-shadow-color,#00000073);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:shadow-\[0_24px_60px_rgba\(0\,0\,0\,0\.5\)\,0_4px_12px_rgba\(0\,0\,0\,0\.25\)\]{--tw-shadow:0 24px 60px var(--tw-shadow-color,#00000080), 0 4px 12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:ring-1{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:ring-foreground\/10{--tw-ring-color:var(--vela-foreground)}@supports (color:color-mix(in lab, red, red)){.vela\:ring-foreground\/10{--tw-ring-color:color-mix(in oklab, var(--vela-foreground) 10%, transparent)}}.vela\:outline-hidden{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.vela\:outline-hidden{outline-offset:2px;outline:2px solid #0000}}.vela\:transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--vela-default-transition-timing-function));transition-duration:var(--tw-duration,var(--vela-default-transition-duration))}.vela\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--vela-default-transition-timing-function));transition-duration:var(--tw-duration,var(--vela-default-transition-duration))}.vela\:transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--vela-default-transition-timing-function));transition-duration:var(--tw-duration,var(--vela-default-transition-duration))}.vela\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--vela-default-transition-timing-function));transition-duration:var(--tw-duration,var(--vela-default-transition-duration))}.vela\:duration-100{--tw-duration:.1s;transition-duration:.1s}.vela\:duration-150{--tw-duration:.15s;transition-duration:.15s}.vela\:duration-200{--tw-duration:.2s;transition-duration:.2s}.vela\:ease-in-out{--tw-ease:var(--vela-ease-in-out);transition-timing-function:var(--vela-ease-in-out)}.vela\:outline-none{--tw-outline-style:none;outline-style:none}.vela\:select-none{-webkit-user-select:none;user-select:none}@media (hover:hover){.vela\:group-hover\:text-bar-text:is(:where(.vela\:group):hover *){color:var(--cms-bar-text)}.vela\:group-hover\:opacity-100:is(:where(.vela\:group):hover *){opacity:1}}.vela\:group-focus\/menubar-item\:text-accent-foreground:is(:where(.vela\:group\/menubar-item):focus *){color:var(--vela-accent-foreground)}.vela\:group-data-\[state\=open\]\:rotate-180:is(:where(.vela\:group)[data-state=open] *){rotate:180deg}.vela\:placeholder\:text-bar-text-tertiary::placeholder{color:var(--cms-bar-text-tertiary)}@media (hover:hover){.vela\:hover\:bg-\[var\(--cms-bar-bg-hover\)\]:hover{background-color:var(--cms-bar-bg-hover)}.vela\:hover\:bg-\[var\(--cms-status-error-bg-hover\)\]:hover{background-color:var(--cms-status-error-bg-hover)}.vela\:hover\:bg-\[var\(--cms-status-warn-bg-hover\)\]:hover{background-color:var(--cms-status-warn-bg-hover)}.vela\:hover\:bg-destructive\/90:hover{background-color:var(--vela-destructive)}@supports (color:color-mix(in lab, red, red)){.vela\:hover\:bg-destructive\/90:hover{background-color:color-mix(in oklab, var(--vela-destructive) 90%, transparent)}}.vela\:hover\:bg-muted:hover{background-color:var(--vela-muted)}.vela\:hover\:bg-primary\/90:hover{background-color:var(--vela-primary)}@supports (color:color-mix(in lab, red, red)){.vela\:hover\:bg-primary\/90:hover{background-color:color-mix(in oklab, var(--vela-primary) 90%, transparent)}}.vela\:hover\:bg-secondary\/80:hover{background-color:var(--vela-secondary)}@supports (color:color-mix(in lab, red, red)){.vela\:hover\:bg-secondary\/80:hover{background-color:color-mix(in oklab, var(--vela-secondary) 80%, transparent)}}.vela\:hover\:text-\[var\(--cms-status-error-text-hover\)\]:hover{color:var(--cms-status-error-text-hover)}.vela\:hover\:text-bar-text:hover{color:var(--cms-bar-text)}.vela\:hover\:text-bar-text-secondary:hover{color:var(--cms-bar-text-secondary)}.vela\:hover\:underline:hover{text-decoration-line:underline}.vela\:hover\:ring-2:hover{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:hover\:ring-\[var\(--cms-accent\,\#534ab7\)\]:hover{--tw-ring-color:var(--cms-accent,#534ab7)}}.vela\:focus\:border-\[var\(--cms-accent\)\]:focus{border-color:var(--cms-accent)}.vela\:focus\:bg-\[var\(--cms-bar-bg-hover\)\]:focus{background-color:var(--cms-bar-bg-hover)}.vela\:focus\:bg-\[var\(--cms-status-error-bg-hover\)\]:focus{background-color:var(--cms-status-error-bg-hover)}.vela\:focus\:bg-accent:focus{background-color:var(--vela-accent)}.vela\:focus\:text-\[var\(--cms-status-error-text-hover\)\]:focus{color:var(--cms-status-error-text-hover)}.vela\:focus\:text-accent-foreground:focus{color:var(--vela-accent-foreground)}.vela\:focus\:text-bar-text:focus{color:var(--cms-bar-text)}.vela\:focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:focus\:ring-\[var\(--cms-accent\)\]:focus{--tw-ring-color:var(--cms-accent)}.vela\:focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}:is(.vela\:focus\:\*\*\:text-accent-foreground:focus *),:is(.vela\:not-data-\[variant\=destructive\]\:focus\:\*\*\:text-accent-foreground:not([data-variant=destructive]):focus *){color:var(--vela-accent-foreground)}.vela\:focus-visible\:bg-\[var\(--cms-bar-bg-hover\)\]:focus-visible{background-color:var(--cms-bar-bg-hover)}.vela\:focus-visible\:ring-1:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:focus-visible\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:focus-visible\:ring-\[var\(--cms-accent\)\]:focus-visible{--tw-ring-color:var(--cms-accent)}.vela\:focus-visible\:ring-ring:focus-visible{--tw-ring-color:var(--vela-ring)}.vela\:focus-visible\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.vela\:disabled\:pointer-events-none:disabled{pointer-events:none}.vela\:disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.vela\:disabled\:opacity-50:disabled{opacity:.5}.vela\:disabled\:opacity-60:disabled{opacity:.6}.vela\:aria-expanded\:bg-\[var\(--cms-bar-bg-hover\)\][aria-expanded=true]{background-color:var(--cms-bar-bg-hover)}.vela\:aria-expanded\:bg-muted[aria-expanded=true]{background-color:var(--vela-muted)}.vela\:aria-expanded\:text-bar-text[aria-expanded=true]{color:var(--cms-bar-text)}.vela\:aria-expanded\:text-bar-text-secondary[aria-expanded=true]{color:var(--cms-bar-text-secondary)}.vela\:aria-expanded\:ring-2[aria-expanded=true]{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:aria-expanded\:ring-\[var\(--cms-accent\)\][aria-expanded=true]{--tw-ring-color:var(--cms-accent)}.vela\:aria-expanded\:ring-offset-2[aria-expanded=true]{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.vela\:aria-expanded\:ring-offset-\[var\(--cms-bar-bg\)\][aria-expanded=true]{--tw-ring-offset-color:var(--cms-bar-bg)}.vela\:data-closed\:animate-out[data-closed]{animation:exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.vela\:data-closed\:fade-out-0[data-closed]{--tw-exit-opacity:0}.vela\:data-closed\:zoom-out-95[data-closed]{--tw-exit-scale:.95}.vela\:data-disabled\:pointer-events-none[data-disabled]{pointer-events:none}.vela\:data-disabled\:opacity-40[data-disabled]{opacity:.4}.vela\:data-disabled\:opacity-50[data-disabled]{opacity:.5}.vela\:data-highlighted\:bg-\[var\(--cms-bar-bg-hover\)\][data-highlighted]{background-color:var(--cms-bar-bg-hover)}.vela\:data-inset\:pl-7[data-inset]{padding-left:calc(var(--vela-spacing) * 7)}.vela\:data-open\:animate-in[data-open]{animation:enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.vela\:data-open\:bg-accent[data-open]{background-color:var(--vela-accent)}.vela\:data-open\:text-accent-foreground[data-open]{color:var(--vela-accent-foreground)}.vela\:data-open\:fade-in-0[data-open]{--tw-enter-opacity:0}.vela\:data-open\:zoom-in-95[data-open]{--tw-enter-scale:.95}.vela\:data-placeholder\:text-bar-text-tertiary[data-placeholder]{color:var(--cms-bar-text-tertiary)}.vela\:data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.vela\:data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}.vela\:data-\[inset\]\:ps-8[data-inset]{padding-inline-start:calc(var(--vela-spacing) * 8)}.vela\:data-\[orientation\=horizontal\]\:h-px[data-orientation=horizontal]{height:1px}.vela\:data-\[orientation\=horizontal\]\:w-full[data-orientation=horizontal]{width:100%}.vela\:data-\[orientation\=vertical\]\:h-full[data-orientation=vertical]{height:100%}.vela\:data-\[orientation\=vertical\]\:w-px[data-orientation=vertical]{width:1px}.vela\:data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom]{--tw-enter-translate-y:calc(var(--vela-spacing) * 2*-1)}.vela\:data-\[side\=left\]\:slide-in-from-right-2[data-side=left]{--tw-enter-translate-x:calc(var(--vela-spacing) * 2)}.vela\:data-\[side\=right\]\:slide-in-from-left-2[data-side=right]{--tw-enter-translate-x:calc(var(--vela-spacing) * 2*-1)}.vela\:data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top]{--tw-enter-translate-y:calc(var(--vela-spacing) * 2)}.vela\:data-\[size\=default\]\:h-7[data-size=default]{height:calc(var(--vela-spacing) * 7)}.vela\:data-\[size\=sm\]\:h-6[data-size=sm]{height:calc(var(--vela-spacing) * 6)}.vela\:data-\[state\=active\]\:bg-bar-bg[data-state=active]{background-color:var(--cms-bar-bg)}.vela\:data-\[state\=active\]\:text-bar-text[data-state=active]{color:var(--cms-bar-text)}.vela\:data-\[state\=checked\]\:translate-x-4[data-state=checked]{--tw-translate-x:calc(var(--vela-spacing) * 4);translate:var(--tw-translate-x) var(--tw-translate-y)}.vela\:data-\[state\=checked\]\:border-\[var\(--cms-accent\)\][data-state=checked]{border-color:var(--cms-accent)}.vela\:data-\[state\=checked\]\:bg-\[var\(--cms-accent\)\][data-state=checked]{background-color:var(--cms-accent)}.vela\:data-\[state\=checked\]\:text-white[data-state=checked]{color:var(--vela-color-white)}.vela\:data-\[state\=closed\]\:animate-out[data-state=closed]{animation:exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.vela\:data-\[state\=closed\]\:duration-200[data-state=closed]{--tw-duration:.2s;transition-duration:.2s}.vela\:data-\[state\=closed\]\:fade-out-0[data-state=closed]{--tw-exit-opacity:0}.vela\:data-\[state\=closed\]\:zoom-out-95[data-state=closed]{--tw-exit-scale:.95}.vela\:data-\[state\=closed\]\:slide-out-to-bottom[data-state=closed]{--tw-exit-translate-y:100%}.vela\:data-\[state\=closed\]\:slide-out-to-left[data-state=closed]{--tw-exit-translate-x:-100%}.vela\:data-\[state\=closed\]\:slide-out-to-right[data-state=closed]{--tw-exit-translate-x:100%}.vela\:data-\[state\=closed\]\:slide-out-to-top[data-state=closed]{--tw-exit-translate-y:-100%}.vela\:data-\[state\=indeterminate\]\:bg-\[var\(--cms-accent\)\][data-state=indeterminate]{background-color:var(--cms-accent)}.vela\:data-\[state\=indeterminate\]\:text-white[data-state=indeterminate]{color:var(--vela-color-white)}.vela\:data-\[state\=open\]\:animate-in[data-state=open]{animation:enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.vela\:data-\[state\=open\]\:duration-300[data-state=open]{--tw-duration:.3s;transition-duration:.3s}.vela\:data-\[state\=open\]\:fade-in-0[data-state=open]{--tw-enter-opacity:0}.vela\:data-\[state\=open\]\:zoom-in-95[data-state=open]{--tw-enter-scale:.95}.vela\:data-\[state\=open\]\:slide-in-from-bottom[data-state=open]{--tw-enter-translate-y:100%}.vela\:data-\[state\=open\]\:slide-in-from-left[data-state=open]{--tw-enter-translate-x:-100%}.vela\:data-\[state\=open\]\:slide-in-from-right[data-state=open]{--tw-enter-translate-x:100%}.vela\:data-\[state\=open\]\:slide-in-from-top[data-state=open]{--tw-enter-translate-y:-100%}.vela\:data-\[state\=unchecked\]\:translate-x-0\.5[data-state=unchecked]{--tw-translate-x:calc(var(--vela-spacing) * .5);translate:var(--tw-translate-x) var(--tw-translate-y)}.vela\:data-\[state\=unchecked\]\:bg-\[var\(--cms-bar-divider\)\][data-state=unchecked]{background-color:var(--cms-bar-divider)}.vela\:data-\[variant\=destructive\]\:text-destructive[data-variant=destructive]{color:var(--vela-destructive)}.vela\:data-\[variant\=destructive\]\:focus\:bg-destructive\/10[data-variant=destructive]:focus{background-color:var(--vela-destructive)}@supports (color:color-mix(in lab, red, red)){.vela\:data-\[variant\=destructive\]\:focus\:bg-destructive\/10[data-variant=destructive]:focus{background-color:color-mix(in oklab, var(--vela-destructive) 10%, transparent)}}.vela\:data-\[variant\=destructive\]\:focus\:text-destructive[data-variant=destructive]:focus{color:var(--vela-destructive)}@media (min-width:40rem){.vela\:sm\:mx-auto{margin-inline:auto}.vela\:sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (prefers-color-scheme:dark){.vela\:dark\:data-\[variant\=destructive\]\:focus\:bg-destructive\/20[data-variant=destructive]:focus{background-color:var(--vela-destructive)}@supports (color:color-mix(in lab, red, red)){.vela\:dark\:data-\[variant\=destructive\]\:focus\:bg-destructive\/20[data-variant=destructive]:focus{background-color:color-mix(in oklab, var(--vela-destructive) 20%, transparent)}}}.vela\:\[\&_svg\]\:pointer-events-none svg{pointer-events:none}.vela\:\[\&_svg\]\:shrink-0 svg{flex-shrink:0}.vela\:\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-3 svg:not([class*=size-]){width:calc(var(--vela-spacing) * 3);height:calc(var(--vela-spacing) * 3)}.vela\:\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*=size-]){width:calc(var(--vela-spacing) * 4);height:calc(var(--vela-spacing) * 4)}:is(.vela\:data-\[variant\=destructive\]\:\*\:\[svg\]\:text-destructive\![data-variant=destructive]>*):is(svg){color:var(--vela-destructive)!important}}@property --tw-animation-delay{syntax:"*";inherits:false;initial-value:0s}@property --tw-animation-direction{syntax:"*";inherits:false;initial-value:normal}@property --tw-animation-duration{syntax:"*";inherits:false}@property --tw-animation-fill-mode{syntax:"*";inherits:false;initial-value:none}@property --tw-animation-iteration-count{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-blur{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-blur{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-translate-y{syntax:"*";inherits:false;initial-value:0}@keyframes bar-pulse{0%,to{opacity:1}50%{opacity:.6}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0)scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1))rotate(var(--tw-enter-rotate,0));filter:blur(var(--tw-enter-blur,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0),var(--tw-exit-translate-y,0),0)scale3d(var(--tw-exit-scale,1),var(--tw-exit-scale,1),var(--tw-exit-scale,1))rotate(var(--tw-exit-rotate,0));filter:blur(var(--tw-exit-blur,0))}}
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial;--tw-ease:initial;--tw-animation-delay:0s;--tw-animation-direction:normal;--tw-animation-duration:initial;--tw-animation-fill-mode:none;--tw-animation-iteration-count:1;--tw-enter-blur:0;--tw-enter-opacity:1;--tw-enter-rotate:0;--tw-enter-scale:1;--tw-enter-translate-x:0;--tw-enter-translate-y:0;--tw-exit-blur:0;--tw-exit-opacity:1;--tw-exit-rotate:0;--tw-exit-scale:1;--tw-exit-translate-x:0;--tw-exit-translate-y:0}}}@layer theme{:scope{--vela-font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--vela-font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--vela-color-black:#000;--vela-color-white:#fff;--vela-spacing:.25rem;--vela-container-sm:24rem;--vela-text-xs:.75rem;--vela-text-xs--line-height:calc(1 / .75);--vela-text-sm:.875rem;--vela-text-sm--line-height:calc(1.25 / .875);--vela-font-weight-medium:500;--vela-font-weight-semibold:600;--vela-tracking-tight:-.025em;--vela-tracking-normal:0em;--vela-tracking-wider:.05em;--vela-tracking-widest:.1em;--vela-leading-snug:1.375;--vela-radius-2xl:1rem;--vela-radius-3xl:1.5rem;--vela-ease-in-out:cubic-bezier(.4, 0, .2, 1);--vela-animate-spin:spin 1s linear infinite;--vela-default-transition-duration:.15s;--vela-default-transition-timing-function:cubic-bezier(.4, 0, .2, 1)}}@layer base{:scope{--vela-background:oklch(14.5% 0 0);--vela-foreground:oklch(98.5% 0 0);--vela-card:oklch(20.5% 0 0);--vela-card-foreground:oklch(98.5% 0 0);--vela-popover:oklch(20.5% 0 0);--vela-popover-foreground:oklch(98.5% 0 0);--vela-primary:oklch(98.5% 0 0);--vela-primary-foreground:oklch(20.5% 0 0);--vela-secondary:oklch(26.9% 0 0);--vela-secondary-foreground:oklch(98.5% 0 0);--vela-muted:oklch(26.9% 0 0);--vela-muted-foreground:oklch(70.8% 0 0);--vela-accent:oklch(26.9% 0 0);--vela-accent-foreground:oklch(98.5% 0 0);--vela-destructive:oklch(70.4% .191 22.216);--vela-destructive-foreground:oklch(98.5% 0 0);--vela-border:oklch(100% 0 0/.1);--vela-input:oklch(100% 0 0/.15);--vela-ring:oklch(55.6% 0 0);--vela-radius:.5rem;--cms-bar-bg:#1f1f1f;--cms-bar-bg-hover:#2e2e2e;--cms-bar-divider:#3a3a3a;--cms-bar-text:#f5f5f5;--cms-bar-text-secondary:#a3a3a3;--cms-bar-text-tertiary:#737373;--cms-status-clean-dot:#5dcaa5;--cms-status-clean-text:#d4d4d4;--cms-status-warn-bg:#2a2416;--cms-status-warn-bg-hover:#3a2f1e;--cms-status-warn-text:#fac775;--cms-status-warn-dot:#ef9f27;--cms-status-edit-bg:#182338;--cms-status-edit-text:#85b7eb;--cms-status-edit-dot:#378add;--cms-sub-bar-bg:#2e2e2ebf;--cms-sub-bar-border:transparent;--cms-template-bg:#181818;--cms-template-accent-bg:#2a2740;--cms-template-accent-text:#afa9ec;--cms-status-error-bg:#2a1818;--cms-status-error-bg-hover:#3a1f1f;--cms-status-error-text:#f08a8a;--cms-status-error-text-hover:#ffb3b3;--cms-status-error-text-base:#e88a8a;--cms-status-error-border:#5a2a2a;--cms-status-success-bg:#162a1d;--cms-status-success-text:#7ed49a;--cms-accent:#534ab7}:scope[data-vela-theme=light]{--vela-background:oklch(100% 0 0);--vela-foreground:oklch(14.5% 0 0);--vela-card:oklch(100% 0 0);--vela-card-foreground:oklch(14.5% 0 0);--vela-popover:oklch(100% 0 0);--vela-popover-foreground:oklch(14.5% 0 0);--vela-primary:oklch(20.5% 0 0);--vela-primary-foreground:oklch(98.5% 0 0);--vela-secondary:oklch(97% 0 0);--vela-secondary-foreground:oklch(20.5% 0 0);--vela-muted:oklch(97% 0 0);--vela-muted-foreground:oklch(55.6% 0 0);--vela-accent:oklch(97% 0 0);--vela-accent-foreground:oklch(20.5% 0 0);--vela-destructive:oklch(57.7% .245 27.325);--vela-destructive-foreground:oklch(98.5% 0 0);--vela-border:oklch(0% 0 0/.1);--vela-input:oklch(0% 0 0/.15);--vela-ring:oklch(70.8% 0 0);--cms-bar-bg:#fff;--cms-bar-bg-hover:#f1f1f1;--cms-bar-divider:#e5e5e5;--cms-bar-text:#171717;--cms-bar-text-secondary:#525252;--cms-bar-text-tertiary:#a3a3a3;--cms-status-clean-dot:#16a34a;--cms-status-clean-text:#525252;--cms-status-warn-bg:#fff4dc;--cms-status-warn-bg-hover:#fce8c2;--cms-status-warn-text:#92400e;--cms-status-warn-dot:#d97706;--cms-status-edit-bg:#dbeafe;--cms-status-edit-text:#1e40af;--cms-status-edit-dot:#2563eb;--cms-sub-bar-bg:#f5f5f5d9;--cms-sub-bar-border:#e5e5e5;--cms-template-bg:#fafafa;--cms-template-accent-bg:#ece9ff;--cms-template-accent-text:#5b50c4;--cms-status-error-bg:#fee2e2;--cms-status-error-bg-hover:#fecaca;--cms-status-error-text:#b91c1c;--cms-status-error-text-hover:#7f1d1d;--cms-status-error-text-base:#dc2626;--cms-status-error-border:#fca5a5;--cms-status-success-bg:#dcfce7;--cms-status-success-text:#15803d;--cms-accent:#534ab7}:scope,:scope *,:scope :before,:scope :after{box-sizing:border-box;border-style:solid;border-width:0;border-color:var(--vela-border)}:scope button,:scope [type=button],:scope [type=submit],:scope [type=reset]{appearance:button;color:inherit;cursor:pointer;font:inherit;background-color:#0000;background-image:none;margin:0;padding:0}}@layer components;@layer utilities{.vela\:pointer-events-none{pointer-events:none}.vela\:sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.vela\:absolute{position:absolute}.vela\:fixed{position:fixed}.vela\:relative{position:relative}.vela\:inset-0{inset:0}.vela\:inset-x-0{inset-inline:0}.vela\:inset-y-0{inset-block:0}.vela\:end-2{inset-inline-end:calc(var(--vela-spacing) * 2)}.vela\:top-0{top:0}.vela\:top-1{top:var(--vela-spacing)}.vela\:top-1\/2{top:50%}.vela\:top-2{top:calc(var(--vela-spacing) * 2)}.vela\:top-3{top:calc(var(--vela-spacing) * 3)}.vela\:top-3\.5{top:calc(var(--vela-spacing) * 3.5)}.vela\:top-4{top:calc(var(--vela-spacing) * 4)}.vela\:top-10{top:calc(var(--vela-spacing) * 10)}.vela\:top-\[var\(--cms-panel-top\,72px\)\]{top:var(--cms-panel-top,72px)}.vela\:top-full{top:100%}.vela\:right-0{right:0}.vela\:right-1{right:var(--vela-spacing)}.vela\:right-2{right:calc(var(--vela-spacing) * 2)}.vela\:right-3{right:calc(var(--vela-spacing) * 3)}.vela\:bottom-0{bottom:0}.vela\:bottom-2{bottom:calc(var(--vela-spacing) * 2)}.vela\:bottom-4{bottom:calc(var(--vela-spacing) * 4)}.vela\:bottom-10{bottom:calc(var(--vela-spacing) * 10)}.vela\:left-0{left:0}.vela\:left-1\.5{left:calc(var(--vela-spacing) * 1.5)}.vela\:left-1\/2{left:50%}.vela\:left-2{left:calc(var(--vela-spacing) * 2)}.vela\:left-2\.5{left:calc(var(--vela-spacing) * 2.5)}.vela\:left-\[5px\]{left:5px}.vela\:isolate{isolation:isolate}.vela\:z-10{z-index:10}.vela\:z-30{z-index:30}.vela\:z-50{z-index:50}.vela\:z-\[9997\]{z-index:9997}.vela\:z-\[9998\]{z-index:9998}.vela\:z-\[9999\]{z-index:9999}.vela\:m-0{margin:0}.vela\:-mx-1{margin-inline:calc(var(--vela-spacing) * -1)}.vela\:mx-4{margin-inline:calc(var(--vela-spacing) * 4)}.vela\:mx-6{margin-inline:calc(var(--vela-spacing) * 6)}.vela\:my-1{margin-block:var(--vela-spacing)}.vela\:mt-0\.5{margin-top:calc(var(--vela-spacing) * .5)}.vela\:mt-1{margin-top:var(--vela-spacing)}.vela\:mt-1\.5{margin-top:calc(var(--vela-spacing) * 1.5)}.vela\:mt-2{margin-top:calc(var(--vela-spacing) * 2)}.vela\:mt-3{margin-top:calc(var(--vela-spacing) * 3)}.vela\:mt-auto{margin-top:auto}.vela\:mr-1{margin-right:var(--vela-spacing)}.vela\:mb-2{margin-bottom:calc(var(--vela-spacing) * 2)}.vela\:ml-2{margin-left:calc(var(--vela-spacing) * 2)}.vela\:ml-auto{margin-left:auto}.vela\:line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.vela\:block{display:block}.vela\:flex{display:flex}.vela\:grid{display:grid}.vela\:inline-flex{display:inline-flex}.vela\:aspect-\[1\.91\/1\]{aspect-ratio:1.91}.vela\:aspect-square{aspect-ratio:1}.vela\:size-3{width:calc(var(--vela-spacing) * 3);height:calc(var(--vela-spacing) * 3)}.vela\:size-3\.5{width:calc(var(--vela-spacing) * 3.5);height:calc(var(--vela-spacing) * 3.5)}.vela\:size-4{width:calc(var(--vela-spacing) * 4);height:calc(var(--vela-spacing) * 4)}.vela\:size-5{width:calc(var(--vela-spacing) * 5);height:calc(var(--vela-spacing) * 5)}.vela\:size-6{width:calc(var(--vela-spacing) * 6);height:calc(var(--vela-spacing) * 6)}.vela\:size-full{width:100%;height:100%}.vela\:h-\(--bits-select-anchor-height\){height:var(--bits-select-anchor-height)}.vela\:h-1\.5{height:calc(var(--vela-spacing) * 1.5)}.vela\:h-2{height:calc(var(--vela-spacing) * 2)}.vela\:h-3{height:calc(var(--vela-spacing) * 3)}.vela\:h-4{height:calc(var(--vela-spacing) * 4)}.vela\:h-5{height:calc(var(--vela-spacing) * 5)}.vela\:h-5\.5{height:calc(var(--vela-spacing) * 5.5)}.vela\:h-6{height:calc(var(--vela-spacing) * 6)}.vela\:h-7{height:calc(var(--vela-spacing) * 7)}.vela\:h-8{height:calc(var(--vela-spacing) * 8)}.vela\:h-9{height:calc(var(--vela-spacing) * 9)}.vela\:h-10{height:calc(var(--vela-spacing) * 10)}.vela\:h-12{height:calc(var(--vela-spacing) * 12)}.vela\:h-16{height:calc(var(--vela-spacing) * 16)}.vela\:h-\[11px\]{height:11px}.vela\:h-\[18px\]{height:18px}.vela\:h-auto{height:auto}.vela\:h-full{height:100%}.vela\:h-px{height:1px}.vela\:max-h-24{max-height:calc(var(--vela-spacing) * 24)}.vela\:max-h-\[40vh\]{max-height:40vh}.vela\:max-h-\[60vh\]{max-height:60vh}.vela\:max-h-\[85vh\]{max-height:85vh}.vela\:max-h-\[280px\]{max-height:280px}.vela\:max-h-\[calc\(100vh-var\(--cms-panel-top\,72px\)-1rem\)\]{max-height:calc(100vh - var(--cms-panel-top,72px) - 1rem)}.vela\:min-h-9{min-height:calc(var(--vela-spacing) * 9)}.vela\:min-h-\[56px\]{min-height:56px}.vela\:w-1\.5{width:calc(var(--vela-spacing) * 1.5)}.vela\:w-2{width:calc(var(--vela-spacing) * 2)}.vela\:w-3{width:calc(var(--vela-spacing) * 3)}.vela\:w-3\/4{width:75%}.vela\:w-4{width:calc(var(--vela-spacing) * 4)}.vela\:w-6{width:calc(var(--vela-spacing) * 6)}.vela\:w-7{width:calc(var(--vela-spacing) * 7)}.vela\:w-9{width:calc(var(--vela-spacing) * 9)}.vela\:w-12{width:calc(var(--vela-spacing) * 12)}.vela\:w-24{width:calc(var(--vela-spacing) * 24)}.vela\:w-64{width:calc(var(--vela-spacing) * 64)}.vela\:w-72{width:calc(var(--vela-spacing) * 72)}.vela\:w-80{width:calc(var(--vela-spacing) * 80)}.vela\:w-\[11px\]{width:11px}.vela\:w-\[420px\]{width:420px}.vela\:w-\[calc\(100\%-2rem\)\]{width:calc(100% - 2rem)}.vela\:w-auto{width:auto}.vela\:w-fit{width:fit-content}.vela\:w-full{width:100%}.vela\:w-px{width:1px}.vela\:max-w-\[28rem\]{max-width:28rem}.vela\:max-w-\[30rem\]{max-width:30rem}.vela\:max-w-\[34rem\]{max-width:34rem}.vela\:max-w-\[560px\]{max-width:560px}.vela\:max-w-\[calc\(100vw-2rem\)\]{max-width:calc(100vw - 2rem)}.vela\:max-w-sm{max-width:var(--vela-container-sm)}.vela\:min-w-\(--bits-select-anchor-width\){min-width:var(--bits-select-anchor-width)}.vela\:min-w-0{min-width:0}.vela\:min-w-5{min-width:calc(var(--vela-spacing) * 5)}.vela\:min-w-32{min-width:calc(var(--vela-spacing) * 32)}.vela\:min-w-36{min-width:calc(var(--vela-spacing) * 36)}.vela\:min-w-56{min-width:calc(var(--vela-spacing) * 56)}.vela\:min-w-\[18px\]{min-width:18px}.vela\:flex-1{flex:1}.vela\:shrink-0{flex-shrink:0}.vela\:origin-\(--bits-menubar-content-transform-origin\){transform-origin:var(--bits-menubar-content-transform-origin)}.vela\:-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.vela\:-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.vela\:animate-bar-pulse{animation:2.4s ease-in-out infinite bar-pulse}.vela\:animate-spin{animation:var(--vela-animate-spin)}.vela\:cursor-default{cursor:default}.vela\:cursor-pointer{cursor:pointer}.vela\:resize-y{resize:vertical}.vela\:scroll-my-1{scroll-margin-block:var(--vela-spacing)}.vela\:list-none{list-style-type:none}.vela\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.vela\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.vela\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.vela\:flex-col{flex-direction:column}.vela\:flex-wrap{flex-wrap:wrap}.vela\:items-baseline{align-items:baseline}.vela\:items-center{align-items:center}.vela\:items-end{align-items:flex-end}.vela\:items-start{align-items:flex-start}.vela\:justify-between{justify-content:space-between}.vela\:justify-center{justify-content:center}.vela\:justify-end{justify-content:flex-end}.vela\:gap-0{gap:0}.vela\:gap-0\.5{gap:calc(var(--vela-spacing) * .5)}.vela\:gap-1{gap:var(--vela-spacing)}.vela\:gap-1\.5{gap:calc(var(--vela-spacing) * 1.5)}.vela\:gap-2{gap:calc(var(--vela-spacing) * 2)}.vela\:gap-3{gap:calc(var(--vela-spacing) * 3)}.vela\:gap-4{gap:calc(var(--vela-spacing) * 4)}.vela\:gap-5{gap:calc(var(--vela-spacing) * 5)}.vela\:self-start{align-self:flex-start}.vela\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.vela\:overflow-hidden{overflow:hidden}.vela\:overflow-x-hidden{overflow-x:hidden}.vela\:overflow-y-auto{overflow-y:auto}.vela\:rounded{border-radius:.25rem}.vela\:rounded-2xl{border-radius:var(--vela-radius-2xl)}.vela\:rounded-\[4px\]{border-radius:4px}.vela\:rounded-full{border-radius:3.40282e38px}.vela\:rounded-lg{border-radius:var(--vela-radius)}.vela\:rounded-md{border-radius:calc(var(--vela-radius) - 2px)}.vela\:rounded-none{border-radius:0}.vela\:rounded-sm{border-radius:calc(var(--vela-radius) - 4px)}.vela\:rounded-xl{border-radius:calc(var(--vela-radius) + 4px)}.vela\:rounded-t-2xl{border-top-left-radius:var(--vela-radius-2xl);border-top-right-radius:var(--vela-radius-2xl)}.vela\:rounded-t-3xl{border-top-left-radius:var(--vela-radius-3xl);border-top-right-radius:var(--vela-radius-3xl)}.vela\:rounded-b-3xl{border-bottom-right-radius:var(--vela-radius-3xl);border-bottom-left-radius:var(--vela-radius-3xl)}.vela\:border{border-style:var(--tw-border-style);border-width:1px}.vela\:border-0{border-style:var(--tw-border-style);border-width:0}.vela\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.vela\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.vela\:border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.vela\:border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.vela\:border-\[\#e8eaed\]{border-color:#e8eaed}.vela\:border-\[var\(--cms-bar-divider\)\]{border-color:var(--cms-bar-divider)}.vela\:border-\[var\(--cms-status-error-border\)\]{border-color:var(--cms-status-error-border)}.vela\:border-\[var\(--cms-sub-bar-border\)\]{border-color:var(--cms-sub-bar-border)}.vela\:border-transparent{border-color:#0000}.vela\:bg-\[\#e8eaed\]{background-color:#e8eaed}.vela\:bg-\[\#f7f9fa\]{background-color:#f7f9fa}.vela\:bg-\[\#fafafa\]{background-color:#fafafa}.vela\:bg-\[var\(--cms-accent\)\]{background-color:var(--cms-accent)}.vela\:bg-\[var\(--cms-bar-bg-hover\)\]{background-color:var(--cms-bar-bg-hover)}.vela\:bg-\[var\(--cms-bar-divider\)\]{background-color:var(--cms-bar-divider)}.vela\:bg-\[var\(--cms-status-clean-dot\)\]{background-color:var(--cms-status-clean-dot)}.vela\:bg-\[var\(--cms-status-edit-bg\)\]{background-color:var(--cms-status-edit-bg)}.vela\:bg-\[var\(--cms-status-edit-dot\)\]{background-color:var(--cms-status-edit-dot)}.vela\:bg-\[var\(--cms-status-error-bg\)\]{background-color:var(--cms-status-error-bg)}.vela\:bg-\[var\(--cms-status-success-bg\)\]{background-color:var(--cms-status-success-bg)}.vela\:bg-\[var\(--cms-status-warn-bg\)\]{background-color:var(--cms-status-warn-bg)}.vela\:bg-\[var\(--cms-status-warn-dot\)\]{background-color:var(--cms-status-warn-dot)}.vela\:bg-\[var\(--cms-sub-bar-bg\)\]{background-color:var(--cms-sub-bar-bg)}.vela\:bg-\[var\(--cms-template-accent-bg\)\]{background-color:var(--cms-template-accent-bg)}.vela\:bg-\[var\(--cms-template-bg\)\]{background-color:var(--cms-template-bg)}.vela\:bg-bar-bg{background-color:var(--cms-bar-bg)}.vela\:bg-black\/35{background-color:var(--vela-color-black)}@supports (color:color-mix(in lab, red, red)){.vela\:bg-black\/35{background-color:color-mix(in oklab, var(--vela-color-black) 35%, transparent)}}.vela\:bg-black\/50{background-color:var(--vela-color-black)}@supports (color:color-mix(in lab, red, red)){.vela\:bg-black\/50{background-color:color-mix(in oklab, var(--vela-color-black) 50%, transparent)}}.vela\:bg-black\/55{background-color:var(--vela-color-black)}@supports (color:color-mix(in lab, red, red)){.vela\:bg-black\/55{background-color:color-mix(in oklab, var(--vela-color-black) 55%, transparent)}}.vela\:bg-black\/60{background-color:var(--vela-color-black)}@supports (color:color-mix(in lab, red, red)){.vela\:bg-black\/60{background-color:color-mix(in oklab, var(--vela-color-black) 60%, transparent)}}.vela\:bg-border{background-color:var(--vela-border)}.vela\:bg-destructive{background-color:var(--vela-destructive)}.vela\:bg-popover{background-color:var(--vela-popover)}.vela\:bg-primary{background-color:var(--vela-primary)}.vela\:bg-secondary{background-color:var(--vela-secondary)}.vela\:bg-transparent{background-color:#0000}.vela\:bg-white{background-color:var(--vela-color-white)}.vela\:object-contain{object-fit:contain}.vela\:object-cover{object-fit:cover}.vela\:p-0{padding:0}.vela\:p-0\.5{padding:calc(var(--vela-spacing) * .5)}.vela\:p-1{padding:var(--vela-spacing)}.vela\:p-1\.5{padding:calc(var(--vela-spacing) * 1.5)}.vela\:p-2{padding:calc(var(--vela-spacing) * 2)}.vela\:p-3{padding:calc(var(--vela-spacing) * 3)}.vela\:p-3\.5{padding:calc(var(--vela-spacing) * 3.5)}.vela\:p-\[3px\]{padding:3px}.vela\:px-1{padding-inline:var(--vela-spacing)}.vela\:px-1\.5{padding-inline:calc(var(--vela-spacing) * 1.5)}.vela\:px-2{padding-inline:calc(var(--vela-spacing) * 2)}.vela\:px-2\.5{padding-inline:calc(var(--vela-spacing) * 2.5)}.vela\:px-3{padding-inline:calc(var(--vela-spacing) * 3)}.vela\:px-3\.5{padding-inline:calc(var(--vela-spacing) * 3.5)}.vela\:px-4{padding-inline:calc(var(--vela-spacing) * 4)}.vela\:px-6{padding-inline:calc(var(--vela-spacing) * 6)}.vela\:px-8{padding-inline:calc(var(--vela-spacing) * 8)}.vela\:py-0\.5{padding-block:calc(var(--vela-spacing) * .5)}.vela\:py-1{padding-block:var(--vela-spacing)}.vela\:py-1\.5{padding-block:calc(var(--vela-spacing) * 1.5)}.vela\:py-2{padding-block:calc(var(--vela-spacing) * 2)}.vela\:py-2\.5{padding-block:calc(var(--vela-spacing) * 2.5)}.vela\:py-3{padding-block:calc(var(--vela-spacing) * 3)}.vela\:py-8{padding-block:calc(var(--vela-spacing) * 8)}.vela\:py-12{padding-block:calc(var(--vela-spacing) * 12)}.vela\:py-\[2px\]{padding-block:2px}.vela\:pt-1{padding-top:var(--vela-spacing)}.vela\:pt-2{padding-top:calc(var(--vela-spacing) * 2)}.vela\:pt-2\.5{padding-top:calc(var(--vela-spacing) * 2.5)}.vela\:pt-3{padding-top:calc(var(--vela-spacing) * 3)}.vela\:pt-3\.5{padding-top:calc(var(--vela-spacing) * 3.5)}.vela\:pt-4{padding-top:calc(var(--vela-spacing) * 4)}.vela\:pt-5{padding-top:calc(var(--vela-spacing) * 5)}.vela\:pr-1{padding-right:var(--vela-spacing)}.vela\:pr-1\.5{padding-right:calc(var(--vela-spacing) * 1.5)}.vela\:pr-2{padding-right:calc(var(--vela-spacing) * 2)}.vela\:pr-2\.5{padding-right:calc(var(--vela-spacing) * 2.5)}.vela\:pr-3{padding-right:calc(var(--vela-spacing) * 3)}.vela\:pr-7{padding-right:calc(var(--vela-spacing) * 7)}.vela\:pr-9{padding-right:calc(var(--vela-spacing) * 9)}.vela\:pb-1{padding-bottom:var(--vela-spacing)}.vela\:pb-1\.5{padding-bottom:calc(var(--vela-spacing) * 1.5)}.vela\:pb-2{padding-bottom:calc(var(--vela-spacing) * 2)}.vela\:pb-3{padding-bottom:calc(var(--vela-spacing) * 3)}.vela\:pb-4{padding-bottom:calc(var(--vela-spacing) * 4)}.vela\:pb-5{padding-bottom:calc(var(--vela-spacing) * 5)}.vela\:pl-0{padding-left:0}.vela\:pl-1{padding-left:var(--vela-spacing)}.vela\:pl-2{padding-left:calc(var(--vela-spacing) * 2)}.vela\:pl-2\.5{padding-left:calc(var(--vela-spacing) * 2.5)}.vela\:pl-6{padding-left:calc(var(--vela-spacing) * 6)}.vela\:pl-7{padding-left:calc(var(--vela-spacing) * 7)}.vela\:pl-8{padding-left:calc(var(--vela-spacing) * 8)}.vela\:text-center{text-align:center}.vela\:text-left{text-align:left}.vela\:font-mono{font-family:var(--vela-font-mono)}.vela\:font-sans{font-family:var(--vela-font-sans)}.vela\:text-sm{font-size:var(--vela-text-sm);line-height:var(--tw-leading,var(--vela-text-sm--line-height))}.vela\:text-xs{font-size:var(--vela-text-xs);line-height:var(--tw-leading,var(--vela-text-xs--line-height))}.vela\:text-\[10px\]{font-size:10px}.vela\:text-\[11px\]{font-size:11px}.vela\:text-\[12px\]{font-size:12px}.vela\:text-\[13px\]{font-size:13px}.vela\:text-\[14px\]{font-size:14px}.vela\:text-\[15px\]{font-size:15px}.vela\:text-\[18px\]{font-size:18px}.vela\:leading-none{--tw-leading:1;line-height:1}.vela\:leading-snug{--tw-leading:var(--vela-leading-snug);line-height:var(--vela-leading-snug)}.vela\:font-medium{--tw-font-weight:var(--vela-font-weight-medium);font-weight:var(--vela-font-weight-medium)}.vela\:font-semibold{--tw-font-weight:var(--vela-font-weight-semibold);font-weight:var(--vela-font-weight-semibold)}.vela\:tracking-normal{--tw-tracking:var(--vela-tracking-normal);letter-spacing:var(--vela-tracking-normal)}.vela\:tracking-tight{--tw-tracking:var(--vela-tracking-tight);letter-spacing:var(--vela-tracking-tight)}.vela\:tracking-wider{--tw-tracking:var(--vela-tracking-wider);letter-spacing:var(--vela-tracking-wider)}.vela\:tracking-widest{--tw-tracking:var(--vela-tracking-widest);letter-spacing:var(--vela-tracking-widest)}.vela\:whitespace-nowrap{white-space:nowrap}.vela\:text-\[\#0f1419\]{color:#0f1419}.vela\:text-\[\#1a0dab\]{color:#1a0dab}.vela\:text-\[\#4d5156\]{color:#4d5156}.vela\:text-\[\#5f6368\]{color:#5f6368}.vela\:text-\[\#202124\]{color:#202124}.vela\:text-\[\#536471\]{color:#536471}.vela\:text-\[var\(--cms-status-clean-dot\)\]{color:var(--cms-status-clean-dot)}.vela\:text-\[var\(--cms-status-clean-text\)\]{color:var(--cms-status-clean-text)}.vela\:text-\[var\(--cms-status-edit-text\)\]{color:var(--cms-status-edit-text)}.vela\:text-\[var\(--cms-status-error-text\)\]{color:var(--cms-status-error-text)}.vela\:text-\[var\(--cms-status-error-text-base\)\]{color:var(--cms-status-error-text-base)}.vela\:text-\[var\(--cms-status-success-text\)\]{color:var(--cms-status-success-text)}.vela\:text-\[var\(--cms-status-warn-text\)\]{color:var(--cms-status-warn-text)}.vela\:text-\[var\(--cms-template-accent-text\)\]{color:var(--cms-template-accent-text)}.vela\:text-bar-text{color:var(--cms-bar-text)}.vela\:text-bar-text-secondary{color:var(--cms-bar-text-secondary)}.vela\:text-bar-text-tertiary{color:var(--cms-bar-text-tertiary)}.vela\:text-current{color:currentColor}.vela\:text-destructive{color:var(--vela-destructive)}.vela\:text-destructive-foreground{color:var(--vela-destructive-foreground)}.vela\:text-muted-foreground{color:var(--vela-muted-foreground)}.vela\:text-popover-foreground{color:var(--vela-popover-foreground)}.vela\:text-primary{color:var(--vela-primary)}.vela\:text-primary-foreground{color:var(--vela-primary-foreground)}.vela\:text-secondary-foreground{color:var(--vela-secondary-foreground)}.vela\:text-white{color:var(--vela-color-white)}.vela\:capitalize{text-transform:capitalize}.vela\:uppercase{text-transform:uppercase}.vela\:tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.vela\:underline-offset-4{text-underline-offset:4px}.vela\:opacity-0{opacity:0}.vela\:opacity-50{opacity:.5}.vela\:shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:shadow-\[0_8px_24px_rgba\(0\,0\,0\,0\.25\)\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:shadow-\[0_8px_24px_rgba\(0\,0\,0\,0\.35\)\]{--tw-shadow:0 8px 24px var(--tw-shadow-color,#00000059);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:shadow-\[0_12px_32px_rgba\(0\,0\,0\,0\.45\)\]{--tw-shadow:0 12px 32px var(--tw-shadow-color,#00000073);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:shadow-\[0_24px_60px_rgba\(0\,0\,0\,0\.5\)\,0_4px_12px_rgba\(0\,0\,0\,0\.25\)\]{--tw-shadow:0 24px 60px var(--tw-shadow-color,#00000080), 0 4px 12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:ring-1{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:ring-foreground\/10{--tw-ring-color:var(--vela-foreground)}@supports (color:color-mix(in lab, red, red)){.vela\:ring-foreground\/10{--tw-ring-color:color-mix(in oklab, var(--vela-foreground) 10%, transparent)}}.vela\:outline-hidden{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.vela\:outline-hidden{outline-offset:2px;outline:2px solid #0000}}.vela\:transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--vela-default-transition-timing-function));transition-duration:var(--tw-duration,var(--vela-default-transition-duration))}.vela\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--vela-default-transition-timing-function));transition-duration:var(--tw-duration,var(--vela-default-transition-duration))}.vela\:transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--vela-default-transition-timing-function));transition-duration:var(--tw-duration,var(--vela-default-transition-duration))}.vela\:transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--vela-default-transition-timing-function));transition-duration:var(--tw-duration,var(--vela-default-transition-duration))}.vela\:duration-100{--tw-duration:.1s;transition-duration:.1s}.vela\:duration-150{--tw-duration:.15s;transition-duration:.15s}.vela\:duration-200{--tw-duration:.2s;transition-duration:.2s}.vela\:ease-in-out{--tw-ease:var(--vela-ease-in-out);transition-timing-function:var(--vela-ease-in-out)}.vela\:outline-none{--tw-outline-style:none;outline-style:none}.vela\:select-none{-webkit-user-select:none;user-select:none}@media (hover:hover){.vela\:group-hover\:text-bar-text:is(:where(.vela\:group):hover *){color:var(--cms-bar-text)}.vela\:group-hover\:opacity-100:is(:where(.vela\:group):hover *){opacity:1}}.vela\:group-focus\/menubar-item\:text-accent-foreground:is(:where(.vela\:group\/menubar-item):focus *){color:var(--vela-accent-foreground)}.vela\:group-data-\[state\=open\]\:rotate-180:is(:where(.vela\:group)[data-state=open] *){rotate:180deg}.vela\:placeholder\:text-bar-text-tertiary::placeholder{color:var(--cms-bar-text-tertiary)}@media (hover:hover){.vela\:hover\:bg-\[var\(--cms-bar-bg-hover\)\]:hover{background-color:var(--cms-bar-bg-hover)}.vela\:hover\:bg-\[var\(--cms-status-error-bg-hover\)\]:hover{background-color:var(--cms-status-error-bg-hover)}.vela\:hover\:bg-\[var\(--cms-status-warn-bg-hover\)\]:hover{background-color:var(--cms-status-warn-bg-hover)}.vela\:hover\:bg-destructive\/90:hover{background-color:var(--vela-destructive)}@supports (color:color-mix(in lab, red, red)){.vela\:hover\:bg-destructive\/90:hover{background-color:color-mix(in oklab, var(--vela-destructive) 90%, transparent)}}.vela\:hover\:bg-muted:hover{background-color:var(--vela-muted)}.vela\:hover\:bg-primary\/90:hover{background-color:var(--vela-primary)}@supports (color:color-mix(in lab, red, red)){.vela\:hover\:bg-primary\/90:hover{background-color:color-mix(in oklab, var(--vela-primary) 90%, transparent)}}.vela\:hover\:bg-secondary\/80:hover{background-color:var(--vela-secondary)}@supports (color:color-mix(in lab, red, red)){.vela\:hover\:bg-secondary\/80:hover{background-color:color-mix(in oklab, var(--vela-secondary) 80%, transparent)}}.vela\:hover\:text-\[var\(--cms-status-error-text-hover\)\]:hover{color:var(--cms-status-error-text-hover)}.vela\:hover\:text-bar-text:hover{color:var(--cms-bar-text)}.vela\:hover\:text-bar-text-secondary:hover{color:var(--cms-bar-text-secondary)}.vela\:hover\:underline:hover{text-decoration-line:underline}.vela\:hover\:ring-2:hover{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:hover\:ring-\[var\(--cms-accent\,\#534ab7\)\]:hover{--tw-ring-color:var(--cms-accent,#534ab7)}}.vela\:focus\:border-\[var\(--cms-accent\)\]:focus{border-color:var(--cms-accent)}.vela\:focus\:bg-\[var\(--cms-bar-bg-hover\)\]:focus{background-color:var(--cms-bar-bg-hover)}.vela\:focus\:bg-\[var\(--cms-status-error-bg-hover\)\]:focus{background-color:var(--cms-status-error-bg-hover)}.vela\:focus\:bg-accent:focus{background-color:var(--vela-accent)}.vela\:focus\:text-\[var\(--cms-status-error-text-hover\)\]:focus{color:var(--cms-status-error-text-hover)}.vela\:focus\:text-accent-foreground:focus{color:var(--vela-accent-foreground)}.vela\:focus\:text-bar-text:focus{color:var(--cms-bar-text)}.vela\:focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:focus\:ring-\[var\(--cms-accent\)\]:focus{--tw-ring-color:var(--cms-accent)}.vela\:focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}:is(.vela\:focus\:\*\*\:text-accent-foreground:focus *),:is(.vela\:not-data-\[variant\=destructive\]\:focus\:\*\*\:text-accent-foreground:not([data-variant=destructive]):focus *){color:var(--vela-accent-foreground)}.vela\:focus-visible\:bg-\[var\(--cms-bar-bg-hover\)\]:focus-visible{background-color:var(--cms-bar-bg-hover)}.vela\:focus-visible\:ring-1:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:focus-visible\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:focus-visible\:ring-\[var\(--cms-accent\)\]:focus-visible{--tw-ring-color:var(--cms-accent)}.vela\:focus-visible\:ring-ring:focus-visible{--tw-ring-color:var(--vela-ring)}.vela\:focus-visible\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.vela\:disabled\:pointer-events-none:disabled{pointer-events:none}.vela\:disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.vela\:disabled\:opacity-50:disabled{opacity:.5}.vela\:disabled\:opacity-60:disabled{opacity:.6}.vela\:aria-expanded\:bg-\[var\(--cms-bar-bg-hover\)\][aria-expanded=true]{background-color:var(--cms-bar-bg-hover)}.vela\:aria-expanded\:bg-muted[aria-expanded=true]{background-color:var(--vela-muted)}.vela\:aria-expanded\:text-bar-text[aria-expanded=true]{color:var(--cms-bar-text)}.vela\:aria-expanded\:text-bar-text-secondary[aria-expanded=true]{color:var(--cms-bar-text-secondary)}.vela\:aria-expanded\:ring-2[aria-expanded=true]{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.vela\:aria-expanded\:ring-\[var\(--cms-accent\)\][aria-expanded=true]{--tw-ring-color:var(--cms-accent)}.vela\:aria-expanded\:ring-offset-2[aria-expanded=true]{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.vela\:aria-expanded\:ring-offset-\[var\(--cms-bar-bg\)\][aria-expanded=true]{--tw-ring-offset-color:var(--cms-bar-bg)}.vela\:data-closed\:animate-out[data-closed]{animation:exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.vela\:data-closed\:fade-out-0[data-closed]{--tw-exit-opacity:0}.vela\:data-closed\:zoom-out-95[data-closed]{--tw-exit-scale:.95}.vela\:data-disabled\:pointer-events-none[data-disabled]{pointer-events:none}.vela\:data-disabled\:opacity-40[data-disabled]{opacity:.4}.vela\:data-disabled\:opacity-50[data-disabled]{opacity:.5}.vela\:data-highlighted\:bg-\[var\(--cms-bar-bg-hover\)\][data-highlighted]{background-color:var(--cms-bar-bg-hover)}.vela\:data-inset\:pl-7[data-inset]{padding-left:calc(var(--vela-spacing) * 7)}.vela\:data-open\:animate-in[data-open]{animation:enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.vela\:data-open\:bg-accent[data-open]{background-color:var(--vela-accent)}.vela\:data-open\:text-accent-foreground[data-open]{color:var(--vela-accent-foreground)}.vela\:data-open\:fade-in-0[data-open]{--tw-enter-opacity:0}.vela\:data-open\:zoom-in-95[data-open]{--tw-enter-scale:.95}.vela\:data-placeholder\:text-bar-text-tertiary[data-placeholder]{color:var(--cms-bar-text-tertiary)}.vela\:data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.vela\:data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}.vela\:data-\[inset\]\:ps-8[data-inset]{padding-inline-start:calc(var(--vela-spacing) * 8)}.vela\:data-\[orientation\=horizontal\]\:h-px[data-orientation=horizontal]{height:1px}.vela\:data-\[orientation\=horizontal\]\:w-full[data-orientation=horizontal]{width:100%}.vela\:data-\[orientation\=vertical\]\:h-full[data-orientation=vertical]{height:100%}.vela\:data-\[orientation\=vertical\]\:w-px[data-orientation=vertical]{width:1px}.vela\:data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom]{--tw-enter-translate-y:calc(var(--vela-spacing) * 2*-1)}.vela\:data-\[side\=left\]\:slide-in-from-right-2[data-side=left]{--tw-enter-translate-x:calc(var(--vela-spacing) * 2)}.vela\:data-\[side\=right\]\:slide-in-from-left-2[data-side=right]{--tw-enter-translate-x:calc(var(--vela-spacing) * 2*-1)}.vela\:data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top]{--tw-enter-translate-y:calc(var(--vela-spacing) * 2)}.vela\:data-\[size\=default\]\:h-7[data-size=default]{height:calc(var(--vela-spacing) * 7)}.vela\:data-\[size\=sm\]\:h-6[data-size=sm]{height:calc(var(--vela-spacing) * 6)}.vela\:data-\[state\=active\]\:bg-bar-bg[data-state=active]{background-color:var(--cms-bar-bg)}.vela\:data-\[state\=active\]\:text-bar-text[data-state=active]{color:var(--cms-bar-text)}.vela\:data-\[state\=checked\]\:translate-x-4[data-state=checked]{--tw-translate-x:calc(var(--vela-spacing) * 4);translate:var(--tw-translate-x) var(--tw-translate-y)}.vela\:data-\[state\=checked\]\:border-\[var\(--cms-accent\)\][data-state=checked]{border-color:var(--cms-accent)}.vela\:data-\[state\=checked\]\:bg-\[var\(--cms-accent\)\][data-state=checked]{background-color:var(--cms-accent)}.vela\:data-\[state\=checked\]\:text-white[data-state=checked]{color:var(--vela-color-white)}.vela\:data-\[state\=closed\]\:animate-out[data-state=closed]{animation:exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.vela\:data-\[state\=closed\]\:duration-200[data-state=closed]{--tw-duration:.2s;transition-duration:.2s}.vela\:data-\[state\=closed\]\:fade-out-0[data-state=closed]{--tw-exit-opacity:0}.vela\:data-\[state\=closed\]\:zoom-out-95[data-state=closed]{--tw-exit-scale:.95}.vela\:data-\[state\=closed\]\:slide-out-to-bottom[data-state=closed]{--tw-exit-translate-y:100%}.vela\:data-\[state\=closed\]\:slide-out-to-left[data-state=closed]{--tw-exit-translate-x:-100%}.vela\:data-\[state\=closed\]\:slide-out-to-right[data-state=closed]{--tw-exit-translate-x:100%}.vela\:data-\[state\=closed\]\:slide-out-to-top[data-state=closed]{--tw-exit-translate-y:-100%}.vela\:data-\[state\=indeterminate\]\:bg-\[var\(--cms-accent\)\][data-state=indeterminate]{background-color:var(--cms-accent)}.vela\:data-\[state\=indeterminate\]\:text-white[data-state=indeterminate]{color:var(--vela-color-white)}.vela\:data-\[state\=open\]\:animate-in[data-state=open]{animation:enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.vela\:data-\[state\=open\]\:duration-300[data-state=open]{--tw-duration:.3s;transition-duration:.3s}.vela\:data-\[state\=open\]\:fade-in-0[data-state=open]{--tw-enter-opacity:0}.vela\:data-\[state\=open\]\:zoom-in-95[data-state=open]{--tw-enter-scale:.95}.vela\:data-\[state\=open\]\:slide-in-from-bottom[data-state=open]{--tw-enter-translate-y:100%}.vela\:data-\[state\=open\]\:slide-in-from-left[data-state=open]{--tw-enter-translate-x:-100%}.vela\:data-\[state\=open\]\:slide-in-from-right[data-state=open]{--tw-enter-translate-x:100%}.vela\:data-\[state\=open\]\:slide-in-from-top[data-state=open]{--tw-enter-translate-y:-100%}.vela\:data-\[state\=unchecked\]\:translate-x-0\.5[data-state=unchecked]{--tw-translate-x:calc(var(--vela-spacing) * .5);translate:var(--tw-translate-x) var(--tw-translate-y)}.vela\:data-\[state\=unchecked\]\:bg-\[var\(--cms-bar-divider\)\][data-state=unchecked]{background-color:var(--cms-bar-divider)}.vela\:data-\[variant\=destructive\]\:text-destructive[data-variant=destructive]{color:var(--vela-destructive)}.vela\:data-\[variant\=destructive\]\:focus\:bg-destructive\/10[data-variant=destructive]:focus{background-color:var(--vela-destructive)}@supports (color:color-mix(in lab, red, red)){.vela\:data-\[variant\=destructive\]\:focus\:bg-destructive\/10[data-variant=destructive]:focus{background-color:color-mix(in oklab, var(--vela-destructive) 10%, transparent)}}.vela\:data-\[variant\=destructive\]\:focus\:text-destructive[data-variant=destructive]:focus{color:var(--vela-destructive)}@media (min-width:40rem){.vela\:sm\:mx-auto{margin-inline:auto}.vela\:sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (prefers-color-scheme:dark){.vela\:dark\:data-\[variant\=destructive\]\:focus\:bg-destructive\/20[data-variant=destructive]:focus{background-color:var(--vela-destructive)}@supports (color:color-mix(in lab, red, red)){.vela\:dark\:data-\[variant\=destructive\]\:focus\:bg-destructive\/20[data-variant=destructive]:focus{background-color:color-mix(in oklab, var(--vela-destructive) 20%, transparent)}}}.vela\:\[\&_svg\]\:pointer-events-none svg{pointer-events:none}.vela\:\[\&_svg\]\:shrink-0 svg{flex-shrink:0}.vela\:\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-3 svg:not([class*=size-]){width:calc(var(--vela-spacing) * 3);height:calc(var(--vela-spacing) * 3)}.vela\:\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*=size-]){width:calc(var(--vela-spacing) * 4);height:calc(var(--vela-spacing) * 4)}:is(.vela\:data-\[variant\=destructive\]\:\*\:\[svg\]\:text-destructive\![data-variant=destructive]>*):is(svg){color:var(--vela-destructive)!important}}@property --tw-animation-delay{syntax:"*";inherits:false;initial-value:0s}@property --tw-animation-direction{syntax:"*";inherits:false;initial-value:normal}@property --tw-animation-duration{syntax:"*";inherits:false}@property --tw-animation-fill-mode{syntax:"*";inherits:false;initial-value:none}@property --tw-animation-iteration-count{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-blur{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-blur{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-translate-y{syntax:"*";inherits:false;initial-value:0}@keyframes bar-pulse{0%,to{opacity:1}50%{opacity:.6}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0)scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1))rotate(var(--tw-enter-rotate,0));filter:blur(var(--tw-enter-blur,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0),var(--tw-exit-translate-y,0),0)scale3d(var(--tw-exit-scale,1),var(--tw-exit-scale,1),var(--tw-exit-scale,1))rotate(var(--tw-exit-rotate,0));filter:blur(var(--tw-exit-blur,0))}}
 }

package/dist/components/admin-bar/field-input.svelte

@@ -177,7 +177,7 @@
 			>
 				<option value="">—</option>
 				{#each values as v (v)}
-					<option value={v}>{v}</option>
+					<option value={v}>{names?.[v] ?? v}</option>
 				{/each}
 			</select>
 		{:else if type === 'image'}

package/dist/components/admin-bar/structured-editor-popover.svelte

@@ -251,9 +251,27 @@
 		line-height: 1.4;
 		white-space: nowrap;
 	}
-	.cms-structured-edit:hover :global(.cms-structured-edit__trigger),
-	.cms-structured-edit:focus-within :global(.cms-structured-edit__trigger),
-	.cms-structured-edit[data-open] :global(.cms-structured-edit__trigger) {
+	.cms-structured-edit:hover > :global(.cms-structured-edit__trigger),
+	.cms-structured-edit:focus-within > :global(.cms-structured-edit__trigger),
+	.cms-structured-edit[data-open] > :global(.cms-structured-edit__trigger) {
 		display: inline-flex;
 	}
+	/* A slot inside another (form fields inside a WhatsApp form): the
+	   innermost one being pointed at or typed in owns the outline and the
+	   pencil, so the two pencils never stack in the same corner. The inner
+	   slot is another instance, rendered through a snippet, so the compiler
+	   cannot see it: hence `:global` inside `:has`. */
+	.cms-structured-edit:not([data-open]):has(
+			:global(.cms-structured-edit:hover),
+			:global(.cms-structured-edit:focus-within)
+		) {
+		outline: 1px dashed rgba(127, 127, 127, 0.6);
+	}
+	.cms-structured-edit:not([data-open]):has(
+			:global(.cms-structured-edit:hover),
+			:global(.cms-structured-edit:focus-within)
+		)
+		> :global(.cms-structured-edit__trigger) {
+		display: none;
+	}
 </style>

package/dist/components/admin-bar/ui/badge/badge.svelte.d.ts

@@ -2,7 +2,7 @@ import type { WithElementRef } from 'bits-ui';
 import type { HTMLAnchorAttributes, HTMLAttributes } from 'svelte/elements';
 import { type VariantProps } from '../../variants.js';
 export declare const badgeVariants: (props?: {
-    variant?: "default" | "destructive" | "warn" | "success" | "edit" | undefined;
+    variant?: "default" | "destructive" | "success" | "warn" | "edit" | undefined;
     size?: "default" | "sm" | undefined;
 }) => string;
 export type BadgeVariant = VariantProps<typeof badgeVariants>['variant'];

package/dist/components/cms/cms-form-controls.svelte

@@ -0,0 +1,23 @@
+<script lang="ts">
+	/**
+	 * The fields a form sends for the endpoint rather than the submission:
+	 * where to go after a post without JavaScript, the load-time token, and
+	 * a honeypot that only bots fill in. The hosted endpoint reads and drops
+	 * all three; a same-app action can do the same or ignore them.
+	 */
+	type Props = { redirect?: string; token: string | null };
+	let { redirect, token }: Props = $props();
+</script>
+
+{#if redirect}
+	<input type="hidden" name="_redirect" value={redirect} />
+{/if}
+{#if token}
+	<input type="hidden" name="_token" value={token} />
+{/if}
+<div
+	aria-hidden="true"
+	style="position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden"
+>
+	<input type="text" name="_gotcha" tabindex="-1" autocomplete="off" />
+</div>

package/dist/components/cms/cms-form-controls.svelte.d.ts

@@ -0,0 +1,13 @@
+/**
+ * The fields a form sends for the endpoint rather than the submission:
+ * where to go after a post without JavaScript, the load-time token, and
+ * a honeypot that only bots fill in. The hosted endpoint reads and drops
+ * all three; a same-app action can do the same or ignore them.
+ */
+type Props = {
+    redirect?: string;
+    token: string | null;
+};
+declare const CmsFormControls: import("svelte").Component<Props, {}, "">;
+type CmsFormControls = ReturnType<typeof CmsFormControls>;
+export default CmsFormControls;

package/dist/components/cms/cms-form-fields.svelte

@@ -0,0 +1,68 @@
+<script lang="ts" module>
+	/** `CmsFormFields`: a form's inputs as content editors can change. */
+	export * from '../../core/shapes/form-fields.js';
+</script>
+
+<script lang="ts">
+	/**
+	 * Goes inside a `CmsForm` or `CmsWhatsAppForm`. Renders one input per
+	 * field through the template's `field` snippet, or plain labelled inputs
+	 * without one. Editors add, remove, reorder and retype fields from the
+	 * pencil; each field's submitted `name` stays put (see the shape).
+	 */
+	import type { Snippet } from 'svelte';
+	import Structured from './cms-structured.svelte';
+	import {
+		cmsFormFields,
+		formFieldsView,
+		type CmsFormFieldItem,
+		type CmsFormFieldsValue
+	} from '../../core/shapes/form-fields.js';
+
+	type Props = {
+		name: string;
+		scope?: string;
+		/** The full value, or a bare field list. */
+		fallback?: Partial<CmsFormFieldsValue> | Array<Partial<CmsFormFieldItem>>;
+		value?: unknown;
+		field?: Snippet<[CmsFormFieldItem]>;
+	};
+	let { name, scope, fallback, value, field }: Props = $props();
+</script>
+
+{#snippet plain(f: CmsFormFieldItem)}
+	<label class="cms-form-field" data-type={f.type}>
+		{#if f.type === 'checkbox'}
+			<input type="checkbox" name={f.name} value="yes" required={f.required} />
+			<span>{f.label}</span>
+		{:else}
+			<span>{f.label}</span>
+			{#if f.type === 'textarea'}
+				<textarea name={f.name} required={f.required} placeholder={f.placeholder || undefined}
+				></textarea>
+			{:else if f.type === 'select'}
+				<select name={f.name} required={f.required}>
+					<option value="">{f.placeholder}</option>
+					{#each f.options as option, i (i)}
+						<option>{option}</option>
+					{/each}
+				</select>
+			{:else}
+				<input
+					type={f.type}
+					name={f.name}
+					required={f.required}
+					placeholder={f.placeholder || undefined}
+				/>
+			{/if}
+		{/if}
+	</label>
+{/snippet}
+
+<Structured schema={cmsFormFields} {name} {scope} {fallback} {value} view={formFieldsView}>
+	{#snippet children(fields)}
+		{#each fields as f (f.id)}
+			{@render (field ?? plain)(f)}
+		{/each}
+	{/snippet}
+</Structured>

package/dist/components/cms/cms-form-fields.svelte.d.ts

@@ -0,0 +1,21 @@
+/** `CmsFormFields`: a form's inputs as content editors can change. */
+export * from '../../core/shapes/form-fields.js';
+/**
+     * Goes inside a `CmsForm` or `CmsWhatsAppForm`. Renders one input per
+     * field through the template's `field` snippet, or plain labelled inputs
+     * without one. Editors add, remove, reorder and retype fields from the
+     * pencil; each field's submitted `name` stays put (see the shape).
+     */
+import type { Snippet } from 'svelte';
+import { type CmsFormFieldItem, type CmsFormFieldsValue } from '../../core/shapes/form-fields.js';
+type Props = {
+    name: string;
+    scope?: string;
+    /** The full value, or a bare field list. */
+    fallback?: Partial<CmsFormFieldsValue> | Array<Partial<CmsFormFieldItem>>;
+    value?: unknown;
+    field?: Snippet<[CmsFormFieldItem]>;
+};
+declare const CmsFormFields: import("svelte").Component<Props, {}, "">;
+type CmsFormFields = ReturnType<typeof CmsFormFields>;
+export default CmsFormFields;

package/dist/components/cms/cms-form.svelte

@@ -0,0 +1,99 @@
+<script lang="ts" module>
+	import type { FormStatus } from './use-form-target.svelte.js';
+
+	export type { FormStatus as CmsFormStatus };
+
+	/** What `children` gets: how the last submission went. */
+	export type CmsFormState = {
+		readonly status: FormStatus;
+		/** The endpoint's or action's message on `failure` / `error`. */
+		readonly message: string | null;
+		/** The action's returned data on `success` / `failure`. */
+		readonly data: Record<string, unknown> | null;
+	};
+</script>
+
+<script lang="ts">
+	/**
+	 * `CmsForm`: a form that posts to a hosted form by `key`, or to the
+	 * template's own `action`. The inputs are the template's children.
+	 *
+	 * It is a real `<form method="POST">`, so it works without JavaScript;
+	 * with it, `use:enhance` posts in place and `children` sees the status.
+	 * The hosted endpoint answers enhanced posts the way a SvelteKit action
+	 * does, so both destinations behave the same. Results are handled here
+	 * rather than by the default callback, which would reload the page's data
+	 * on success and send a network failure to the error page.
+	 */
+	import type { Snippet } from 'svelte';
+	import type { HTMLFormAttributes } from 'svelte/elements';
+	import { enhance, type SubmitFunction } from '$app/forms';
+	import { cmsStore } from './cms-store.svelte.js';
+	import { followRedirect, useFormTarget } from './use-form-target.svelte.js';
+	import FormControls from './cms-form-controls.svelte';
+
+	type Props = Omit<HTMLFormAttributes, 'action' | 'method' | 'children'> & {
+		/** A hosted form's key, as the template manifest declares it. */
+		key?: string;
+		/** Post here instead: a route, or a SvelteKit action like `?/contact`. */
+		action?: string;
+		/** Where to go after a successful submission. */
+		redirect?: string;
+		children: Snippet<[CmsFormState]>;
+	};
+	let { key, action, redirect, children, ...rest }: Props = $props();
+
+	const target = useFormTarget(() => ({ key, action }));
+
+	let status = $state<FormStatus>('idle');
+	let message = $state<string | null>(null);
+	let data = $state<Record<string, unknown> | null>(null);
+	const formState: CmsFormState = {
+		get status() {
+			return status;
+		},
+		get message() {
+			return message;
+		},
+		get data() {
+			return data;
+		}
+	};
+
+	const messageOf = (value: unknown): string | null =>
+		value && typeof value === 'object' && 'message' in value && typeof value.message === 'string'
+			? value.message
+			: null;
+
+	const submit: SubmitFunction = ({ cancel }) => {
+		// Editors are changing the page, not filling it in.
+		if (cmsStore.isEditing) return cancel();
+		status = 'submitting';
+		message = null;
+		data = null;
+		return async ({ result, formElement, update }) => {
+			if (result.type === 'success') {
+				status = 'success';
+				data = result.data ?? null;
+				formElement.reset();
+				if (redirect) await followRedirect(redirect);
+			} else if (result.type === 'failure') {
+				status = 'failure';
+				data = result.data ?? null;
+				message = messageOf(result.data);
+			} else if (result.type === 'redirect') {
+				// A same-app action redirected; let SvelteKit follow it.
+				status = 'success';
+				await update();
+			} else {
+				status = 'error';
+				message = messageOf(result.error);
+			}
+		};
+	};
+</script>
+
+<form {...rest} method="POST" action={target.url} use:enhance={submit}>
+	<FormControls {redirect} token={target.token} />
+	{@render children(formState)}
+</form>