@openvoxproject/voxblocks 0.9.0

package/dist/types/components/radio/vox-radio-group.d.ts

@@ -0,0 +1,23 @@
+import { VoxFieldElement } from '../../internal/field.js';
+/**
+ * Groups `<vox-radio>` options: manages selection, arrow-key navigation,
+ * and submits the selected value with the surrounding form.
+ *
+ * @slot - `<vox-radio>` elements.
+ */
+export declare class VoxRadioGroup extends VoxFieldElement {
+    value: string;
+    static styles: import("lit").CSSResult[];
+    private get radios();
+    formResetCallback(): void;
+    updated(): void;
+    private syncRadios;
+    private handleSelect;
+    private handleKeydown;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'vox-radio-group': VoxRadioGroup;
+    }
+}

package/dist/types/components/radio/vox-radio.d.ts

@@ -0,0 +1,21 @@
+import { LitElement } from 'lit';
+/**
+ * A single radio option. Must be placed inside a `<vox-radio-group>`,
+ * which handles selection state, keyboard navigation, and form value.
+ *
+ * @slot - Radio label.
+ */
+export declare class VoxRadio extends LitElement {
+    value: string;
+    checked: boolean;
+    disabled: boolean;
+    static styles: import("lit").CSSResult;
+    select(): void;
+    private handleKeydown;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'vox-radio': VoxRadio;
+    }
+}

package/dist/types/components/select/vox-select.d.ts

@@ -0,0 +1,27 @@
+import { VoxFieldElement } from '../../internal/field.js';
+/**
+ * A select input. Options are provided as light-DOM `<option>` /
+ * `<optgroup>` children and mirrored into the shadow select:
+ *
+ * ```html
+ * <vox-select label="Distribution">
+ *   <option value="deb">Debian</option>
+ *   <option value="rpm">RHEL</option>
+ * </vox-select>
+ * ```
+ */
+export declare class VoxSelect extends VoxFieldElement {
+    value: string;
+    private selectEl;
+    static styles: import("lit").CSSResult[];
+    formResetCallback(): void;
+    updated(): void;
+    private syncOptions;
+    private handleChange;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'vox-select': VoxSelect;
+    }
+}

package/dist/types/components/series-nav/vox-series-nav.d.ts

@@ -0,0 +1,18 @@
+import { LitElement } from 'lit';
+/**
+ * Previous/next navigation between pages in a series, like the links at
+ * the bottom of a docs page.
+ */
+export declare class VoxSeriesNav extends LitElement {
+    previousHref?: string;
+    previousLabel: string;
+    nextHref?: string;
+    nextLabel: string;
+    static styles: import("lit").CSSResult;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'vox-series-nav': VoxSeriesNav;
+    }
+}

package/dist/types/components/sidenav/vox-sidenav.d.ts

@@ -0,0 +1,50 @@
+import { LitElement } from 'lit';
+/**
+ * A vertical section navigation, in the style of the OpenVox docs sidebar.
+ *
+ * ```html
+ * <vox-sidenav>
+ *   <vox-sidenav-item href="/" current>Overview</vox-sidenav-item>
+ *   <vox-sidenav-group heading="Installation" open>
+ *     <vox-sidenav-item href="/install/deb">Debian</vox-sidenav-item>
+ *   </vox-sidenav-group>
+ * </vox-sidenav>
+ * ```
+ *
+ * @slot - `<vox-sidenav-item>` and `<vox-sidenav-group>` elements.
+ */
+export declare class VoxSidenav extends LitElement {
+    label: string;
+    static styles: import("lit").CSSResult;
+    render(): import("lit-html").TemplateResult<1>;
+}
+/**
+ * A collapsible group of sidenav items.
+ *
+ * @slot - `<vox-sidenav-item>` elements.
+ */
+export declare class VoxSidenavGroup extends LitElement {
+    heading: string;
+    open: boolean;
+    static styles: import("lit").CSSResult;
+    private toggle;
+    render(): import("lit-html").TemplateResult<1>;
+}
+/**
+ * One sidenav link. Set `current` on the active page's item.
+ *
+ * @slot - Link text.
+ */
+export declare class VoxSidenavItem extends LitElement {
+    href: string;
+    current: boolean;
+    static styles: import("lit").CSSResult;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'vox-sidenav': VoxSidenav;
+        'vox-sidenav-group': VoxSidenavGroup;
+        'vox-sidenav-item': VoxSidenavItem;
+    }
+}

