@velastack/cms 0.5.0 → 0.5.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +66 -43
- package/dist/components/admin-bar/admin-bar.css +1 -1
- package/dist/components/admin-bar/field-input.svelte +20 -1
- package/dist/components/admin-bar/field-input.svelte.d.ts +2 -1
- package/dist/components/admin-bar/fields-form.svelte +218 -0
- package/dist/components/admin-bar/fields-form.svelte.d.ts +16 -0
- package/dist/components/admin-bar/link-input.svelte +102 -0
- package/dist/components/admin-bar/link-input.svelte.d.ts +9 -0
- package/dist/components/admin-bar/list-field.svelte +93 -0
- package/dist/components/admin-bar/list-field.svelte.d.ts +20 -0
- package/dist/components/admin-bar/locales-panel.svelte +1 -1
- package/dist/components/admin-bar/page-options.d.ts +24 -0
- package/dist/components/admin-bar/page-options.js +53 -0
- package/dist/components/admin-bar/rich-text-input.svelte +92 -0
- package/dist/components/admin-bar/rich-text-input.svelte.d.ts +9 -0
- package/dist/components/admin-bar/structured-editor-popover.svelte +15 -6
- package/dist/components/cms/cms-collection.svelte +46 -0
- package/dist/components/cms/cms-collection.svelte.d.ts +25 -0
- package/dist/components/cms/cms-contact.svelte +26 -0
- package/dist/components/cms/cms-contact.svelte.d.ts +14 -0
- package/dist/components/cms/cms-faq.svelte +22 -0
- package/dist/components/cms/cms-faq.svelte.d.ts +15 -0
- package/dist/components/cms/cms-gallery.svelte +31 -0
- package/dist/components/cms/cms-gallery.svelte.d.ts +16 -0
- package/dist/components/cms/cms-hours-editable.svelte +160 -0
- package/dist/components/cms/cms-hours-editable.svelte.d.ts +17 -0
- package/dist/components/cms/cms-hours.svelte +42 -0
- package/dist/components/cms/cms-hours.svelte.d.ts +19 -0
- package/dist/components/cms/cms-image.svelte +3 -25
- package/dist/components/cms/cms-image.svelte.d.ts +3 -11
- package/dist/components/cms/cms-link-editable.svelte +4 -60
- package/dist/components/cms/cms-link.svelte +3 -23
- package/dist/components/cms/cms-link.svelte.d.ts +3 -10
- package/dist/components/cms/cms-logos.svelte +29 -0
- package/dist/components/cms/cms-logos.svelte.d.ts +16 -0
- package/dist/components/cms/cms-nav.svelte +22 -0
- package/dist/components/cms/cms-nav.svelte.d.ts +15 -0
- package/dist/components/cms/cms-pricing.svelte +36 -0
- package/dist/components/cms/cms-pricing.svelte.d.ts +14 -0
- package/dist/components/cms/cms-schedule.svelte +35 -0
- package/dist/components/cms/cms-schedule.svelte.d.ts +16 -0
- package/dist/components/cms/cms-social-links.svelte +35 -0
- package/dist/components/cms/cms-social-links.svelte.d.ts +15 -0
- package/dist/components/cms/cms-stats.svelte +31 -0
- package/dist/components/cms/cms-stats.svelte.d.ts +16 -0
- package/dist/components/cms/cms-steps.svelte +31 -0
- package/dist/components/cms/cms-steps.svelte.d.ts +16 -0
- package/dist/components/cms/cms-structured-editable.svelte +29 -0
- package/dist/components/cms/{cms-repeater-editable.svelte.d.ts → cms-structured-editable.svelte.d.ts} +12 -8
- package/dist/components/cms/cms-structured.svelte +50 -0
- package/dist/components/cms/cms-structured.svelte.d.ts +49 -0
- package/dist/components/cms/cms-team.svelte +22 -0
- package/dist/components/cms/cms-team.svelte.d.ts +15 -0
- package/dist/components/cms/cms-testimonials.svelte +36 -0
- package/dist/components/cms/cms-testimonials.svelte.d.ts +15 -0
- package/dist/components/cms/cms-timeline.svelte +35 -0
- package/dist/components/cms/cms-timeline.svelte.d.ts +16 -0
- package/dist/components/cms/index.d.ts +15 -1
- package/dist/components/cms/index.js +15 -1
- package/dist/core/shapes/collection.d.ts +60 -0
- package/dist/core/shapes/collection.js +194 -0
- package/dist/core/shapes/contact.d.ts +70 -0
- package/dist/core/shapes/contact.js +214 -0
- package/dist/core/shapes/faq.d.ts +12 -0
- package/dist/core/shapes/faq.js +48 -0
- package/dist/core/shapes/form.d.ts +46 -0
- package/dist/core/shapes/form.js +7 -0
- package/dist/core/shapes/hours.d.ts +91 -0
- package/dist/core/shapes/hours.js +325 -0
- package/dist/core/shapes/image.d.ts +15 -0
- package/dist/core/shapes/image.js +27 -0
- package/dist/core/shapes/index.d.ts +31 -0
- package/dist/core/shapes/index.js +13 -0
- package/dist/core/shapes/link.d.ts +15 -0
- package/dist/core/shapes/link.js +42 -0
- package/dist/core/shapes/nav.d.ts +21 -0
- package/dist/core/shapes/nav.js +71 -0
- package/dist/core/shapes/presets.d.ts +65 -0
- package/dist/core/shapes/presets.js +152 -0
- package/dist/core/shapes/pricing.d.ts +40 -0
- package/dist/core/shapes/pricing.js +115 -0
- package/dist/core/shapes/social-links.d.ts +19 -0
- package/dist/core/shapes/social-links.js +83 -0
- package/dist/core/shapes/team.d.ts +22 -0
- package/dist/core/shapes/team.js +70 -0
- package/dist/core/shapes/testimonials.d.ts +24 -0
- package/dist/core/shapes/testimonials.js +86 -0
- package/dist/{components/cms → core}/structured-registry.d.ts +2 -2
- package/dist/core/structured.d.ts +33 -10
- package/dist/core/structured.js +98 -47
- package/dist/editor.d.ts +4 -0
- package/dist/editor.js +4 -0
- package/dist/index.d.ts +22 -8
- package/dist/index.js +24 -5
- package/package.json +1 -1
- package/dist/components/cms/cms-repeater-editable.svelte +0 -137
- package/dist/components/cms/cms-repeater.svelte +0 -52
- package/dist/components/cms/cms-repeater.svelte.d.ts +0 -31
- /package/dist/{components/cms → core}/structured-registry.js +0 -0
package/README.md
CHANGED
|
@@ -238,70 +238,93 @@ Rendered with `{@html}`. Edit mode swaps for a `<textarea>`.
|
|
|
238
238
|
|
|
239
239
|
Renders an `<img>`. Edit mode shows the current image plus a URL input.
|
|
240
240
|
|
|
241
|
-
|
|
241
|
+
## Structured components
|
|
242
|
+
|
|
243
|
+
Hours, navigation, a team, a price list: one value with a fixed shape, edited in a slot-anchored popover and rendered by the template through a snippet. Every structured component is headless: it reads the value at `name`, normalizes it, derives the view a template needs and hands it to `children`. It never emits markup of its own.
|
|
242
244
|
|
|
243
245
|
```svelte
|
|
244
|
-
<
|
|
245
|
-
{
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
246
|
+
<script lang="ts">
|
|
247
|
+
import { CmsHours, CmsNav, isActive } from '@velastack/cms';
|
|
248
|
+
</script>
|
|
249
|
+
|
|
250
|
+
<!-- In the root layout: site-wide by construction. -->
|
|
251
|
+
<CmsNav name="nav.primary">
|
|
252
|
+
{#snippet children(items)}
|
|
253
|
+
{#each items as item (item.id)}
|
|
254
|
+
<a href={item.href} aria-current={isActive(item, page.url) ? 'page' : undefined}
|
|
255
|
+
>{item.label}</a
|
|
256
|
+
>
|
|
257
|
+
{/each}
|
|
258
|
+
{/snippet}
|
|
259
|
+
</CmsNav>
|
|
260
|
+
|
|
261
|
+
<!-- On the contact page: the same value, read and written through the root scope. -->
|
|
262
|
+
<CmsHours name="hours" scope="root">
|
|
263
|
+
{#snippet children(h)}
|
|
264
|
+
<p>{h.today.label}: {h.today.text} · {h.status}</p>
|
|
265
|
+
{#each h.rows as row (row.id)}<dt>{row.days}</dt>
|
|
266
|
+
<dd>{row.text}</dd>{/each}
|
|
252
267
|
{/snippet}
|
|
253
|
-
</
|
|
268
|
+
</CmsHours>
|
|
254
269
|
```
|
|
255
270
|
|
|
256
|
-
|
|
271
|
+
| Component | Value | Snippet receives | Helpers |
|
|
272
|
+
| ------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------- | ------------------------------------------------------- |
|
|
273
|
+
| `CmsNav` | `{ items: [{ id, label, link, children }] }` | items with resolved `href` | `isActive(item, url)` |
|
|
274
|
+
| `CmsHours` | week grid, `exceptions`, `note`, `labels`, `timezone` | `rows`, `today`, `isOpenNow`, `status`, `exceptionRows` in the visitor's locale | `toOpeningHoursSpecification` |
|
|
275
|
+
| `CmsContact` | `name`, `address`, `phones`, `emails`, `whatsapp`, `directionsUrl`, `geo`, `labels` | plus `telHref`, `mailto`, `whatsappHref`, `mapsHref`, `formattedAddress` | `toPostalAddress` |
|
|
276
|
+
| `CmsSocialLinks` | `{ items: [{ id, platform, url, label }] }` | items with `name` (label or platform name) | `toSameAs`, `SOCIAL_PLATFORMS` |
|
|
277
|
+
| `CmsCollection` | rooms, services, tours: title, summary, body, image, gallery, price, link, tags, features, `details` key-value list, featured, hidden | visible items with `href`; props `limit`, `featured`, `tag` slice them | `formatCollectionPrice`, `collectionTags`, `toItemList` |
|
|
278
|
+
| `CmsTeam` | name, role, rich bio, photo, email, phone, profile links | members | |
|
|
279
|
+
| `CmsTestimonials` | rich quote, author, role, company, photo, rating, source, date | testimonials | `toReview` |
|
|
280
|
+
| `CmsPricing` | `currency`, `labels.custom`, tiers with a feature checklist and a CTA | tiers with `priceText` and `href` | `formatPrice` |
|
|
281
|
+
| `CmsFaq` | question, rich answer | questions | `toFaqPage` |
|
|
282
|
+
| `CmsStats`, `CmsSteps`, `CmsTimeline`, `CmsGallery`, `CmsLogos`, `CmsSchedule` | fixed list presets | items | `logosView`, `scheduleByDay` |
|
|
257
283
|
|
|
258
|
-
|
|
284
|
+
Templates use only these exports; there is no open item schema. A shape outside the presets is a new preset in the package. `fallback` takes the full value or a bare item list and is normalized like a stored value, so a hand-written seed with missing fields is safe. Prices, times, dates and day names format in the visitor's locale; `isOpenNow` is computed when the page renders, so a prerendered page shows the state at build time.
|
|
259
285
|
|
|
260
|
-
|
|
286
|
+
Every value type (`CmsHoursValue`, `NavItem`, …), schema (`cmsHours`, …) and JSON-LD helper is exported from the package root.
|
|
261
287
|
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
288
|
+
### Building one
|
|
289
|
+
|
|
290
|
+
The package ships the pieces a structured component is made of, and the components above are built from nothing else.
|
|
265
291
|
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
292
|
+
```ts
|
|
293
|
+
// The value's rules: a versioned shape, its translatable strings, and the form the popover draws.
|
|
294
|
+
import { defineForm, asItems, asString } from '@velastack/cms';
|
|
295
|
+
|
|
296
|
+
export const cmsFaq = defineForm<CmsFaqValue>({
|
|
297
|
+
component: 'CmsFaq', // canonical export name, recorded in the manifest
|
|
298
|
+
label: 'FAQ', // popover header
|
|
299
|
+
version: 1, // written as `v` on every value
|
|
300
|
+
translatable: [], // root fields that translate (dotted paths allowed: 'labels.closed')
|
|
301
|
+
items: { key: 'items', translatable: ['question', 'answer'] }, // lists and their translatable fields; nest `items` for lists inside items
|
|
302
|
+
normalize: (raw) => ({ v: 1, items: asItems(raw?.items, …) }),
|
|
303
|
+
empty: () => ({ v: 1, items: [] }),
|
|
304
|
+
fields: [{ key: 'items', type: 'list', label: 'Questions', itemLabel: 'question', titleKey: 'question', blank: () => ({ question: '', answer: '' }), fields: [
|
|
305
|
+
{ key: 'question', label: 'Question', type: 'text' },
|
|
306
|
+
{ key: 'answer', label: 'Answer', type: 'html' }
|
|
307
|
+
] }]
|
|
308
|
+
});
|
|
276
309
|
```
|
|
277
310
|
|
|
278
311
|
```svelte
|
|
279
|
-
<!--
|
|
312
|
+
<!-- The display component, inside the package: the generic one, given the schema and a view function. -->
|
|
280
313
|
<script lang="ts">
|
|
281
|
-
import
|
|
282
|
-
let { name, scope, fallback, children } = $props();
|
|
283
|
-
const field = useCmsField(
|
|
284
|
-
() => ({ name, scope }),
|
|
285
|
-
(raw) => hours.read(raw, fallback)
|
|
286
|
-
);
|
|
314
|
+
import Structured from './cms-structured.svelte'; // src/lib/components/cms, inside the package
|
|
315
|
+
let { name, scope, fallback, value, children } = $props();
|
|
287
316
|
</script>
|
|
288
317
|
|
|
289
|
-
{
|
|
290
|
-
{#await import('./cms-hours-editable.svelte') then { default: Editable }}
|
|
291
|
-
<Editable {field} {children} />
|
|
292
|
-
{/await}
|
|
293
|
-
{:else}
|
|
294
|
-
{@render children(field.current)}
|
|
295
|
-
{/if}
|
|
318
|
+
<Structured schema={cmsFaq} {name} {scope} {fallback} {value} view={faqView} {children} />
|
|
296
319
|
```
|
|
297
320
|
|
|
298
|
-
|
|
321
|
+
Field types: `text`, `long-string`, `html` (TipTap), `number`, `boolean`, `date`, `time`, `url`, `image` and `images` (media picker, alt text), `enum`, `link` (page picker or URL, new tab), `strings` (one per line), `rating`, `list` (collapsible cards with reorder). `group` puts a field in a tab; `half` shares a row with the next field. A bespoke editor (the hours week grid) wraps `StructuredEditorPopover` from `@velastack/cms/editor` and renders `FieldsForm` for the rest; `FieldInput`, `ListField`, `LinkInput`, `RichTextInput`, `ReorderButtons` and the Popover / Tabs / Switch / Checkbox / Sheet primitives are exported there too. The popover commits on **Done**; edit mode is page-wide and the bar's Save flushes the draft.
|
|
299
322
|
|
|
300
323
|
Rules every structured value follows (`core/structured.ts`):
|
|
301
324
|
|
|
302
325
|
- **Whole-object writes, explicit `null` clears.** Components never patch a leaf; they write the full `{ v, … }` object. Cleared fields are `null`.
|
|
303
|
-
- **List items carry a stable `id`** (`newItemId()`); reorder and delete work because arrays replace wholesale on merge.
|
|
304
|
-
- **Localisation is a string overlay.** The default locale stores the full value at `<name>`; every other locale stores only strings at `<name>.$t.<id>.<field>` (`_` is the id for root fields). `read()` folds the overlay in, structure never forks between languages, and the popover's locale tabs write only the overlay. The Locales panel counts translatable strings per locale for every structured usage on the current route.
|
|
326
|
+
- **List items carry a stable `id`** (`newItemId()`) at every nesting level; reorder and delete work because arrays replace wholesale on merge.
|
|
327
|
+
- **Localisation is a string overlay.** The default locale stores the full value at `<name>`; every other locale stores only strings at `<name>.$t.<id>.<field>` (`_` is the id for root fields, `field` may be a dotted path, and a string array translates per index as `tags.0`). `read()` folds the overlay in, structure never forks between languages, and the popover's locale tabs write only the overlay. The Locales panel counts translatable strings per locale for every structured usage on the current route.
|
|
305
328
|
|
|
306
329
|
### `<CmsEntries />`
|
|
307
330
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
@layer properties, theme, base, components, utilities;
|
|
2
2
|
@scope (.vela-admin-bar) {
|
|
3
3
|
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
|
|
4
|
-
@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-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-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\.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-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-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))}}
|
|
4
|
+
@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))}}
|
|
5
5
|
}
|
|
@@ -40,8 +40,9 @@
|
|
|
40
40
|
onChange: (next: unknown) => void;
|
|
41
41
|
label?: string;
|
|
42
42
|
placeholder?: string;
|
|
43
|
-
/** Options for `enum
|
|
43
|
+
/** Options for `enum`, and optional display names. */
|
|
44
44
|
values?: readonly string[];
|
|
45
|
+
names?: Readonly<Record<string, string>>;
|
|
45
46
|
/** Right-aligned text beside the label, e.g. a character counter. */
|
|
46
47
|
hint?: string;
|
|
47
48
|
hintClass?: string;
|
|
@@ -57,6 +58,7 @@
|
|
|
57
58
|
label,
|
|
58
59
|
placeholder = '',
|
|
59
60
|
values = [],
|
|
61
|
+
names,
|
|
60
62
|
hint,
|
|
61
63
|
hintClass,
|
|
62
64
|
endpoint,
|
|
@@ -85,6 +87,11 @@
|
|
|
85
87
|
return '';
|
|
86
88
|
});
|
|
87
89
|
const imageIsObject = $derived(!!value && typeof value === 'object');
|
|
90
|
+
const imageAlt = $derived(
|
|
91
|
+
imageIsObject && typeof (value as { alt?: unknown }).alt === 'string'
|
|
92
|
+
? ((value as { alt: string }).alt as string)
|
|
93
|
+
: ''
|
|
94
|
+
);
|
|
88
95
|
|
|
89
96
|
const setString = (raw: string) => onChange(raw === '' ? null : raw);
|
|
90
97
|
const setNumber = (raw: string) => {
|
|
@@ -96,6 +103,9 @@
|
|
|
96
103
|
if (imageIsObject) onChange({ ...(value as Record<string, unknown>), url: url || null });
|
|
97
104
|
else onChange(url === '' ? null : url);
|
|
98
105
|
};
|
|
106
|
+
const setAlt = (alt: string) => {
|
|
107
|
+
if (imageIsObject) onChange({ ...(value as Record<string, unknown>), alt: alt || null });
|
|
108
|
+
};
|
|
99
109
|
|
|
100
110
|
let libraryOpen = $state(false);
|
|
101
111
|
const onLibrarySelect = (item: MediaItem) => {
|
|
@@ -207,6 +217,15 @@
|
|
|
207
217
|
alt=""
|
|
208
218
|
class="vela:max-h-24 vela:w-auto vela:rounded vela:border vela:border-[var(--cms-bar-divider)] vela:object-contain vela:bg-[var(--cms-bar-bg-hover)]"
|
|
209
219
|
/>
|
|
220
|
+
{#if imageIsObject}
|
|
221
|
+
<Input
|
|
222
|
+
type="text"
|
|
223
|
+
value={imageAlt}
|
|
224
|
+
placeholder="Alt text"
|
|
225
|
+
aria-label="Alt text"
|
|
226
|
+
oninput={(e) => setAlt(e.currentTarget.value)}
|
|
227
|
+
/>
|
|
228
|
+
{/if}
|
|
210
229
|
{/if}
|
|
211
230
|
{:else}
|
|
212
231
|
<Input
|
|
@@ -14,8 +14,9 @@ type Props = {
|
|
|
14
14
|
onChange: (next: unknown) => void;
|
|
15
15
|
label?: string;
|
|
16
16
|
placeholder?: string;
|
|
17
|
-
/** Options for `enum
|
|
17
|
+
/** Options for `enum`, and optional display names. */
|
|
18
18
|
values?: readonly string[];
|
|
19
|
+
names?: Readonly<Record<string, string>>;
|
|
19
20
|
/** Right-aligned text beside the label, e.g. a character counter. */
|
|
20
21
|
hint?: string;
|
|
21
22
|
hintClass?: string;
|