package/dist/types/components/sponsor/vox-sponsor.d.ts

@@ -0,0 +1,35 @@
+import { LitElement } from 'lit';
+/**
+ * A group of sponsors under a shared tier, for sponsorship/funding pages.
+ *
+ * @slot description - Optional text under the heading, e.g. what the tier means.
+ * @slot - `<vox-sponsor>` elements.
+ */
+export declare class VoxSponsorTier extends LitElement {
+    heading: string;
+    static styles: import("lit").CSSResult;
+    private hasDescription;
+    private handleDescriptionSlotChange;
+    render(): import("lit-html").TemplateResult<1>;
+}
+/**
+ * One sponsor card in a `<vox-sponsor-tier>`, linking to the sponsor's site.
+ *
+ * @slot - Optional description, e.g. contribution type and amount.
+ */
+export declare class VoxSponsor extends LitElement {
+    name: string;
+    href?: string;
+    logo?: string;
+    target?: string;
+    static styles: import("lit").CSSResult;
+    private hasBody;
+    private handleBodySlotChange;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'vox-sponsor-tier': VoxSponsorTier;
+        'vox-sponsor': VoxSponsor;
+    }
+}

package/dist/types/components/stat/vox-stat.d.ts

@@ -0,0 +1,17 @@
+import { LitElement } from 'lit';
+/**
+ * A large statistic with a label, e.g. module counts or contributors.
+ *
+ * @slot - Optional supporting description.
+ */
+export declare class VoxStat extends LitElement {
+    value: string;
+    label: string;
+    static styles: import("lit").CSSResult;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'vox-stat': VoxStat;
+    }
+}

package/dist/types/components/step-indicator/vox-step-indicator.d.ts

@@ -0,0 +1,28 @@
+import { LitElement } from 'lit';
+export type StepState = 'complete' | 'current' | 'upcoming';
+/**
+ * Shows progress through a multi-step process.
+ *
+ * @slot - `<vox-step>` elements.
+ */
+export declare class VoxStepIndicator extends LitElement {
+    static styles: import("lit").CSSResult;
+    private numberSteps;
+    render(): import("lit-html").TemplateResult<1>;
+}
+/**
+ * One step in a `<vox-step-indicator>`.
+ */
+export declare class VoxStep extends LitElement {
+    label: string;
+    state: StepState;
+    number: number;
+    static styles: import("lit").CSSResult;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'vox-step-indicator': VoxStepIndicator;
+        'vox-step': VoxStep;
+    }
+}

package/dist/types/components/subnav/vox-subnav.d.ts

@@ -0,0 +1,18 @@
+import { LitElement } from 'lit';
+/**
+ * A horizontal secondary navigation bar. Children are plain links;
+ * mark the active one with `aria-current="page"`.
+ *
+ * @slot - `<a>` elements.
+ */
+export declare class VoxSubnav extends LitElement {
+    /** Accessible name distinguishing this nav from others on the page. */
+    label: string;
+    static styles: import("lit").CSSResult;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'vox-subnav': VoxSubnav;
+    }
+}

package/dist/types/components/switch/vox-switch.d.ts

@@ -0,0 +1,20 @@
+import { VoxFieldElement } from '../../internal/field.js';
+/**
+ * A toggle switch for on/off settings.
+ *
+ * @slot - Switch label.
+ */
+export declare class VoxSwitch extends VoxFieldElement {
+    checked: boolean;
+    value: string;
+    static styles: import("lit").CSSResult[];
+    formResetCallback(): void;
+    updated(): void;
+    private handleChange;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'vox-switch': VoxSwitch;
+    }
+}

package/dist/types/components/tabs/vox-tabs.d.ts

@@ -0,0 +1,57 @@
+import { LitElement } from 'lit';
+/**
+ * Tabbed content:
+ *
+ * ```html
+ * <vox-tabs>
+ *   <vox-tab slot="tab" panel="deb" selected>Debian</vox-tab>
+ *   <vox-tab slot="tab" panel="rpm">RHEL</vox-tab>
+ *   <vox-tab-panel name="deb">...</vox-tab-panel>
+ *   <vox-tab-panel name="rpm">...</vox-tab-panel>
+ * </vox-tabs>
+ * ```
+ *
+ * @slot tab - `<vox-tab>` elements.
+ * @slot - `<vox-tab-panel>` elements.
+ * @fires vox-tab-change - When the selected tab changes; `detail.panel` names it.
+ */
+export declare class VoxTabs extends LitElement {
+    static styles: import("lit").CSSResult;
+    private get tabs();
+    private get panels();
+    private sync;
+    private handleSelect;
+    private handleKeydown;
+    render(): import("lit-html").TemplateResult<1>;
+}
+/**
+ * A tab button; `panel` names the `<vox-tab-panel>` it controls.
+ *
+ * @slot - Tab label.
+ */
+export declare class VoxTab extends LitElement {
+    panel: string;
+    selected: boolean;
+    static styles: import("lit").CSSResult;
+    select(): void;
+    focusTab(): void;
+    render(): import("lit-html").TemplateResult<1>;
+}
+/**
+ * Content shown when the matching `<vox-tab>` is selected.
+ *
+ * @slot - Panel content.
+ */
+export declare class VoxTabPanel extends LitElement {
+    name: string;
+    active: boolean;
+    static styles: import("lit").CSSResult;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'vox-tabs': VoxTabs;
+        'vox-tab': VoxTab;
+        'vox-tab-panel': VoxTabPanel;
+    }
+}

package/dist/types/components/textarea/vox-textarea.d.ts

@@ -0,0 +1,22 @@
+import { VoxFieldElement } from '../../internal/field.js';
+/**
+ * A multi-line text input with label and help note.
+ */
+export declare class VoxTextarea extends VoxFieldElement {
+    value: string;
+    placeholder?: string;
+    rows: number;
+    readonly: boolean;
+    static styles: import("lit").CSSResult[];
+    formResetCallback(): void;
+    updated(): void;
+    focus(options?: FocusOptions): void;
+    private handleInput;
+    private handleChange;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'vox-textarea': VoxTextarea;
+    }
+}

package/dist/types/components/theme-toggle/vox-theme-toggle.d.ts

@@ -0,0 +1,35 @@
+import { LitElement } from 'lit';
+/**
+ * A self-contained light/dark theme switch. Reads and writes
+ * `data-vox-theme` on `<html>` and persists the choice to
+ * `localStorage['vox-theme']` — the same convention VoxBlocks' own dark
+ * mode support already uses, so this is a drop-in control for it.
+ *
+ * A page still needs its own blocking inline script in `<head>` to apply
+ * the stored (or system) theme before first paint — a custom element
+ * can't upgrade in time to prevent that flash. See the docs page for the
+ * exact snippet.
+ *
+ * Fires `vox-theme-change` with `detail: { theme: 'light' | 'dark' }`.
+ */
+export declare class VoxThemeToggle extends LitElement {
+    /** Accessible label while the page is in light mode. */
+    lightLabel: string;
+    /** Accessible label while the page is in dark mode. */
+    darkLabel: string;
+    private dark;
+    private media;
+    private observer?;
+    static styles: import("lit").CSSResult;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private handleSystemChange;
+    private syncFromDocument;
+    private handleClick;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'vox-theme-toggle': VoxThemeToggle;
+    }
+}

package/dist/types/components/timeline/vox-timeline.d.ts

@@ -0,0 +1,27 @@
+import { LitElement } from 'lit';
+/**
+ * A vertical timeline of dated events.
+ *
+ * @slot - `<vox-timeline-item>` elements.
+ */
+export declare class VoxTimeline extends LitElement {
+    static styles: import("lit").CSSResult;
+    render(): import("lit-html").TemplateResult<1>;
+}
+/**
+ * One event on a `<vox-timeline>`.
+ *
+ * @slot - Event description.
+ */
+export declare class VoxTimelineItem extends LitElement {
+    heading: string;
+    date: string;
+    static styles: import("lit").CSSResult;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'vox-timeline': VoxTimeline;
+        'vox-timeline-item': VoxTimelineItem;
+    }
+}

package/dist/types/index.d.ts

@@ -0,0 +1,51 @@
+import './tokens/tokens.css';
+import './styles/utilities.css';
+export { VoxButton } from './components/button/vox-button.js';
+export { VoxCta } from './components/cta/vox-cta.js';
+export { VoxThemeToggle } from './components/theme-toggle/vox-theme-toggle.js';
+export { VoxCheckbox } from './components/checkbox/vox-checkbox.js';
+export { VoxFileInput } from './components/file-input/vox-file-input.js';
+export { VoxInput } from './components/input/vox-input.js';
+export { VoxInputGroup } from './components/input-group/vox-input-group.js';
+export { VoxRadio } from './components/radio/vox-radio.js';
+export { VoxRadioGroup } from './components/radio/vox-radio-group.js';
+export { VoxSelect } from './components/select/vox-select.js';
+export { VoxSwitch } from './components/switch/vox-switch.js';
+export { VoxTextarea } from './components/textarea/vox-textarea.js';
+export { VoxAvatar } from './components/avatar/vox-avatar.js';
+export { VoxBillboard } from './components/billboard/vox-billboard.js';
+export { VoxBreadcrumbs } from './components/breadcrumbs/vox-breadcrumbs.js';
+export { VoxHeader } from './components/header/vox-header.js';
+export { VoxSeriesNav } from './components/series-nav/vox-series-nav.js';
+export { VoxSidenav, VoxSidenavGroup, VoxSidenavItem } from './components/sidenav/vox-sidenav.js';
+export { VoxSubnav } from './components/subnav/vox-subnav.js';
+export { VoxTabs, VoxTab, VoxTabPanel } from './components/tabs/vox-tabs.js';
+export { VoxDialog } from './components/dialog/vox-dialog.js';
+export { VoxDisclosure } from './components/disclosure/vox-disclosure.js';
+export { VoxDropdown } from './components/dropdown/vox-dropdown.js';
+export { VoxAccordion, VoxAccordionItem } from './components/accordion/vox-accordion.js';
+export { VoxAlert } from './components/alert/vox-alert.js';
+export { VoxBadge } from './components/badge/vox-badge.js';
+export { VoxCalendarTile } from './components/calendar-tile/vox-calendar-tile.js';
+export { VoxCallout } from './components/callout/vox-callout.js';
+export { VoxCard } from './components/card/vox-card.js';
+export { VoxCtaBand } from './components/cta-band/vox-cta-band.js';
+export { VoxEmptyState } from './components/empty-state/vox-empty-state.js';
+export { VoxFooter, VoxFooterColumn } from './components/footer/vox-footer.js';
+export { VoxGrid } from './components/grid/vox-grid.js';
+export { VoxHero } from './components/hero/vox-hero.js';
+export { VoxLinkHub, VoxLinkHubItem } from './components/link-hub/vox-link-hub.js';
+export { VoxLoader } from './components/loader/vox-loader.js';
+export { VoxPagination } from './components/pagination/vox-pagination.js';
+export { VoxQuote } from './components/quote/vox-quote.js';
+export { VoxSponsor, VoxSponsorTier } from './components/sponsor/vox-sponsor.js';
+export { VoxStat } from './components/stat/vox-stat.js';
+export { VoxStepIndicator, VoxStep } from './components/step-indicator/vox-step-indicator.js';
+export { VoxTimeline, VoxTimelineItem } from './components/timeline/vox-timeline.js';
+export type { ButtonVariant, ButtonSize } from './components/button/vox-button.js';
+export type { CalloutVariant } from './components/callout/vox-callout.js';
+export type { BadgeVariant } from './components/badge/vox-badge.js';
+export type { AlertVariant } from './components/alert/vox-alert.js';
+export type { AvatarSize } from './components/avatar/vox-avatar.js';
+export type { LoaderSize } from './components/loader/vox-loader.js';
+export type { StepState } from './components/step-indicator/vox-step-indicator.js';

package/dist/types/internal/field.d.ts

@@ -0,0 +1,27 @@
+import { LitElement, nothing } from 'lit';
+/**
+ * Shared base for form-associated VoxBlocks controls. Uses ElementInternals
+ * so controls participate in native <form> submission and validation.
+ */
+export declare class VoxFieldElement extends LitElement {
+    static formAssociated: boolean;
+    protected internals: ElementInternals;
+    name: string;
+    label: string;
+    note: string;
+    disabled: boolean;
+    required: boolean;
+    constructor();
+    get form(): HTMLFormElement | null;
+    get validity(): ValidityState;
+    get validationMessage(): string;
+    checkValidity(): boolean;
+    reportValidity(): boolean;
+    /** Mirror a native inner control's validity onto the host element. */
+    protected syncValidity(inner: HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement): void;
+    protected renderLabel(forId: string): typeof nothing | import("lit-html").TemplateResult<1>;
+    protected renderNote(): typeof nothing | import("lit-html").TemplateResult<1>;
+}
+export declare const fieldStyles: import("lit").CSSResult;
+/** Styles shared by the checkbox-like controls (checkbox, radio, switch). */
+export declare const checkableStyles: import("lit").CSSResult;

package/dist/voxblocks.css

@@ -0,0 +1 @@
+:root{--vox-color-brand-1: #0f5c5c;--vox-color-brand-2: #0a4f49;--vox-color-brand-3: #106b66;--vox-color-brand-soft: rgba(16, 107, 102, .14);--vox-color-tip-1: #18794e;--vox-color-tip-soft: rgba(16, 185, 129, .14);--vox-color-warning-1: #915930;--vox-color-warning-soft: rgba(234, 179, 8, .14);--vox-color-danger-1: #b8272c;--vox-color-danger-2: #d5393e;--vox-color-danger-3: #e0575b;--vox-color-danger-soft: rgba(244, 63, 94, .14);--vox-color-bg: #f5faf9;--vox-color-bg-alt: #e8f1ef;--vox-color-bg-soft: #e8f1ef;--vox-color-bg-elv: #ffffff;--vox-color-text-1: #12262c;--vox-color-text-2: #4c6469;--vox-color-text-3: #86999c;--vox-color-text-inverse: #ffffff;--vox-color-divider: rgba(18, 38, 44, .12);--vox-color-border: rgba(18, 38, 44, .28);--vox-font-family-base: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--vox-font-family-display: "Source Serif 4", Georgia, "Times New Roman", serif;--vox-font-family-mono: "JetBrains Mono", "Source Code Pro", ui-monospace, "SF Mono", "Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", monospace;--vox-radius-sm: 4px;--vox-radius-md: 8px;--vox-radius-lg: 12px;--vox-radius-full: 9999px;--vox-space-1: .25rem;--vox-space-2: .5rem;--vox-space-3: .75rem;--vox-space-4: 1rem;--vox-space-6: 1.5rem;--vox-space-8: 2rem;--vox-shadow-1: 0 1px 2px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06);--vox-shadow-2: 0 3px 12px rgba(0, 0, 0, .07), 0 1px 4px rgba(0, 0, 0, .07);--vox-transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--vox-transition-base: .25s cubic-bezier(.4, 0, .2, 1)}.dark,[data-vox-theme=dark]{--vox-color-brand-1: #7fd8cf;--vox-color-brand-2: #0b5c52;--vox-color-brand-3: #0e7267;--vox-color-brand-soft: rgba(127, 216, 207, .16);--vox-color-tip-1: #3dd68c;--vox-color-tip-soft: rgba(16, 185, 129, .16);--vox-color-warning-1: #f9b44e;--vox-color-warning-soft: rgba(234, 179, 8, .16);--vox-color-danger-1: #f66f81;--vox-color-danger-2: #f14158;--vox-color-danger-3: #b62a3c;--vox-color-danger-soft: rgba(244, 63, 94, .16);--vox-color-bg: #0d1417;--vox-color-bg-alt: #131b1f;--vox-color-bg-soft: #131b1f;--vox-color-bg-elv: #161f23;--vox-color-text-1: #dff3f0;--vox-color-text-2: #9fb8bb;--vox-color-text-3: #5f7275;--vox-color-text-inverse: #ffffff;--vox-color-divider: rgba(159, 184, 187, .24);--vox-color-border: rgba(159, 184, 187, .5);--vox-shadow-1: 0 1px 2px rgba(0, 0, 0, .2), 0 1px 2px rgba(0, 0, 0, .24);--vox-shadow-2: 0 3px 12px rgba(0, 0, 0, .26), 0 1px 4px rgba(0, 0, 0, .26)}body{margin:0;font-family:var(--vox-font-family-base);background-color:var(--vox-color-bg);color:var(--vox-color-text-1)}vox-hero a,vox-alert a,vox-callout a,vox-dialog a,vox-accordion-item a{color:var(--vox-color-brand-1);text-decoration:underline}vox-hero a:hover,vox-alert a:hover,vox-callout a:hover,vox-dialog a:hover,vox-accordion-item a:hover{color:var(--vox-color-brand-2)}.vox-table{width:100%;border-collapse:collapse;font-family:var(--vox-font-family-base);font-size:14px;color:var(--vox-color-text-1)}.vox-table caption{margin-bottom:.5rem;font-weight:600;text-align:left;color:var(--vox-color-text-1)}.vox-table th{padding:.6rem .9rem;border-bottom:2px solid var(--vox-color-divider);font-weight:600;text-align:left;white-space:nowrap;color:var(--vox-color-text-1);background-color:var(--vox-color-bg-soft)}.vox-table td{padding:.6rem .9rem;border-bottom:1px solid var(--vox-color-divider);color:var(--vox-color-text-2)}.vox-table--striped tbody tr:nth-child(odd){background-color:var(--vox-color-bg-soft)}.vox-table--compact th,.vox-table--compact td{padding:.35rem .6rem}.vox-table-wrap{overflow-x:auto;border:1px solid var(--vox-color-divider);border-radius:var(--vox-radius-lg)}.vox-table-wrap .vox-table tbody tr:last-child th,.vox-table-wrap .vox-table tbody tr:last-child td{border-bottom:none}.vox-list{font-family:var(--vox-font-family-base);font-size:14px;line-height:1.7;color:var(--vox-color-text-2);padding-left:1.25rem}.vox-list li+li{margin-top:.25rem}.vox-list--plain{list-style:none;padding-left:0}.vox-list--inline{list-style:none;padding-left:0;display:flex;flex-wrap:wrap;gap:.25rem 1.25rem}.vox-list--inline li+li{margin-top:0}.vox-prose{max-width:44rem;font-family:var(--vox-font-family-base);font-size:16px;line-height:1.75;color:var(--vox-color-text-2)}.vox-prose+.vox-prose{margin-top:var(--vox-space-4)}.vox-prose a{color:var(--vox-color-brand-1);text-decoration:underline}.vox-prose a:hover{color:var(--vox-color-brand-2)}.vox-m-all-none{margin:0!important}.vox-m-all-xs{margin:.25rem!important}.vox-m-all-sm{margin:.5rem!important}.vox-m-all-md{margin:1rem!important}.vox-m-all-lg{margin:1.5rem!important}.vox-m-all-xl{margin:2rem!important}.vox-m-all-xxl{margin:3rem!important}.vox-m-top-none{margin-top:0!important}.vox-m-top-xs{margin-top:.25rem!important}.vox-m-top-sm{margin-top:.5rem!important}.vox-m-top-md{margin-top:1rem!important}.vox-m-top-lg{margin-top:1.5rem!important}.vox-m-top-xl{margin-top:2rem!important}.vox-m-top-xxl{margin-top:3rem!important}.vox-m-right-none{margin-right:0!important}.vox-m-right-xs{margin-right:.25rem!important}.vox-m-right-sm{margin-right:.5rem!important}.vox-m-right-md{margin-right:1rem!important}.vox-m-right-lg{margin-right:1.5rem!important}.vox-m-right-xl{margin-right:2rem!important}.vox-m-right-xxl{margin-right:3rem!important}.vox-m-bottom-none{margin-bottom:0!important}.vox-m-bottom-xs{margin-bottom:.25rem!important}.vox-m-bottom-sm{margin-bottom:.5rem!important}.vox-m-bottom-md{margin-bottom:1rem!important}.vox-m-bottom-lg{margin-bottom:1.5rem!important}.vox-m-bottom-xl{margin-bottom:2rem!important}.vox-m-bottom-xxl{margin-bottom:3rem!important}.vox-m-left-none{margin-left:0!important}.vox-m-left-xs{margin-left:.25rem!important}.vox-m-left-sm{margin-left:.5rem!important}.vox-m-left-md{margin-left:1rem!important}.vox-m-left-lg{margin-left:1.5rem!important}.vox-m-left-xl{margin-left:2rem!important}.vox-m-left-xxl{margin-left:3rem!important}.vox-m-x-none{margin-left:0!important;margin-right:0!important}.vox-m-x-xs{margin-left:.25rem!important;margin-right:.25rem!important}.vox-m-x-sm{margin-left:.5rem!important;margin-right:.5rem!important}.vox-m-x-md{margin-left:1rem!important;margin-right:1rem!important}.vox-m-x-lg{margin-left:1.5rem!important;margin-right:1.5rem!important}.vox-m-x-xl{margin-left:2rem!important;margin-right:2rem!important}.vox-m-x-xxl{margin-left:3rem!important;margin-right:3rem!important}.vox-m-x-auto{margin-left:auto!important;margin-right:auto!important}.vox-m-y-none{margin-top:0!important;margin-bottom:0!important}.vox-m-y-xs{margin-top:.25rem!important;margin-bottom:.25rem!important}.vox-m-y-sm{margin-top:.5rem!important;margin-bottom:.5rem!important}.vox-m-y-md{margin-top:1rem!important;margin-bottom:1rem!important}.vox-m-y-lg{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.vox-m-y-xl{margin-top:2rem!important;margin-bottom:2rem!important}.vox-m-y-xxl{margin-top:3rem!important;margin-bottom:3rem!important}.vox-p-all-none{padding:0!important}.vox-p-all-xs{padding:.25rem!important}.vox-p-all-sm{padding:.5rem!important}.vox-p-all-md{padding:1rem!important}.vox-p-all-lg{padding:1.5rem!important}.vox-p-all-xl{padding:2rem!important}.vox-p-all-xxl{padding:3rem!important}.vox-p-top-none{padding-top:0!important}.vox-p-top-xs{padding-top:.25rem!important}.vox-p-top-sm{padding-top:.5rem!important}.vox-p-top-md{padding-top:1rem!important}.vox-p-top-lg{padding-top:1.5rem!important}.vox-p-top-xl{padding-top:2rem!important}.vox-p-top-xxl{padding-top:3rem!important}.vox-p-right-none{padding-right:0!important}.vox-p-right-xs{padding-right:.25rem!important}.vox-p-right-sm{padding-right:.5rem!important}.vox-p-right-md{padding-right:1rem!important}.vox-p-right-lg{padding-right:1.5rem!important}.vox-p-right-xl{padding-right:2rem!important}.vox-p-right-xxl{padding-right:3rem!important}.vox-p-bottom-none{padding-bottom:0!important}.vox-p-bottom-xs{padding-bottom:.25rem!important}.vox-p-bottom-sm{padding-bottom:.5rem!important}.vox-p-bottom-md{padding-bottom:1rem!important}.vox-p-bottom-lg{padding-bottom:1.5rem!important}.vox-p-bottom-xl{padding-bottom:2rem!important}.vox-p-bottom-xxl{padding-bottom:3rem!important}.vox-p-left-none{padding-left:0!important}.vox-p-left-xs{padding-left:.25rem!important}.vox-p-left-sm{padding-left:.5rem!important}.vox-p-left-md{padding-left:1rem!important}.vox-p-left-lg{padding-left:1.5rem!important}.vox-p-left-xl{padding-left:2rem!important}.vox-p-left-xxl{padding-left:3rem!important}.vox-p-x-none{padding-left:0!important;padding-right:0!important}.vox-p-x-xs{padding-left:.25rem!important;padding-right:.25rem!important}.vox-p-x-sm{padding-left:.5rem!important;padding-right:.5rem!important}.vox-p-x-md{padding-left:1rem!important;padding-right:1rem!important}.vox-p-x-lg{padding-left:1.5rem!important;padding-right:1.5rem!important}.vox-p-x-xl{padding-left:2rem!important;padding-right:2rem!important}.vox-p-x-xxl{padding-left:3rem!important;padding-right:3rem!important}.vox-p-y-none{padding-top:0!important;padding-bottom:0!important}.vox-p-y-xs{padding-top:.25rem!important;padding-bottom:.25rem!important}.vox-p-y-sm{padding-top:.5rem!important;padding-bottom:.5rem!important}.vox-p-y-md{padding-top:1rem!important;padding-bottom:1rem!important}.vox-p-y-lg{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.vox-p-y-xl{padding-top:2rem!important;padding-bottom:2rem!important}.vox-p-y-xxl{padding-top:3rem!important;padding-bottom:3rem!important}.vox-ts-xs{font-size:12px!important}.vox-ts-sm{font-size:14px!important}.vox-ts-md{font-size:16px!important}.vox-ts-lg{font-size:18px!important}.vox-ts-xl{font-size:22px!important}.vox-ts-xxl{font-size:28px!important}.vox-ts-3xl{font-size:36px!important}.vox-text-regular{font-weight:400!important}.vox-text-medium{font-weight:500!important}.vox-text-semibold{font-weight:600!important}.vox-text-bold{font-weight:700!important}.vox-text-left{text-align:left!important}.vox-text-center{text-align:center!important}.vox-text-right{text-align:right!important}.vox-text-uppercase{text-transform:uppercase!important;letter-spacing:.05em!important}.vox-text-mono{font-family:var(--vox-font-family-mono)!important}.vox-lh-tight{line-height:1.25!important}.vox-lh-base{line-height:1.5!important}.vox-lh-loose{line-height:1.75!important}.vox-color-text-1{color:var(--vox-color-text-1)!important}.vox-color-text-2{color:var(--vox-color-text-2)!important}.vox-color-text-3{color:var(--vox-color-text-3)!important}.vox-color-brand{color:var(--vox-color-brand-1)!important}.vox-color-tip{color:var(--vox-color-tip-1)!important}.vox-color-warning{color:var(--vox-color-warning-1)!important}.vox-color-danger{color:var(--vox-color-danger-1)!important}.vox-bg{background-color:var(--vox-color-bg)!important}.vox-bg-alt{background-color:var(--vox-color-bg-alt)!important}.vox-bg-soft{background-color:var(--vox-color-bg-soft)!important}.vox-bg-elv{background-color:var(--vox-color-bg-elv)!important}.vox-bg-brand{background-color:var(--vox-color-brand-3)!important;color:var(--vox-color-text-inverse)!important}.vox-bg-brand-soft{background-color:var(--vox-color-brand-soft)!important}.vox-bg-tip-soft{background-color:var(--vox-color-tip-soft)!important}.vox-bg-warning-soft{background-color:var(--vox-color-warning-soft)!important}.vox-bg-danger-soft{background-color:var(--vox-color-danger-soft)!important}.vox-border-all{border:1px solid var(--vox-color-divider)!important}.vox-border-top{border-top:1px solid var(--vox-color-divider)!important}.vox-border-right{border-right:1px solid var(--vox-color-divider)!important}.vox-border-bottom{border-bottom:1px solid var(--vox-color-divider)!important}.vox-border-left{border-left:1px solid var(--vox-color-divider)!important}.vox-border-none{border:none!important}.vox-radius-sm{border-radius:var(--vox-radius-sm)!important}.vox-radius-md{border-radius:var(--vox-radius-md)!important}.vox-radius-lg{border-radius:var(--vox-radius-lg)!important}.vox-radius-full{border-radius:var(--vox-radius-full)!important}.vox-display-block{display:block!important}.vox-display-inline{display:inline!important}.vox-display-inline-block{display:inline-block!important}.vox-display-flex{display:flex!important}.vox-display-inline-flex{display:inline-flex!important}.vox-display-grid{display:grid!important}.vox-flex-row{flex-direction:row!important}.vox-flex-column{flex-direction:column!important}.vox-flex-wrap{flex-wrap:wrap!important}.vox-flex-nowrap{flex-wrap:nowrap!important}.vox-justify-start{justify-content:flex-start!important}.vox-justify-center{justify-content:center!important}.vox-justify-end{justify-content:flex-end!important}.vox-justify-between{justify-content:space-between!important}.vox-items-start{align-items:flex-start!important}.vox-items-center{align-items:center!important}.vox-items-end{align-items:flex-end!important}.vox-items-stretch{align-items:stretch!important}.vox-grow-0{flex-grow:0!important}.vox-grow-1{flex-grow:1!important}.vox-shrink-0{flex-shrink:0!important}.vox-gap-none{gap:0!important}.vox-gap-xs{gap:.25rem!important}.vox-gap-sm{gap:.5rem!important}.vox-gap-md{gap:1rem!important}.vox-gap-lg{gap:1.5rem!important}.vox-gap-xl{gap:2rem!important}.vox-gap-xxl{gap:3rem!important}.vox-shadow-1{box-shadow:var(--vox-shadow-1)!important}.vox-shadow-2{box-shadow:var(--vox-shadow-2)!important}.vox-shadow-none{box-shadow:none!important}.vox-hide{display:none!important}.vox-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}@media(max-width:479.98px){.vox-hide-sm-down{display:none!important}}@media(max-width:767.98px){.vox-hide-md-down{display:none!important}}@media(max-width:1023.98px){.vox-hide-lg-down{display:none!important}}@media(min-width:480px){.vox-hide-sm-up{display:none!important}}@media(min-width:768px){.vox-hide-md-up{display:none!important}}@media(min-width:1024px){.vox-hide-lg-up{display:none!important}}.vox-width-full{width:100%!important}.vox-width-auto{width:auto!important}.vox-width-sm{width:20rem!important}.vox-width-md{width:30rem!important}.vox-width-lg{width:40rem!important}.vox-width-xl{width:50rem!important}.vox-max-width-sm{max-width:20rem!important}.vox-max-width-md{max-width:30rem!important}.vox-max-width-lg{max-width:40rem!important}.vox-max-width-xl{max-width:50rem!important}.vox-max-width-full{max-width:100%!important}.vox-z-0{z-index:0!important}.vox-z-10{z-index:10!important}.vox-z-100{z-index:100!important}.vox-z-1000{z-index:1000!important}