@layer veritheme{/* Auto-generated by scripts/build-component-css.mjs from components/button.json. Do not edit manually. */

/* ── Button ────────────────────────────────────────── */

.vt-btn {
  --btn-bg: hsl(var(--brand-fill));
  --btn-bg-hover: hsl(var(--brand-fill-hover));
  --btn-bg-active: hsl(var(--brand-fill-pressed));
  --btn-bg-disabled: hsl(var(--brand-fill-disabled));
  --btn-fg: hsl(var(--on-brand));
  --btn-fg-disabled: hsl(var(--on-brand));
  --btn-border: none;
  --btn-radius: var(--radius-md);
  --btn-height: var(--control-height-md);
  --btn-padding-x: var(--control-padding-x-md);
  --btn-padding-y: var(--control-padding-y-md);
  --btn-font-size: var(--type-label-md-size);
  --btn-focus-ring-color: var(--focus-ring);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: var(--btn-border);
  box-shadow: inset 0 var(--btn-shadow-depth) 0 var(--btn-highlight-color), inset 0 calc(-1 * var(--btn-shadow-depth)) 0 var(--btn-edge-color), var(--btn-shadow);
  border-radius: var(--btn-radius);
  background: var(--btn-bg);
  color: var(--btn-fg);
  height: var(--btn-height);
  padding: var(--btn-padding-y) var(--btn-padding-x) calc(var(--btn-padding-y) + var(--btn-edge-lift));
  font-size: var(--btn-font-size);
  font-weight: var(--btn-font-weight);
  line-height: var(--btn-line-height);
  transition: background-color 150ms var(--motion-ease-out), color 150ms var(--motion-ease-out), border-color 150ms var(--motion-ease-out), box-shadow 150ms var(--motion-ease-out);
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
  gap: var(--spacing-2);
  letter-spacing: var(--btn-tracking);
  --btn-font-weight: var(--type-label-md-weight);
  --btn-line-height: var(--type-label-md-line-height);
  --btn-tracking: var(--type-label-md-tracking);
  --btn-shadow-depth: calc(2 * var(--border-width-thin));
  --btn-edge-color: transparent;
  --btn-shadow: 0 0 transparent;
  --btn-shadow-active: 0 0 transparent;
  --btn-press-y: 0px;
  --btn-highlight-color: transparent;
  --btn-edge-lift: 0px;
}

.vt-btn:hover {
  background: var(--btn-bg-hover);
}

.vt-btn:active {
  background: var(--btn-bg-active);
  box-shadow: inset 0 var(--btn-shadow-depth) 0 var(--btn-highlight-color), inset 0 calc(-1 * var(--border-width-thin)) 0 var(--btn-edge-color), var(--btn-shadow-active);
  transform: translateY(var(--btn-press-y));
}

.vt-btn:focus-visible {
  outline: none;
  box-shadow: inset 0 var(--btn-shadow-depth) 0 var(--btn-highlight-color), inset 0 calc(-1 * var(--btn-shadow-depth)) 0 var(--btn-edge-color), var(--btn-shadow), 0 0 0 var(--focus-ring-width) hsl(var(--btn-focus-ring-color) / 0.25);
}

.vt-btn:disabled,
.vt-btn.vt-disabled {
  background: var(--btn-bg-disabled);
  color: var(--btn-fg-disabled);
  cursor: not-allowed;
  pointer-events: none;
}

/* ── Button · intent ── */

.vt-btn-primary {
  --btn-bg: hsl(var(--brand-fill));
  --btn-bg-hover: hsl(var(--brand-fill-hover));
  --btn-bg-active: hsl(var(--brand-fill-pressed));
  --btn-bg-disabled: hsl(var(--brand-fill-disabled));
  --btn-fg: hsl(var(--on-brand));
  --btn-fg-disabled: hsl(var(--on-brand));
  --btn-focus-ring-color: var(--focus-ring);
  --btn-edge-color: var(--shadow-inset-edge-color, transparent);
  --btn-edge-lift: calc(var(--btn-shadow-depth) * var(--shadow-inset-edge-on, 0));
  --btn-shadow: var(--shadow-control);
  --btn-shadow-active: var(--shadow-control-pressed);
  --btn-press-y: calc(var(--border-width-thin) * var(--shadow-control-pressed-on, 0));
}

.vt-btn-secondary {
  --btn-bg: hsl(var(--neutral-fill));
  --btn-bg-hover: hsl(var(--neutral-fill-hover));
  --btn-bg-active: hsl(var(--neutral-fill-pressed));
  --btn-bg-disabled: hsl(var(--neutral-fill-disabled));
  --btn-fg: hsl(var(--on-neutral));
  --btn-fg-disabled: hsl(var(--foreground-disabled));
  --btn-focus-ring-color: var(--focus-ring);
  --btn-border: var(--border-width-default) solid hsl(var(--border-default));
  --btn-edge-color: var(--shadow-inset-edge-bordered-color, transparent);
  --btn-edge-lift: calc(var(--btn-shadow-depth) * var(--shadow-inset-edge-bordered-on, 0));
  --btn-shadow: var(--shadow-control-bordered);
  --btn-shadow-active: var(--shadow-control-bordered-pressed);
  --btn-press-y: calc(var(--border-width-thin) * var(--shadow-control-pressed-on, 0));
}

.vt-btn-bordered {
  --btn-bg: hsl(var(--surface-card));
  --btn-bg-hover: hsl(var(--neutral-fill-hover));
  --btn-bg-active: hsl(var(--neutral-fill-pressed));
  --btn-bg-disabled: hsl(var(--surface-card));
  --btn-fg: hsl(var(--foreground-primary));
  --btn-fg-disabled: hsl(var(--foreground-disabled));
  --btn-border: var(--border-width-default) solid hsl(var(--border-default));
  --btn-focus-ring-color: var(--focus-ring);
}

.vt-btn-danger {
  --btn-bg: hsl(var(--error-fill));
  --btn-bg-hover: hsl(var(--error-fill-hover));
  --btn-bg-active: hsl(var(--error-fill-pressed));
  --btn-bg-disabled: hsl(var(--error-fill-disabled));
  --btn-fg: hsl(var(--on-error));
  --btn-fg-disabled: hsl(var(--on-error));
  --btn-focus-ring-color: var(--focus-ring);
  --btn-edge-color: var(--shadow-inset-edge-color, transparent);
  --btn-edge-lift: calc(var(--btn-shadow-depth) * var(--shadow-inset-edge-on, 0));
  --btn-shadow: var(--shadow-control);
  --btn-shadow-active: var(--shadow-control-pressed);
  --btn-press-y: calc(var(--border-width-thin) * var(--shadow-control-pressed-on, 0));
}

.vt-btn-ghost {
  --btn-bg: transparent;
  --btn-bg-hover: hsl(var(--neutral-fill-hover));
  --btn-bg-active: hsl(var(--neutral-fill-pressed));
  --btn-bg-disabled: transparent;
  --btn-fg: hsl(var(--foreground-secondary));
  --btn-fg-disabled: hsl(var(--foreground-disabled));
  --btn-focus-ring-color: var(--focus-ring);
}

.vt-btn-ghost:hover {
  color: hsl(var(--foreground-primary));
}

/* ── Button · size ── */

.vt-btn-sm {
  --btn-height: var(--control-height-sm);
  --btn-padding-x: var(--control-padding-x-sm);
  --btn-padding-y: var(--control-padding-y-sm);
  --btn-font-size: var(--type-label-sm-size);
  --btn-font-weight: var(--type-label-sm-weight);
  --btn-line-height: var(--type-label-sm-line-height);
  --btn-tracking: var(--type-label-sm-tracking);
  --btn-shadow-depth: calc(1 * var(--border-width-thin));
  --btn-radius: var(--radius-sm);
}

.vt-btn-lg {
  --btn-height: var(--control-height-lg);
  --btn-padding-x: var(--control-padding-x-lg);
  --btn-padding-y: var(--control-padding-y-lg);
  --btn-font-weight: var(--type-label-lg-weight);
  --btn-line-height: var(--type-label-lg-line-height);
  --btn-tracking: var(--type-label-lg-tracking);
  --btn-shadow-depth: calc(3 * var(--border-width-thin));
  --btn-radius: var(--radius-lg);
}

.vt-btn-xl {
  --btn-height: var(--control-height-xl);
  --btn-font-size: var(--type-label-lg-size);
  --btn-padding-x: var(--control-padding-x-xl);
  --btn-padding-y: var(--control-padding-y-xl);
  --btn-font-weight: var(--type-label-lg-weight);
  --btn-line-height: var(--type-label-lg-line-height);
  --btn-tracking: var(--type-label-lg-tracking);
  --btn-shadow-depth: calc(4 * var(--border-width-thin));
  --btn-radius: var(--radius-xl);
}

/* ── Button · shape ── */

.vt-btn-icon {
  --btn-padding-x: 0;
  width: var(--btn-height);
}

.vt-btn-link {
  --btn-bg: transparent;
  --btn-bg-hover: transparent;
  --btn-bg-active: transparent;
  --btn-bg-disabled: transparent;
  --btn-fg: hsl(var(--brand-fill));
  --btn-fg-disabled: hsl(var(--brand-fill-disabled));
  text-underline-offset: var(--spacing-1);
}

.vt-btn-link:hover {
  text-decoration: underline;
}
/* Auto-generated by scripts/build-component-css.mjs from components/badge.json. Do not edit manually. */

/* ── Badge ────────────────────────────────────────── */

.vt-badge {
  --badge-accent: hsl(var(--brand-fill));
  --badge-bg: hsl(var(--brand-fill));
  --badge-fg: hsl(var(--on-brand));
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-1);
  border-radius: var(--radius-full);
  border: var(--border-width-default) solid transparent;
  padding: calc(var(--spacing-1) - var(--border-width-default)) calc(var(--spacing-2) - var(--border-width-default));
  font-size: var(--type-label-sm-size);
  font-weight: var(--type-label-sm-weight);
  line-height: var(--type-label-sm-line-height);
  white-space: nowrap;
  background: var(--badge-bg);
  color: var(--badge-fg);
  --badge-soft-bg: hsl(var(--brand-fill) / 0.1);
  --badge-soft-fg: hsl(var(--brand-fill));
  --badge-border: var(--badge-accent);
  letter-spacing: var(--type-label-sm-tracking);
}

/* ── Badge · color ── */

.vt-badge-primary {
  --badge-accent: hsl(var(--brand-fill));
  --badge-bg: hsl(var(--brand-fill));
  --badge-fg: hsl(var(--on-brand));
  --badge-soft-bg: hsl(var(--brand-fill) / 0.1);
  --badge-soft-fg: hsl(var(--brand-fill));
}

.vt-badge-secondary {
  --badge-accent: hsl(var(--foreground-secondary));
  --badge-bg: hsl(var(--surface-subtle));
  --badge-fg: hsl(var(--foreground-primary));
  --badge-soft-bg: hsl(var(--surface-subtle));
  --badge-soft-fg: hsl(var(--foreground-muted));
  --badge-border: hsl(var(--border-strong));
}

.vt-badge-danger {
  --badge-accent: hsl(var(--error-fill));
  --badge-bg: hsl(var(--error-fill));
  --badge-fg: hsl(var(--on-error));
  --badge-soft-bg: hsl(var(--error-fill) / 0.1);
  --badge-soft-fg: hsl(var(--error-fill));
}

.vt-badge-success {
  --badge-accent: hsl(var(--success-fill));
  --badge-bg: hsl(var(--success-fill));
  --badge-fg: hsl(var(--on-success));
  --badge-soft-bg: hsl(var(--success-fill) / 0.1);
  --badge-soft-fg: hsl(var(--success-fill));
}

.vt-badge-warning {
  --badge-accent: hsl(var(--warning-fill));
  --badge-bg: hsl(var(--warning-fill));
  --badge-fg: hsl(var(--on-warning));
  --badge-soft-bg: hsl(var(--warning-fill) / 0.1);
  --badge-soft-fg: hsl(var(--foreground-primary));
}

.vt-badge-info {
  --badge-accent: hsl(var(--info-fill));
  --badge-bg: hsl(var(--info-fill));
  --badge-fg: hsl(var(--on-info));
  --badge-soft-bg: hsl(var(--info-fill) / 0.1);
  --badge-soft-fg: hsl(var(--info-fill));
}

/* ── Badge · style ── */

.vt-badge-bordered {
  background: transparent;
  border-color: var(--badge-border);
  color: var(--badge-accent);
}

.vt-badge-soft {
  background: var(--badge-soft-bg);
  border-color: transparent;
  color: var(--badge-soft-fg);
}

.vt-badge > svg, .vt-badge > img, .vt-badge > .vt-badge-icon {
  width: calc(var(--spacing-3) + var(--spacing-0_5));
  height: calc(var(--spacing-3) + var(--spacing-0_5));
  flex-shrink: 0;
}
/* Auto-generated by scripts/build-component-css.mjs from components/avatar.json. Do not edit manually. */

/* ── Avatar ────────────────────────────────────────── */

.vt-avatar {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-full);
  background: hsl(var(--surface-moderate));
  overflow: hidden;
  flex-shrink: 0;
}

/* ── Avatar · size ── */

.vt-avatar-sm {
  width: var(--spacing-6);
  height: var(--spacing-6);
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-avatar-md {
  width: var(--spacing-10);
  height: var(--spacing-10);
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-avatar-lg {
  width: var(--spacing-14);
  height: var(--spacing-14);
  font-size: var(--type-body-lg-size);
  line-height: var(--type-body-lg-line-height);
  font-weight: var(--type-body-lg-weight);
  letter-spacing: var(--type-body-lg-tracking);
}

.vt-avatar-xl {
  width: var(--spacing-20);
  height: var(--spacing-20);
  font-size: var(--type-heading-md-size);
  line-height: var(--type-heading-md-line-height);
  font-weight: var(--type-heading-md-weight);
  letter-spacing: var(--type-heading-md-tracking);
}

/* ── Avatar · color ── */

.vt-avatar-brand {
  background: hsl(var(--brand-fill));
  color: hsl(var(--on-brand));
}

.vt-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* Auto-generated by scripts/build-component-css.mjs from components/avatargroup.json. Do not edit manually. */

/* ── AvatarGroup ────────────────────────────────────────── */

.vt-avatar-group {
  --avatar-group-overlap: var(--spacing-3);
  display: flex;
  align-items: center;
}

/* ── AvatarGroup · size ── */

.vt-avatar-group-sm {
  --avatar-group-overlap: var(--spacing-2);
}

.vt-avatar-group-lg {
  --avatar-group-overlap: var(--spacing-4);
}

.vt-avatar-group > * + * {
  margin-inline-start: calc(-1 * var(--avatar-group-overlap));
}

.vt-avatar-group > .vt-avatar, .vt-avatar-group > .vt-tooltip-wrap > .vt-avatar {
  border: var(--border-width-thick) solid hsl(var(--surface-page));
}
/* Auto-generated by scripts/build-component-css.mjs from components/separator.json. Do not edit manually. */

/* ── Separator ────────────────────────────────────────── */

.vt-separator {
  flex-shrink: 0;
  background: hsl(var(--border-default));
}

/* ── Separator · orientation ── */

.vt-separator-h {
  height: var(--border-width-default);
  width: 100%;
}

.vt-separator-v {
  width: var(--border-width-default);
  height: 100%;
}

.vt-separator-label, .vt-auth-divider {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
  color: hsl(var(--foreground-muted));
  white-space: nowrap;
}

.vt-separator-label > .vt-separator, .vt-auth-divider > .vt-separator {
  flex-shrink: 1;
}
/* Auto-generated by scripts/build-component-css.mjs from components/skeleton.json. Do not edit manually. */

/* ── Skeleton ────────────────────────────────────────── */

.vt-skeleton {
  background: hsl(var(--surface-moderate));
  border-radius: var(--radius-md);
  animation: vt-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

/* ── Skeleton · shape ── */

.vt-skeleton-line {
  width: 100%;
  height: var(--spacing-4);
  border-radius: var(--radius-2xs);
}

.vt-skeleton-circle {
  width: var(--spacing-10);
  height: var(--spacing-10);
  border-radius: var(--radius-full);
  flex-shrink: 0;
}

.vt-skeleton-card {
  width: 100%;
  height: var(--spacing-24);
  border-radius: var(--radius-2xl);
}

.vt-skeleton-line:last-child:not(:first-child) {
  width: 60%;
}

@media (prefers-reduced-motion: reduce) {
  .vt-skeleton {
    animation: none;
  }
}
/* Auto-generated by scripts/build-component-css.mjs from components/spinner.json. Do not edit manually. */

/* ── Spinner ────────────────────────────────────────── */

.vt-spinner {
  width: var(--spacing-6);
  height: var(--spacing-6);
  flex-shrink: 0;
  color: hsl(var(--brand-fill));
  animation: vt-spin 1s linear infinite;
}

/* ── Spinner · size ── */

.vt-spinner-sm {
  width: var(--spacing-4);
  height: var(--spacing-4);
}

.vt-spinner-md {
  width: var(--spacing-6);
  height: var(--spacing-6);
}

.vt-spinner-lg {
  width: var(--spacing-8);
  height: var(--spacing-8);
}

.vt-spinner-xl {
  width: var(--spacing-12);
  height: var(--spacing-12);
}

.vt-btn > .vt-spinner {
  color: currentColor;
}

.vt-spinner-status {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-2);
}

.vt-spinner-status-vertical {
  flex-direction: column;
  gap: var(--spacing-3);
}

.vt-spinner-label {
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-spinner-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--z-modal);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-4);
  background: hsl(var(--surface-card) / 0.8);
}

.vt-spinner-overlay[hidden] {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  .vt-spinner {
    animation-duration: 3s;
  }
}
/* Auto-generated by scripts/build-component-css.mjs from components/link.json. Do not edit manually. */

/* ── Link ────────────────────────────────────────── */

.vt-link {
  font-size: var(--type-body-sm-size);
  color: hsl(var(--brand-fill));
  text-decoration: none;
  text-underline-offset: var(--spacing-0_5);
  transition: color var(--transition-fast);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-link:hover {
  color: hsl(var(--brand-fill-hover));
  text-decoration: underline;
}

/* ── Link · style ── */

.vt-link-muted {
  color: hsl(var(--foreground-secondary));
}

.vt-link-muted:hover {
  color: hsl(var(--foreground-primary));
  text-decoration: underline;
}

.vt-link:has(> svg) {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-1_5);
}

.vt-link > svg {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
}
/* Auto-generated by scripts/build-component-css.mjs from components/tooltip.json. Do not edit manually. */

/* ── Tooltip ────────────────────────────────────────── */

.vt-tooltip {
  position: absolute;
  z-index: 50;
  border-radius: var(--radius-md);
  --tooltip-bg: hsl(var(--brand-fill));
  background: var(--tooltip-bg);
  color: hsl(var(--on-brand));
  padding: var(--spacing-1_5) var(--spacing-3);
  font-size: var(--type-label-sm-size);
  font-weight: var(--type-label-sm-weight);
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity var(--transition-fast);
  bottom: 100%;
  inset-inline-start: 50%;
  transform: translateX(-50%);
  margin-bottom: var(--spacing-2);
  line-height: var(--type-label-sm-line-height);
  letter-spacing: var(--type-label-sm-tracking);
}

/* ── Tooltip · placement ── */

.vt-tooltip-bottom {
  top: 100%;
  bottom: auto;
  margin-bottom: 0;
  margin-top: var(--spacing-2);
}

.vt-tooltip-left {
  inset-inline-end: 100%;
  inset-inline-start: auto;
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
  margin-bottom: 0;
  margin-inline-end: var(--spacing-2);
}

.vt-tooltip-right {
  inset-inline-start: 100%;
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
  margin-bottom: 0;
  margin-inline-start: var(--spacing-2);
}

.vt-tooltip-wrap {
  position: relative;
  display: inline-flex;
}

.vt-tooltip-wrap:hover > .vt-tooltip {
  opacity: 1;
}

.vt-tooltip.vt-open {
  opacity: 1;
}

.vt-tooltip::before {
  content: "";
  position: absolute;
  border: var(--spacing-1) solid transparent;
  top: 100%;
  inset-inline-start: 50%;
  transform: translateX(-50%);
  border-top-color: var(--tooltip-bg);
}

.vt-tooltip-bottom::before {
  top: auto;
  bottom: 100%;
  border-top-color: transparent;
  border-bottom-color: var(--tooltip-bg);
}

.vt-tooltip-left::before {
  top: 50%;
  inset-inline-start: 100%;
  transform: translateY(-50%);
  border-top-color: transparent;
  border-inline-start-color: var(--tooltip-bg);
}

.vt-tooltip-right::before {
  top: 50%;
  inset-inline-start: auto;
  inset-inline-end: 100%;
  transform: translateY(-50%);
  border-top-color: transparent;
  border-inline-end-color: var(--tooltip-bg);
}
/* Auto-generated by scripts/build-component-css.mjs from components/checkbox.json. Do not edit manually. */

/* ── Checkbox ────────────────────────────────────────── */

.vt-checkbox {
  width: var(--spacing-4);
  height: var(--spacing-4);
  border-radius: var(--radius-2xs);
  border: var(--border-width-medium) solid hsl(var(--brand-fill));
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.15s;
  flex-shrink: 0;
  background: transparent;
}

.vt-checkbox.checked {
  background: hsl(var(--brand-fill));
  border-color: hsl(var(--brand-fill));
}

.vt-checkbox.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.vt-checkbox:focus-visible {
  outline: none;
  box-shadow: 0 0 0 var(--focus-ring-width) hsl(var(--focus-ring) / 0.25);
}

/* ── Checkbox · size ── */

.vt-checkbox-md {
  width: var(--spacing-5);
  height: var(--spacing-5);
  border-radius: var(--radius-xs);
}

.vt-checkbox-lg {
  width: var(--spacing-6);
  height: var(--spacing-6);
  border-radius: var(--radius-sm);
}

.vt-checkbox .check-icon {
  display: none;
  width: calc(var(--spacing-4) / 2);
  height: calc(var(--spacing-4) / 2);
}

.vt-checkbox.checked .check-icon {
  display: block;
  color: hsl(var(--on-brand));
}

.vt-checkbox-md .check-icon {
  width: calc(var(--spacing-5) / 2);
  height: calc(var(--spacing-5) / 2);
}

.vt-checkbox-lg .check-icon {
  width: calc(var(--spacing-6) / 2);
  height: calc(var(--spacing-6) / 2);
}
/* Auto-generated by scripts/build-component-css.mjs from components/radio.json. Do not edit manually. */

/* ── Radio ────────────────────────────────────────── */

.vt-radio {
  width: var(--spacing-4);
  height: var(--spacing-4);
  border-radius: var(--radius-full);
  border: var(--border-width-medium) solid hsl(var(--brand-fill));
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.15s;
  flex-shrink: 0;
}

.vt-radio:focus-visible {
  outline: none;
  box-shadow: 0 0 0 var(--focus-ring-width) hsl(var(--focus-ring) / 0.25);
}

.vt-radio.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* ── Radio · size ── */

.vt-radio-md {
  width: var(--spacing-5);
  height: var(--spacing-5);
}

.vt-radio-lg {
  width: var(--spacing-6);
  height: var(--spacing-6);
}

.vt-radio .vt-dot {
  width: var(--spacing-2);
  height: var(--spacing-2);
  border-radius: var(--radius-full);
  background: hsl(var(--brand-fill));
  display: none;
}

.vt-radio.selected .vt-dot {
  display: block;
}

.vt-radio-lg .vt-dot {
  width: var(--spacing-3);
  height: var(--spacing-3);
}
/* Auto-generated by scripts/build-component-css.mjs from components/switch.json. Do not edit manually. */

/* ── Switch ────────────────────────────────────────── */

.vt-switch {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: calc(2 * var(--spacing-5) + 2 * var(--spacing-0_5));
  height: var(--spacing-6);
  border-radius: var(--radius-full);
  border: none;
  padding: 0;
  cursor: pointer;
  transition: background-color 0.2s;
  flex-shrink: 0;
  background: hsl(var(--surface-moderate));
}

.vt-switch:focus-visible {
  outline: none;
  box-shadow: 0 0 0 var(--focus-ring-width) hsl(var(--focus-ring) / 0.25);
}

.vt-switch:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* ── Switch · size ── */

.vt-switch-sm {
  width: calc(2 * var(--spacing-4) + 2 * var(--spacing-0_5));
  height: var(--spacing-5);
}

.vt-switch-lg {
  width: calc(2 * var(--spacing-6) + 2 * var(--spacing-0_5));
  height: var(--spacing-7);
}

.vt-switch.vt-active {
  background: hsl(var(--brand-fill));
}

.vt-switch .vt-switch-thumb {
  position: absolute;
  inset-inline-start: var(--spacing-0_5);
  width: var(--spacing-5);
  height: var(--spacing-5);
  border-radius: var(--radius-full);
  background: hsl(var(--generic-white));
  box-shadow: var(--shadow-default);
  transition: transform 0.2s;
  pointer-events: none;
}

.vt-switch.vt-active .vt-switch-thumb {
  transform: translateX(var(--spacing-5));
}

.vt-switch-sm .vt-switch-thumb {
  width: var(--spacing-4);
  height: var(--spacing-4);
}

.vt-switch-sm.vt-active .vt-switch-thumb {
  transform: translateX(var(--spacing-4));
}

.vt-switch-lg .vt-switch-thumb {
  width: var(--spacing-6);
  height: var(--spacing-6);
}

.vt-switch-lg.vt-active .vt-switch-thumb {
  transform: translateX(var(--spacing-6));
}
/* Auto-generated by scripts/build-component-css.mjs from components/rating.json. Do not edit manually. */

/* ── Rating ────────────────────────────────────────── */

.vt-rating {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-0_5);
}

/* ── Rating · size ── */

.vt-rating-lg {
  gap: var(--spacing-1);
}

.vt-rating .vt-star {
  display: inline-block;
  width: var(--spacing-5);
  height: var(--spacing-5);
  color: hsl(var(--surface-moderate));
  flex-shrink: 0;
}

.vt-rating .vt-star.vt-filled {
  color: hsl(var(--warning-fill));
}

.vt-rating .vt-star.vt-rating-half {
  position: relative;
}

.vt-rating .vt-rating-half > .vt-filled {
  position: absolute;
  top: 0;
  inset-inline-start: 0;
  clip-path: inset(0 50% 0 0);
}

.vt-rating-sm .vt-star {
  width: var(--spacing-4);
  height: var(--spacing-4);
}

.vt-rating-lg .vt-star {
  width: var(--spacing-7);
  height: var(--spacing-7);
}

[dir="rtl"] .vt-rating .vt-rating-half > .vt-filled {
  clip-path: inset(0 0 0 50%);
}
/* Auto-generated by scripts/build-component-css.mjs from components/input.json. Do not edit manually. */

/* ── Input ────────────────────────────────────────── */

.vt-input {
  display: flex;
  height: var(--control-height-md);
  width: 100%;
  border-radius: var(--radius-md);
  border: var(--border-width-default) solid hsl(var(--border-strong));
  background: var(--input-bg, hsl(var(--surface-card)));
  padding: var(--spacing-2) var(--spacing-3);
  font-size: var(--type-body-sm-size);
  color: hsl(var(--foreground-primary));
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-input::placeholder {
  color: hsl(var(--foreground-muted));
}

.vt-input:disabled::placeholder {
  color: hsl(var(--foreground-disabled));
}

.vt-input:focus-visible {
  outline: none;
  border-color: hsl(var(--brand-fill));
  box-shadow: 0 0 0 var(--focus-ring-width) hsl(var(--brand-fill) / 0.15);
}

.vt-input:disabled {
  opacity: 0.5;
  color: hsl(var(--foreground-disabled));
  cursor: not-allowed;
}

/* ── Input · size ── */

.vt-input-sm {
  height: var(--control-height-sm);
  padding: var(--spacing-1) var(--spacing-3);
  font-size: var(--type-caption-size);
  border-radius: var(--radius-sm);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-input-lg {
  height: var(--control-height-lg);
  padding: var(--spacing-2) var(--spacing-4);
}

.vt-input-xl {
  height: var(--control-height-xl);
  padding: var(--spacing-3) var(--spacing-4);
  font-size: var(--type-body-md-size);
  border-radius: var(--radius-lg);
  line-height: var(--type-body-md-line-height);
  font-weight: var(--type-body-md-weight);
  letter-spacing: var(--type-body-md-tracking);
}

/* ── Input · state ── */

.vt-input-error {
  border-color: hsl(var(--error-fill));
}

.vt-input-error:focus-visible {
  border-color: hsl(var(--error-fill));
  box-shadow: 0 0 0 var(--focus-ring-width) hsl(var(--error-fill) / 0.15);
}

.vt-input-success {
  border-color: hsl(var(--success-fill));
}

.vt-input-success:focus-visible {
  border-color: hsl(var(--success-fill));
  box-shadow: 0 0 0 var(--focus-ring-width) hsl(var(--success-fill) / 0.15);
}

.vt-input.vt-pl-10, .vt-input-icon ~ .vt-input {
  padding-inline-start: var(--spacing-10);
}

.vt-input.vt-pr-10 {
  padding-inline-end: var(--spacing-10);
}

.vt-input-group {
  position: relative;
  display: flex;
  flex-direction: column;
}

.vt-input-icon {
  position: absolute;
  top: 50%;
  inset-inline-start: var(--spacing-3);
  transform: translateY(-50%);
  width: var(--spacing-4);
  height: var(--spacing-4);
  color: hsl(var(--foreground-muted));
  pointer-events: none;
}
/* Auto-generated by scripts/build-component-css.mjs from components/textarea.json. Do not edit manually. */

/* ── Textarea ────────────────────────────────────────── */

.vt-textarea {
  display: flex;
  width: 100%;
  border-radius: var(--radius-md);
  border: var(--border-width-default) solid hsl(var(--border-strong));
  background: var(--input-bg, hsl(var(--surface-card)));
  padding: var(--spacing-2) var(--spacing-3);
  font-size: var(--type-body-sm-size);
  color: hsl(var(--foreground-primary));
  resize: vertical;
  min-height: var(--spacing-20);
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-textarea::placeholder {
  color: hsl(var(--foreground-muted));
}

.vt-textarea:disabled::placeholder {
  color: hsl(var(--foreground-disabled));
}

.vt-textarea:focus-visible {
  outline: none;
  border-color: hsl(var(--brand-fill));
  box-shadow: 0 0 0 var(--focus-ring-width) hsl(var(--brand-fill) / 0.15);
}

.vt-textarea:disabled {
  opacity: 0.5;
  color: hsl(var(--foreground-disabled));
  cursor: not-allowed;
}

/* ── Textarea · state ── */

.vt-textarea-error {
  border-color: hsl(var(--error-fill));
}

.vt-textarea-error:focus-visible {
  border-color: hsl(var(--error-fill));
  box-shadow: 0 0 0 var(--focus-ring-width) hsl(var(--error-fill) / 0.15);
}

.vt-textarea-sm, .vt-textarea-lg, .vt-textarea-xl {
  min-height: var(--spacing-20);
}
/* Auto-generated by scripts/build-component-css.mjs from components/field.json. Do not edit manually. */

/* ── Field ────────────────────────────────────────── */

.vt-field {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
}

.vt-field-description {
  font-size: var(--type-body-sm-size);
  color: hsl(var(--foreground-muted));
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-field-error {
  font-size: var(--type-body-sm-size);
  color: hsl(var(--error-fill));
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-field-success {
  font-size: var(--type-body-sm-size);
  color: hsl(var(--success-fill));
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/form.json. Do not edit manually. */

/* ── Form ────────────────────────────────────────── */

.vt-form {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-form-row {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-4);
}

.vt-form-row > * {
  width: 100%;
  min-width: 0;
}

.vt-form-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--spacing-2);
}

.vt-form-actions-block > .vt-btn {
  width: 100%;
}

.vt-form-message {
  display: flex;
  align-items: center;
  gap: var(--spacing-1_5);
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-form-message > svg {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
}

.vt-form-message-error {
  color: hsl(var(--error-fill));
}

.vt-form-message-success {
  color: hsl(var(--success-fill));
}

.vt-form-horizontal .vt-field {
  flex-direction: row;
  align-items: center;
  gap: var(--spacing-4);
}

.vt-form-horizontal .vt-field > .vt-label {
  width: var(--spacing-24);
  flex-shrink: 0;
  text-align: end;
}
/* Auto-generated by scripts/build-component-css.mjs from components/fileupload.json. Do not edit manually. */

/* ── FileUpload ────────────────────────────────────────── */

.vt-file-upload {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-3);
  padding: var(--spacing-10) var(--spacing-6);
  border: var(--border-width-thick) dashed hsl(var(--border-default));
  border-radius: var(--radius-md);
  color: hsl(var(--foreground-primary));
  text-align: center;
  transition: border-color var(--transition-fast), background-color var(--transition-fast);
}

.vt-file-upload.vt-dragover {
  border-color: hsl(var(--brand-fill));
  background: hsl(var(--brand-fill) / 0.05);
}

.vt-file-upload-icon {
  width: var(--spacing-10);
  height: var(--spacing-10);
  flex-shrink: 0;
  color: hsl(var(--foreground-muted));
}

.vt-file-upload-title {
  margin: 0;
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-file-upload-hint {
  margin: 0;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-file-upload.vt-dragover .vt-file-upload-icon, .vt-file-upload.vt-dragover .vt-file-upload-title {
  color: hsl(var(--brand-fill));
}

.vt-file-upload-list {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
}

.vt-file-upload-previews {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-3);
}

.vt-file-upload + .vt-file-upload-list, .vt-file-upload + .vt-file-upload-previews {
  margin-top: var(--spacing-4);
}

.vt-file-upload-preview, .vt-file-upload-add {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--spacing-24);
  height: var(--spacing-24);
  border-radius: var(--radius-md);
  color: hsl(var(--foreground-muted));
}

.vt-file-upload-preview {
  background: hsl(var(--surface-subtle));
  overflow: hidden;
}

.vt-file-upload-preview > svg, .vt-file-upload-add > svg {
  width: var(--spacing-8);
  height: var(--spacing-8);
}

.vt-file-upload-preview > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.vt-file-upload-add {
  padding: 0;
  border: var(--border-width-thick) dashed hsl(var(--border-default));
  background: transparent;
  cursor: pointer;
  transition: border-color var(--transition-fast), background-color var(--transition-fast), color var(--transition-fast);
}

.vt-file-upload-add:hover {
  border-color: hsl(var(--brand-fill));
  background: hsl(var(--brand-fill) / 0.05);
  color: hsl(var(--brand-fill));
}
/* Auto-generated by scripts/build-component-css.mjs from components/fileuploaditem.json. Do not edit manually. */

/* ── FileUploadItem ────────────────────────────────────────── */

.vt-file-upload-item {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  padding: var(--spacing-3);
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-2xl);
  background: hsl(var(--surface-card));
  color: hsl(var(--foreground-primary));
}

.vt-file-upload-item .vt-icon-badge {
  background: hsl(var(--surface-subtle));
  color: hsl(var(--foreground-muted));
}

.vt-file-upload-item .vt-icon-badge > svg {
  width: var(--spacing-4);
  height: var(--spacing-4);
}

.vt-file-upload-item-body {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
  flex: 1;
  min-width: 0;
}

.vt-file-upload-item-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-2);
}

.vt-file-upload-item-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-file-upload-item-size {
  flex-shrink: 0;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-file-upload-item-done {
  width: var(--spacing-5);
  height: var(--spacing-5);
  flex-shrink: 0;
  color: hsl(var(--success-fill));
}

.vt-file-upload-item > .vt-btn {
  flex-shrink: 0;
}
/* Auto-generated by scripts/build-component-css.mjs from components/otpinput.json. Do not edit manually. */

/* ── OtpInput ────────────────────────────────────────── */

.vt-otp-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--spacing-10);
  height: var(--spacing-12);
  padding: var(--spacing-2);
  border-radius: var(--radius-md);
  border: var(--border-width-default) solid hsl(var(--border-strong));
  background: var(--input-bg, hsl(var(--surface-card)));
  font-size: var(--type-body-lg-size);
  color: hsl(var(--foreground-primary));
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
  text-align: center;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  line-height: var(--type-body-lg-line-height);
  font-weight: var(--type-body-lg-weight);
  letter-spacing: var(--type-body-lg-tracking);
}

.vt-otp-cell::placeholder {
  color: hsl(var(--foreground-muted));
}

.vt-otp-cell:focus-visible {
  outline: none;
  border-color: hsl(var(--brand-fill));
  box-shadow: 0 0 0 var(--focus-ring-width) hsl(var(--brand-fill) / 0.15);
}

/* ── OtpInput · size ── */

.vt-otp-cell-sm {
  width: var(--spacing-8);
  height: var(--spacing-10);
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-otp-cell-lg {
  width: var(--spacing-12);
  height: var(--spacing-14);
  font-size: var(--type-heading-sm-size);
  line-height: var(--type-heading-sm-line-height);
  font-weight: var(--type-heading-sm-weight);
  letter-spacing: var(--type-heading-sm-tracking);
}

/* ── OtpInput · state ── */

.vt-otp-cell-error {
  border-color: hsl(var(--error-fill));
}

.vt-otp-cell-error:focus-visible {
  border-color: hsl(var(--error-fill));
  box-shadow: 0 0 0 var(--focus-ring-width) hsl(var(--error-fill) / 0.15);
}

.vt-otp-cell-success {
  border-color: hsl(var(--success-fill));
}

.vt-otp-cell-success:focus-visible {
  border-color: hsl(var(--success-fill));
  box-shadow: 0 0 0 var(--focus-ring-width) hsl(var(--success-fill) / 0.15);
}
/* Auto-generated by scripts/build-component-css.mjs from components/numberinput.json. Do not edit manually. */

/* ── NumberInput ────────────────────────────────────────── */

.vt-number-input {
  display: inline-flex;
  align-items: stretch;
  height: var(--control-height-md);
  border: var(--border-width-default) solid hsl(var(--border-strong));
  border-radius: var(--radius-md);
  background: var(--input-bg, hsl(var(--surface-card)));
  overflow: hidden;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

/* ── NumberInput · size ── */

.vt-number-input-sm {
  height: var(--control-height-sm);
  border-radius: var(--radius-sm);
}

.vt-number-input-lg {
  height: var(--control-height-lg);
  border-radius: var(--radius-lg);
}

.vt-number-input > .vt-btn {
  height: auto;
  border-radius: 0;
  flex-shrink: 0;
}

.vt-number-input-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-2) var(--spacing-3);
  background: transparent;
  border: none;
  cursor: pointer;
  color: hsl(var(--foreground-muted));
  transition: color var(--transition-fast);
}

.vt-number-input-btn:hover {
  color: hsl(var(--foreground-primary));
}

.vt-number-input-value {
  padding: var(--spacing-2) var(--spacing-3);
  font-size: var(--type-body-sm-size);
  font-weight: var(--type-body-sm-weight);
  text-align: center;
  width: var(--spacing-14);
  min-width: 0;
  appearance: textfield;
  -moz-appearance: textfield;
  border-inline-start: var(--border-width-default) solid hsl(var(--border-strong));
  border-inline-end: var(--border-width-default) solid hsl(var(--border-strong));
  line-height: var(--type-body-sm-line-height);
  letter-spacing: var(--type-body-sm-tracking);
  color: hsl(var(--foreground-primary));
  background: transparent;
  outline: none;
  font-variant-numeric: tabular-nums;
}

.vt-number-input-value::-webkit-outer-spin-button, .vt-number-input-value::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.vt-number-input-sm .vt-number-input-value {
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-number-input-lg .vt-number-input-value {
  font-size: var(--type-body-md-size);
  line-height: var(--type-body-md-line-height);
  font-weight: var(--type-body-md-weight);
  letter-spacing: var(--type-body-md-tracking);
}

.vt-number-input:has(.vt-number-input-value:focus-visible) {
  border-color: hsl(var(--brand-fill));
  box-shadow: 0 0 0 var(--focus-ring-width) hsl(var(--brand-fill) / 0.15);
}

.vt-number-input.vt-disabled {
  background: hsl(var(--surface-subtle));
  cursor: not-allowed;
}

.vt-number-input.vt-disabled .vt-number-input-value {
  color: hsl(var(--foreground-disabled));
}
/* Auto-generated by scripts/build-component-css.mjs from components/select.json. Do not edit manually. */

/* ── Select ────────────────────────────────────────── */

.vt-select-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-2);
  height: var(--control-height-md);
  width: 100%;
  border-radius: var(--radius-md);
  border: var(--border-width-thin) solid hsl(var(--border-strong));
  background: var(--input-bg, hsl(var(--surface-card)));
  padding: 0 var(--spacing-3);
  font-size: var(--type-body-sm-size);
  color: hsl(var(--foreground-primary));
  cursor: pointer;
  transition: border-color 0.15s;
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-select-trigger:hover {
  border-color: hsl(var(--brand-fill));
}

.vt-select-trigger:focus-visible {
  outline: none;
  border-color: hsl(var(--brand-fill));
  box-shadow: 0 0 0 var(--focus-ring-width) hsl(var(--brand-fill) / 0.15);
}

.vt-select-trigger:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.vt-select-trigger .placeholder {
  color: hsl(var(--foreground-muted));
}

.vt-select-trigger > svg {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  color: hsl(var(--foreground-muted));
}

.vt-select-trigger-sm {
  height: var(--control-height-sm);
  width: auto;
  padding: 0 var(--spacing-2);
  gap: var(--spacing-1_5);
  font-size: var(--type-caption-size);
  border-radius: var(--radius-sm);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-select-trigger-sm + .vt-select-dropdown {
  min-width: var(--spacing-40);
  width: auto;
  inset-inline-end: 0;
  inset-inline-start: auto;
}

.vt-select-dropdown {
  position: absolute;
  top: calc(100% + var(--spacing-1));
  inset-inline-start: 0;
  inset-inline-end: 0;
  background: hsl(var(--surface-card));
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-md);
  padding: var(--spacing-1);
  box-shadow: var(--shadow-md);
  z-index: 50;
  display: none;
}

.vt-select-dropdown.open {
  display: block;
}

[data-theme-direction="up"] .vt-select-dropdown {
  top: auto;
  bottom: calc(100% + var(--spacing-1));
}

.vt-select-item {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
  width: 100%;
  text-align: start;
  background: transparent;
  border: 0;
  border-radius: calc(var(--radius-md) - var(--spacing-1));
  font-size: var(--type-body-sm-size);
  cursor: pointer;
  position: relative;
  color: hsl(var(--foreground-primary));
  transition: background 0.1s;
  padding-block: var(--spacing-2);
  padding-inline: var(--spacing-8) var(--spacing-2);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-select-item:hover {
  background: hsl(var(--surface-subtle));
}

.vt-select-item.selected::before {
  content: '';
  position: absolute;
  inset-inline-start: calc(var(--spacing-2) + var(--spacing-0_5));
  top: 50%;
  width: var(--spacing-1_5);
  height: calc(var(--spacing-2) + var(--spacing-0_5));
  border-inline-end: var(--border-width-thick) solid hsl(var(--foreground-primary));
  border-bottom: var(--border-width-thick) solid hsl(var(--foreground-primary));
  transform: translateY(-60%) rotate(45deg);
}

.vt-select-separator {
  height: var(--border-width-thin);
  background: hsl(var(--border-default));
  margin: var(--spacing-1) calc(-1 * var(--spacing-1));
}

.vt-select-label {
  padding: var(--spacing-2) var(--spacing-2) var(--spacing-1) var(--spacing-2);
  font-size: var(--type-caption-size);
  font-weight: var(--type-caption-weight);
  color: hsl(var(--foreground-muted));
  line-height: var(--type-caption-line-height);
  letter-spacing: var(--type-caption-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/tabstrigger.json. Do not edit manually. */

/* ── TabsTrigger ────────────────────────────────────────── */

.vt-tabs-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: calc(var(--radius-md) - var(--spacing-1));
  padding: var(--spacing-1_5) var(--spacing-3);
  font-size: var(--type-label-md-size);
  font-weight: var(--type-label-md-weight);
  color: hsl(var(--foreground-muted));
  cursor: pointer;
  transition: color var(--transition-fast), background-color var(--transition-fast);
  white-space: nowrap;
  line-height: var(--type-label-md-line-height);
  letter-spacing: var(--type-label-md-tracking);
  gap: var(--spacing-1_5);
}

.vt-tabs-trigger:hover {
  color: hsl(var(--foreground-primary));
}

.vt-tabs-trigger.vt-active {
  background: hsl(var(--surface-card));
  color: hsl(var(--foreground-primary));
  box-shadow: var(--shadow-sm);
}

.vt-tabs-trigger-underline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-1_5);
  padding: var(--spacing-2) var(--spacing-4);
  font-size: var(--type-label-md-size);
  font-weight: var(--type-label-md-weight);
  color: hsl(var(--foreground-muted));
  border-bottom: var(--border-width-thick) solid transparent;
  margin-bottom: calc(-1 * var(--border-width-thin));
  cursor: pointer;
  transition: color var(--transition-fast), border-color var(--transition-fast);
  line-height: var(--type-label-md-line-height);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-tabs-trigger-underline:hover {
  color: hsl(var(--foreground-primary));
}

.vt-tabs-trigger-underline.vt-active {
  color: hsl(var(--foreground-primary));
  border-bottom-color: hsl(var(--brand-fill));
}

.vt-tabs-trigger > svg, .vt-tabs-trigger-underline > svg {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
}
/* Auto-generated by scripts/build-component-css.mjs from components/tabs.json. Do not edit manually. */

/* ── Tabs ────────────────────────────────────────── */

.vt-tabs-list {
  display: inline-flex;
  align-items: center;
  border-radius: var(--radius-md);
  background: hsl(var(--surface-subtle));
  padding: var(--spacing-1);
  gap: var(--spacing-1);
}

.vt-tabs-list-sm {
  height: var(--control-height-sm);
  padding: var(--spacing-0_5);
  gap: var(--spacing-0_5);
  border-radius: var(--radius-sm);
}

.vt-tabs-list-sm .vt-tabs-trigger {
  height: calc(var(--control-height-sm) - 2 * var(--spacing-0_5));
  min-width: calc(var(--control-height-sm) - 2 * var(--spacing-0_5));
  padding: 0 var(--spacing-2);
  font-size: var(--type-label-sm-size);
  line-height: var(--type-label-sm-line-height);
  border-radius: calc(var(--radius-sm) - var(--spacing-0_5));
  font-weight: var(--type-label-sm-weight);
  letter-spacing: var(--type-label-sm-tracking);
}

.vt-tabs-list-underline {
  display: flex;
  border-bottom: var(--border-width-thin) solid hsl(var(--border-default));
  gap: 0;
}
/* Auto-generated by scripts/build-component-css.mjs from components/breadcrumb.json. Do not edit manually. */

/* ── Breadcrumb ────────────────────────────────────────── */

.vt-breadcrumb {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
  list-style: none;
  padding: 0;
  margin: 0;
}

.vt-breadcrumb > li {
  display: inline-flex;
  align-items: center;
}

.vt-breadcrumb-link {
  font-size: var(--type-label-md-size);
  color: hsl(var(--foreground-muted));
  text-decoration: none;
  transition: color var(--transition-fast);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-breadcrumb-link:hover {
  color: hsl(var(--foreground-primary));
}

.vt-breadcrumb-separator {
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-breadcrumb-current {
  font-size: var(--type-label-md-size);
  font-weight: var(--type-label-md-weight);
  color: hsl(var(--foreground-primary));
  line-height: var(--type-label-md-line-height);
  letter-spacing: var(--type-label-md-tracking);
}

svg.vt-breadcrumb-separator {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
}
/* Auto-generated by scripts/build-component-css.mjs from components/stepperstep.json. Do not edit manually. */

/* ── StepperStep ────────────────────────────────────────── */

.vt-stepper-step {
  --stepper-indicator-bg: hsl(var(--surface-moderate));
  --stepper-indicator-fg: hsl(var(--foreground-muted));
  --stepper-label-color: hsl(var(--foreground-muted));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-2);
  text-align: center;
}

/* ── StepperStep · state ── */

.vt-stepper-step-current {
  --stepper-indicator-bg: hsl(var(--brand-fill));
  --stepper-indicator-fg: hsl(var(--on-brand));
  --stepper-label-color: hsl(var(--brand-fill));
}

.vt-stepper-step-complete {
  --stepper-indicator-bg: hsl(var(--brand-fill));
  --stepper-indicator-fg: hsl(var(--on-brand));
  --stepper-label-color: hsl(var(--brand-fill));
}

.vt-stepper-step-error {
  --stepper-indicator-bg: hsl(var(--error-fill) / 0.1);
  --stepper-indicator-fg: hsl(var(--error-fill));
  --stepper-label-color: hsl(var(--error-fill));
}

/* ── StepperStep · size ── */

.vt-stepper-step-sm {
  --stepper-indicator-size: var(--spacing-6);
  --stepper-icon-size: var(--spacing-3);
  --stepper-type-size: var(--type-label-sm-size);
  --stepper-type-line-height: var(--type-label-sm-line-height);
  --stepper-type-weight: var(--type-label-sm-weight);
  --stepper-type-tracking: var(--type-label-sm-tracking);
}

.vt-stepper-step-md {
  --stepper-indicator-size: var(--spacing-8);
  --stepper-icon-size: var(--spacing-4);
  --stepper-type-size: var(--type-label-md-size);
  --stepper-type-line-height: var(--type-label-md-line-height);
  --stepper-type-weight: var(--type-label-md-weight);
  --stepper-type-tracking: var(--type-label-md-tracking);
}

.vt-stepper-step-lg {
  --stepper-indicator-size: var(--spacing-10);
  --stepper-icon-size: var(--spacing-5);
  --stepper-type-size: var(--type-label-lg-size);
  --stepper-type-line-height: var(--type-label-lg-line-height);
  --stepper-type-weight: var(--type-label-lg-weight);
  --stepper-type-tracking: var(--type-label-lg-tracking);
}

.vt-stepper-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: var(--stepper-indicator-size, var(--spacing-8));
  height: var(--stepper-indicator-size, var(--spacing-8));
  border-radius: var(--radius-full);
  background: var(--stepper-indicator-bg);
  color: var(--stepper-indicator-fg);
  font-size: var(--stepper-type-size, var(--type-label-md-size));
  line-height: var(--stepper-type-line-height, var(--type-label-md-line-height));
  font-weight: var(--stepper-type-weight, var(--type-label-md-weight));
  letter-spacing: var(--stepper-type-tracking, var(--type-label-md-tracking));
  transition: background-color var(--transition-fast), color var(--transition-fast);
}

.vt-stepper-step-current .vt-stepper-indicator {
  box-shadow: 0 0 0 var(--spacing-1) hsl(var(--brand-fill) / 0.2);
}

.vt-stepper-step-error .vt-stepper-indicator {
  border: var(--border-width-thick) solid hsl(var(--error-fill));
}

.vt-stepper-icon {
  width: var(--stepper-icon-size, var(--spacing-4));
  height: var(--stepper-icon-size, var(--spacing-4));
  flex-shrink: 0;
}

.vt-stepper-step-complete .vt-stepper-number, .vt-stepper-step-error .vt-stepper-number {
  display: none;
}

.vt-stepper-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-0_5);
}

.vt-stepper-label {
  color: var(--stepper-label-color);
  font-size: var(--stepper-type-size, var(--type-label-md-size));
  line-height: var(--stepper-type-line-height, var(--type-label-md-line-height));
  font-weight: var(--stepper-type-weight, var(--type-label-md-weight));
  letter-spacing: var(--stepper-type-tracking, var(--type-label-md-tracking));
}

.vt-stepper-description {
  color: hsl(var(--foreground-muted));
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/stepper.json. Do not edit manually. */

/* ── Stepper ────────────────────────────────────────── */

.vt-stepper {
  display: flex;
  align-items: flex-start;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* ── Stepper · size ── */

.vt-stepper-sm {
  --stepper-indicator-size: var(--spacing-6);
  --stepper-icon-size: var(--spacing-3);
  --stepper-type-size: var(--type-label-sm-size);
  --stepper-type-line-height: var(--type-label-sm-line-height);
  --stepper-type-weight: var(--type-label-sm-weight);
  --stepper-type-tracking: var(--type-label-sm-tracking);
}

.vt-stepper-md {
  --stepper-indicator-size: var(--spacing-8);
  --stepper-icon-size: var(--spacing-4);
  --stepper-type-size: var(--type-label-md-size);
  --stepper-type-line-height: var(--type-label-md-line-height);
  --stepper-type-weight: var(--type-label-md-weight);
  --stepper-type-tracking: var(--type-label-md-tracking);
}

.vt-stepper-lg {
  --stepper-indicator-size: var(--spacing-10);
  --stepper-icon-size: var(--spacing-5);
  --stepper-type-size: var(--type-label-lg-size);
  --stepper-type-line-height: var(--type-label-lg-line-height);
  --stepper-type-weight: var(--type-label-lg-weight);
  --stepper-type-tracking: var(--type-label-lg-tracking);
}

.vt-stepper-connector {
  display: flex;
  align-items: center;
  flex: 1;
  min-width: var(--spacing-6);
  height: var(--stepper-indicator-size, var(--spacing-8));
  padding: 0 var(--spacing-2);
}

.vt-stepper-connector::before {
  content: "";
  flex: 1;
  height: var(--border-width-thick);
  border-radius: var(--radius-full);
  background: hsl(var(--border-default));
}

.vt-stepper-step-complete + .vt-stepper-connector::before {
  background: hsl(var(--brand-fill));
}

.vt-stepper-vertical {
  flex-direction: column;
  align-items: stretch;
}

.vt-stepper-vertical > .vt-stepper-step {
  flex-direction: row;
  align-items: flex-start;
  gap: var(--spacing-4);
  text-align: start;
}

.vt-stepper-vertical > .vt-stepper-step > .vt-stepper-content {
  align-items: flex-start;
  justify-content: center;
  min-height: var(--stepper-indicator-size, var(--spacing-8));
}

.vt-stepper-vertical > .vt-stepper-connector {
  flex: none;
  flex-direction: column;
  width: var(--stepper-indicator-size, var(--spacing-8));
  height: auto;
  min-height: var(--spacing-8);
  padding: var(--spacing-1) 0;
}

.vt-stepper-vertical > .vt-stepper-connector::before {
  width: var(--border-width-thick);
  height: auto;
}

.vt-stepper-circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--spacing-10);
  height: var(--spacing-10);
  border-radius: var(--radius-full);
  font-size: var(--type-body-sm-size);
  font-weight: var(--type-body-sm-weight);
  transition: all var(--transition-fast);
  line-height: var(--type-body-sm-line-height);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-stepper-line {
  flex: 1;
  height: var(--border-width-thick);
  border-radius: var(--radius-full);
  margin: 0 var(--spacing-2);
  align-self: flex-start;
  margin-top: var(--spacing-5);
}
/* Auto-generated by scripts/build-component-css.mjs from components/pagebutton.json. Do not edit manually. */

/* ── PageButton ────────────────────────────────────────── */

.vt-page-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  font-size: var(--type-label-md-size);
  font-weight: var(--type-label-md-weight);
  height: var(--control-height-md);
  min-width: var(--control-height-md);
  padding: 0 var(--spacing-3);
  border: var(--border-width-default) solid hsl(var(--border-default));
  background: hsl(var(--neutral-fill));
  color: hsl(var(--on-neutral));
  cursor: pointer;
  transition: background-color var(--transition-fast), color var(--transition-fast);
  line-height: var(--type-label-md-line-height);
  letter-spacing: var(--type-label-md-tracking);
  gap: var(--spacing-2);
}

.vt-page-btn:hover {
  background: hsl(var(--neutral-fill-hover));
}

.vt-page-btn.vt-active {
  background: hsl(var(--brand-fill));
  color: hsl(var(--on-brand));
  border-color: hsl(var(--brand-fill));
}

.vt-page-btn.vt-disabled,
.vt-page-btn:disabled {
  color: hsl(var(--foreground-disabled));
  cursor: not-allowed;
  opacity: 0.5;
}

/* ── PageButton · size ── */

.vt-page-btn-sm {
  height: var(--control-height-sm);
  min-width: var(--control-height-sm);
  padding: 0 var(--spacing-2);
  font-size: var(--type-label-sm-size);
  line-height: var(--type-label-sm-line-height);
  font-weight: var(--type-label-sm-weight);
  letter-spacing: var(--type-label-sm-tracking);
}

.vt-page-btn > svg {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
}
/* Auto-generated by scripts/build-component-css.mjs from components/pagination.json. Do not edit manually. */

/* ── Pagination ────────────────────────────────────────── */

.vt-pagination {
  display: flex;
  align-items: center;
  gap: var(--spacing-1);
}

.vt-pagination-ellipsis {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: var(--control-height-md);
  min-width: var(--control-height-md);
  color: hsl(var(--foreground-muted));
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-pagination-info {
  display: inline-block;
  padding: 0 var(--spacing-3);
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  white-space: nowrap;
}

.vt-pagination-info strong {
  font-weight: var(--font-weight-medium);
  color: hsl(var(--foreground-primary));
}
/* Auto-generated by scripts/build-component-css.mjs from components/table.json. Do not edit manually. */

/* ── Table ────────────────────────────────────────── */

.vt-table {
  width: 100%;
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  border-collapse: collapse;
}

.vt-table-wrap {
  display: flex;
  flex-direction: column;
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-sm);
  background: hsl(var(--surface-card));
  overflow: hidden;
}

.vt-table thead tr {
  background: hsl(var(--surface-subtle));
  border-bottom: var(--border-width-thin) solid hsl(var(--border-default));
}

.vt-table th {
  padding: var(--spacing-3) var(--spacing-4);
  text-align: start;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-label-sm-size);
  line-height: var(--type-label-sm-line-height);
  font-weight: var(--type-label-sm-weight);
  letter-spacing: var(--type-label-sm-tracking);
}

.vt-table td {
  padding: var(--spacing-3) var(--spacing-4);
}

.vt-table-compact th, .vt-table-compact td {
  padding: var(--spacing-1_5) var(--spacing-3);
}

.vt-table tbody tr + tr {
  border-top: var(--border-width-thin) solid hsl(var(--border-default));
}

.vt-table tbody tr.vt-selected {
  background: hsl(var(--surface-subtle) / 0.5);
}

.vt-table-striped tbody tr:nth-child(even) {
  background: hsl(var(--surface-subtle) / 0.5);
}

.vt-table-strong {
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-table-muted {
  color: hsl(var(--foreground-muted));
}

.vt-table .vt-table-end {
  text-align: end;
}

.vt-table .vt-table-numeric {
  text-align: end;
  font-variant-numeric: tabular-nums;
}

.vt-table-select {
  width: var(--spacing-12);
}

.vt-table-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--spacing-1);
}

.vt-table-sort {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-1);
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  transition: color var(--transition-fast);
}

.vt-table-sort:hover, .vt-table th[aria-sort="ascending"] .vt-table-sort, .vt-table th[aria-sort="descending"] .vt-table-sort {
  color: hsl(var(--foreground-primary));
}

.vt-table-sort > svg {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
}

.vt-table-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-4);
  padding: var(--spacing-3) var(--spacing-4);
  border-top: var(--border-width-thin) solid hsl(var(--border-default));
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/featuresectionitem.json. Do not edit manually. */

/* ── FeatureSectionItem ────────────────────────────────────────── */

.vt-feature-section-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--spacing-4);
}

/* ── FeatureSectionItem · layout ── */

.vt-feature-section-item-row {
  flex-direction: row;
}

.vt-feature-section-item-compact {
  flex-direction: row;
  align-items: center;
  gap: var(--spacing-2);
  color: hsl(var(--foreground-secondary));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-feature-section-item > .vt-icon-badge {
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-feature-section-item-content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
  flex: 1;
  min-width: 0;
}

.vt-feature-section-item:not(.vt-feature-section-item-row) > .vt-feature-section-item-content {
  align-self: stretch;
}

.vt-feature-section-item-title {
  margin: 0;
  color: hsl(var(--foreground-primary));
  font-size: var(--type-label-lg-size);
  line-height: var(--type-label-lg-line-height);
  font-weight: var(--type-label-lg-weight);
  letter-spacing: var(--type-label-lg-tracking);
}

.vt-feature-section-item-description {
  margin: 0;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-feature-section-item-content > .vt-link {
  align-self: flex-start;
}

.vt-feature-section-item-icon, .vt-feature-item-icon {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  color: hsl(var(--brand-fill));
}

.vt-feature-item {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
  color: hsl(var(--foreground-secondary));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/featuresection.json. Do not edit manually. */

/* ── FeatureSection ────────────────────────────────────────── */

.vt-feature-section {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-12);
  padding: var(--spacing-16) var(--spacing-6);
}

.vt-feature-section-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-3);
  text-align: center;
}

.vt-feature-section-title {
  margin: 0;
  color: hsl(var(--foreground-primary));
  font-size: var(--type-heading-lg-size);
  line-height: var(--type-heading-lg-line-height);
  font-weight: var(--type-heading-lg-weight);
  letter-spacing: var(--type-heading-lg-tracking);
}

.vt-feature-section-description {
  margin: 0;
  max-width: var(--spacing-96);
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-md-size);
  line-height: var(--type-body-md-line-height);
  font-weight: var(--type-body-md-weight);
  letter-spacing: var(--type-body-md-tracking);
}

.vt-feature-section-grid {
  display: grid;
  gap: var(--spacing-8);
  margin: 0;
  padding: 0;
  list-style: none;
}

.vt-feature-section-grid > * {
  width: 100%;
  min-width: 0;
}

.vt-feature-section-split {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-12);
}

.vt-feature-section-split > * {
  width: 100%;
  min-width: 0;
}

.vt-feature-section-list {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-6);
  margin: 0;
  padding: 0;
  list-style: none;
}

@media (min-width: 640px) {
  .vt-feature-section-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .vt-feature-section-grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 768px) {
  .vt-feature-section-split {
    flex-direction: row;
    align-items: center;
  }
  .vt-feature-section-split > * {
    flex: 1 1 0;
  }
}
/* Auto-generated by scripts/build-component-css.mjs from components/cta.json. Do not edit manually. */

/* ── CTA ────────────────────────────────────────── */

.vt-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-8);
  padding: var(--spacing-16) var(--spacing-6);
  text-align: center;
}

/* ── CTA · layout ── */

.vt-cta-split {
  align-items: flex-start;
  text-align: start;
}

/* ── CTA · surface ── */

.vt-cta-subtle {
  padding: var(--spacing-12);
  border-radius: var(--radius-2xl);
  background: hsl(var(--surface-subtle));
}

.vt-cta-brand {
  padding: var(--spacing-12);
  border-radius: var(--radius-2xl);
  background: hsl(var(--brand-fill));
}

.vt-cta-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-3);
}

.vt-cta-title {
  margin: 0;
  color: hsl(var(--foreground-primary));
  font-size: var(--type-heading-lg-size);
  line-height: var(--type-heading-lg-line-height);
  font-weight: var(--type-heading-lg-weight);
  letter-spacing: var(--type-heading-lg-tracking);
}

.vt-cta-description {
  margin: 0;
  max-width: var(--spacing-96);
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-md-size);
  line-height: var(--type-body-md-line-height);
  font-weight: var(--type-body-md-weight);
  letter-spacing: var(--type-body-md-tracking);
}

.vt-cta-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-3);
}

.vt-cta-split .vt-cta-content {
  align-items: flex-start;
}

.vt-cta-split .vt-cta-actions {
  justify-content: flex-start;
  flex-shrink: 0;
}

.vt-cta-brand .vt-cta-title {
  color: hsl(var(--on-brand));
}

.vt-cta-brand .vt-cta-description {
  color: hsl(var(--on-brand) / 0.8);
}

@media (min-width: 768px) {
  .vt-cta-split {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
}
/* Auto-generated by scripts/build-component-css.mjs from components/emptystate.json. Do not edit manually. */

/* ── EmptyState ────────────────────────────────────────── */

.vt-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-4);
  text-align: center;
  padding: var(--spacing-12) var(--spacing-6);
}

.vt-empty-state-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-1);
  width: 100%;
}

.vt-empty-state-title {
  margin: 0;
  font-size: var(--type-heading-sm-size);
  line-height: var(--type-heading-sm-line-height);
  font-weight: var(--type-heading-sm-weight);
  letter-spacing: var(--type-heading-sm-tracking);
}

.vt-empty-state-description {
  margin: 0;
  width: 100%;
  max-width: var(--spacing-96);
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  color: hsl(var(--foreground-muted));
}

.vt-empty-state-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--spacing-2);
  padding-top: var(--spacing-2);
}
/* Auto-generated by scripts/build-component-css.mjs from components/listitem.json. Do not edit manually. */

/* ── ListItem ────────────────────────────────────────── */

.vt-list-item {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  padding: var(--spacing-3) var(--spacing-4);
  transition: background-color var(--transition-fast);
}

.vt-list-item:hover {
  background: hsl(var(--surface-subtle));
}

.vt-list-item-icon {
  width: var(--spacing-5);
  height: var(--spacing-5);
  flex-shrink: 0;
  color: hsl(var(--foreground-muted));
}

.vt-list-item-content {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
}

.vt-list-item-title {
  color: hsl(var(--foreground-primary));
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-list-item > .vt-list-item-title {
  flex: 1;
  min-width: 0;
}

.vt-list-item-description {
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-list-item-meta {
  flex-shrink: 0;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-list-item > .vt-count-badge {
  flex-shrink: 0;
}

.vt-list-item-chevron {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  color: hsl(var(--foreground-muted));
}

.vt-list-item-check {
  display: none;
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  color: hsl(var(--brand-fill));
}

.vt-list-item.vt-selected > .vt-list-item-check, .vt-list-item[aria-selected="true"] > .vt-list-item-check {
  display: block;
}

.vt-list-item.vt-selected > .vt-list-item-chevron, .vt-list-item[aria-selected="true"] > .vt-list-item-chevron {
  display: none;
}

.vt-list-item.vt-active, .vt-list-item[aria-current]:not([aria-current="false"]) {
  background: hsl(var(--brand-fill) / 0.1);
}

.vt-list-item.vt-active .vt-list-item-title, .vt-list-item[aria-current]:not([aria-current="false"]) .vt-list-item-title, .vt-list-item.vt-active > .vt-list-item-icon, .vt-list-item[aria-current]:not([aria-current="false"]) > .vt-list-item-icon {
  color: hsl(var(--brand-fill));
}

.vt-list-item[role="option"] {
  cursor: pointer;
}

.vt-list-item-danger .vt-list-item-title {
  color: hsl(var(--error-fill));
}
/* Auto-generated by scripts/build-component-css.mjs from components/list.json. Do not edit manually. */

/* ── List ────────────────────────────────────────── */

.vt-list {
  display: flex;
  flex-direction: column;
  list-style: none;
  margin: 0;
  padding: 0;
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-lg);
  background: hsl(var(--surface-card));
  overflow: hidden;
}

.vt-list > .vt-list-item + .vt-list-item {
  border-top: var(--border-width-thin) solid hsl(var(--border-default));
}

.vt-list-section {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1_5);
}

.vt-list-section > .vt-section-label {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0 var(--spacing-4);
}
/* Auto-generated by scripts/build-component-css.mjs from components/toast.json. Do not edit manually. */

/* ── Toast ────────────────────────────────────────── */

.vt-toast {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-3);
  border-radius: var(--radius-lg);
  border: var(--border-width-default) solid hsl(var(--border-default));
  background: hsl(var(--surface-card));
  padding: var(--spacing-4);
  box-shadow: var(--shadow-lg);
  min-width: var(--container-toast-min);
  max-width: var(--container-toast-max);
  --toast-icon: hsl(var(--foreground-muted));
}

/* ── Toast · intent ── */

.vt-toast-success {
  --toast-icon: hsl(var(--success-fill));
}

.vt-toast-danger {
  --toast-icon: hsl(var(--error-fill));
  border-color: hsl(var(--error-border));
}

.vt-toast-icon {
  width: var(--spacing-5);
  height: var(--spacing-5);
  flex-shrink: 0;
  color: var(--toast-icon);
}

.vt-toast-content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-0_5);
  flex: 1;
  min-width: 0;
}

.vt-toast-title {
  margin: 0;
  color: hsl(var(--foreground-primary));
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-toast-description {
  margin: 0;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-toast > .vt-btn {
  flex-shrink: 0;
}
/* Auto-generated by scripts/build-component-css.mjs from components/banner.json. Do not edit manually. */

/* ── Banner ────────────────────────────────────────── */

.vt-banner {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  width: 100%;
  padding: var(--spacing-3) var(--spacing-4);
  border-radius: var(--radius-md);
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

/* ── Banner · intent ── */

.vt-banner-info {
  background: hsl(var(--info-surface));
  color: hsl(var(--info-text));
}

.vt-banner-success {
  background: hsl(var(--success-surface));
  color: hsl(var(--success-text));
}

.vt-banner-warning {
  background: hsl(var(--warning-surface));
  color: hsl(var(--warning-text));
}

.vt-banner-danger {
  background: hsl(var(--error-surface));
  color: hsl(var(--error-text));
}

.vt-banner-icon {
  width: var(--spacing-5);
  height: var(--spacing-5);
  flex-shrink: 0;
}

.vt-banner-text {
  flex: 1;
  min-width: 0;
  margin: 0;
}

.vt-banner-link {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: var(--spacing-0_5);
  font-weight: var(--font-weight-medium);
}

.vt-banner > .vt-btn {
  flex-shrink: 0;
}

.vt-banner-sm {
  padding: var(--spacing-2) var(--spacing-4);
  gap: var(--spacing-2);
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-banner-sm .vt-banner-icon {
  width: var(--spacing-4);
  height: var(--spacing-4);
}
/* Auto-generated by scripts/build-component-css.mjs from components/progress.json. Do not edit manually. */

/* ── Progress ────────────────────────────────────────── */

.vt-progress {
  --progress-fill: hsl(var(--brand-fill));
  width: 100%;
  height: var(--spacing-2);
  border-radius: var(--radius-full);
  background: hsl(var(--surface-subtle));
  overflow: hidden;
}

/* ── Progress · size ── */

.vt-progress-sm {
  height: var(--spacing-1);
}

.vt-progress-lg {
  height: var(--spacing-3);
}

/* ── Progress · color ── */

.vt-progress-success {
  --progress-fill: hsl(var(--success-fill));
}

.vt-progress-warning {
  --progress-fill: hsl(var(--warning-fill));
}

.vt-progress-danger {
  --progress-fill: hsl(var(--error-fill));
}

.vt-progress-bar {
  height: 100%;
  border-radius: var(--radius-full);
  background: var(--progress-fill, hsl(var(--brand-fill)));
  transition: width var(--transition-slow);
}
/* Auto-generated by scripts/build-component-css.mjs from components/chip.json. Do not edit manually. */

/* ── Chip ────────────────────────────────────────── */

.vt-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-1_5);
  border-radius: var(--radius-full);
  padding: var(--spacing-1_5) var(--spacing-3);
  font-size: var(--type-label-md-size);
  font-weight: var(--type-label-md-weight);
  border: var(--border-width-thin) solid hsl(var(--border-default));
  background: hsl(var(--surface-card));
  cursor: pointer;
  transition: all var(--transition-fast);
  line-height: var(--type-label-md-line-height);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-chip:hover {
  background: hsl(var(--surface-subtle));
}

.vt-chip.vt-chip-active {
  border-color: hsl(var(--brand-fill));
  background: hsl(var(--brand-fill));
  color: hsl(var(--on-brand));
}

.vt-chip:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.vt-chip-sm {
  gap: var(--spacing-1);
  padding: var(--spacing-0_5) var(--spacing-2);
  font-size: var(--type-label-sm-size);
  line-height: var(--type-label-sm-line-height);
  font-weight: var(--type-label-sm-weight);
  letter-spacing: var(--type-label-sm-tracking);
}

.vt-chip-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  border-radius: var(--radius-full);
  background: transparent;
  color: hsl(var(--foreground-muted));
  cursor: pointer;
  transition: color var(--transition-fast), background-color var(--transition-fast);
}

.vt-chip-remove:hover {
  background: hsl(var(--surface-moderate));
  color: hsl(var(--foreground-primary));
}

.vt-chip-remove > svg {
  width: var(--spacing-3);
  height: var(--spacing-3);
}

.vt-chip-active .vt-chip-remove {
  color: inherit;
}
/* Auto-generated by scripts/build-component-css.mjs from components/toolbar.json. Do not edit manually. */

/* ── Toolbar ────────────────────────────────────────── */

.vt-toolbar {
  display: flex;
  align-items: center;
  gap: var(--spacing-1);
  padding: var(--spacing-1);
  border: var(--border-width-default) solid hsl(var(--border-default));
  border-radius: var(--radius-md);
  background: hsl(var(--surface-card));
}

/* ── Toolbar · style ── */

.vt-toolbar-floating {
  box-shadow: var(--shadow-lg);
}

.vt-toolbar > .vt-btn {
  border-radius: calc(var(--radius-md) - var(--spacing-1));
}

.vt-toolbar > .vt-btn.vt-active {
  --btn-bg: hsl(var(--surface-subtle));
  --btn-fg: hsl(var(--foreground-primary));
}

.vt-toolbar > .vt-separator-v {
  align-self: stretch;
  height: auto;
}

.vt-toolbar-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--spacing-8) + var(--spacing-1));
  height: calc(var(--spacing-8) + var(--spacing-1));
  border-radius: var(--radius-sm);
  border: none;
  background: transparent;
  color: hsl(var(--foreground-secondary));
  cursor: pointer;
  font-size: var(--type-label-md-size);
  font-weight: var(--type-label-md-weight);
  transition: background-color var(--transition-fast), color var(--transition-fast);
  line-height: var(--type-label-md-line-height);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-toolbar-btn:hover {
  background: hsl(var(--surface-subtle));
  color: hsl(var(--foreground-primary));
}

.vt-toolbar-btn.vt-active {
  background: hsl(var(--surface-subtle));
  color: hsl(var(--foreground-primary));
}
/* Auto-generated by scripts/build-component-css.mjs from components/calendarday.json. Do not edit manually. */

/* ── CalendarDay ────────────────────────────────────────── */

.vt-calendar-day {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--control-height-sm);
  height: var(--control-height-sm);
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: var(--radius-full);
  background: transparent;
  color: hsl(var(--foreground-primary));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  cursor: pointer;
  transition: background-color var(--transition-fast), color var(--transition-fast);
  position: relative;
  isolation: isolate;
}

.vt-calendar-day:hover {
  background: hsl(var(--surface-subtle));
}

.vt-calendar-day:disabled {
  background: transparent;
  cursor: default;
}

.vt-calendar-day.vt-muted,
.vt-calendar-day.vt-outside {
  color: hsl(var(--foreground-muted));
}

.vt-calendar-day.vt-today {
  border: var(--border-width-default) solid hsl(var(--brand-fill));
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-calendar-day.vt-range-middle {
  background: transparent;
}

.vt-calendar-day.vt-active {
  background: hsl(var(--brand-fill));
  color: hsl(var(--on-brand));
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-calendar-day.vt-range-start,
.vt-calendar-day.vt-range-end {
  background: transparent;
  color: hsl(var(--on-brand));
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-calendar-day.vt-range-start::before, .vt-calendar-day.vt-range-middle::before, .vt-calendar-day.vt-range-end::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: hsl(var(--brand-fill) / 0.15);
}

.vt-calendar-day.vt-today::before {
  inset: calc(-1 * var(--border-width-default));
}

.vt-calendar-day.vt-range-start::before {
  inset-inline-start: 50%;
}

.vt-calendar-day.vt-range-end::before {
  inset-inline-end: 50%;
}

.vt-calendar-week > .vt-calendar-day.vt-range-middle:first-child::before, .vt-date-picker-week > .vt-calendar-day.vt-range-middle:first-child::before {
  border-start-start-radius: var(--radius-full);
  border-end-start-radius: var(--radius-full);
}

.vt-calendar-week > .vt-calendar-day.vt-range-middle:last-child::before, .vt-date-picker-week > .vt-calendar-day.vt-range-middle:last-child::before {
  border-start-end-radius: var(--radius-full);
  border-end-end-radius: var(--radius-full);
}

.vt-calendar-week > .vt-calendar-day.vt-range-start:last-child::before, .vt-date-picker-week > .vt-calendar-day.vt-range-start:last-child::before, .vt-calendar-week > .vt-calendar-day.vt-range-end:first-child::before, .vt-date-picker-week > .vt-calendar-day.vt-range-end:first-child::before, .vt-calendar-day.vt-range-start.vt-range-end::before {
  display: none;
}

.vt-calendar-day.vt-range-start::after, .vt-calendar-day.vt-range-end::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: var(--radius-full);
  background: hsl(var(--brand-fill));
}

.vt-calendar-day.vt-today.vt-range-start::after, .vt-calendar-day.vt-today.vt-range-end::after {
  inset: var(--spacing-0_5);
}
/* Auto-generated by scripts/build-component-css.mjs from components/carouselnav.json. Do not edit manually. */

/* ── CarouselNav ────────────────────────────────────────── */

.vt-carousel-nav-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--control-height-sm);
  height: var(--control-height-sm);
  border-radius: var(--radius-full);
  border: var(--border-width-default) solid hsl(var(--border-default));
  background: hsl(var(--surface-card));
  flex-shrink: 0;
  cursor: pointer;
  transition: background-color var(--transition-fast);
}

.vt-carousel-nav-btn:hover {
  background: hsl(var(--surface-subtle));
}
/* Auto-generated by scripts/build-component-css.mjs from components/carousel.json. Do not edit manually. */

/* ── Carousel ────────────────────────────────────────── */

.vt-carousel {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
}

.vt-carousel-content {
  display: flex;
  align-items: center;
  gap: var(--spacing-4);
}

.vt-carousel-viewport {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.vt-carousel-track {
  display: flex;
  gap: var(--spacing-4);
  transition: transform var(--transition-slow);
}

.vt-carousel-slide {
  display: flex;
  flex-direction: column;
  flex: 0 0 100%;
  min-width: 0;
}

.vt-carousel[data-visible="2"] .vt-carousel-slide {
  flex-basis: calc((100% - var(--spacing-4)) / 2);
}

.vt-carousel[data-visible="3"] .vt-carousel-slide {
  flex-basis: calc((100% - 2 * var(--spacing-4)) / 3);
}

.vt-btn.vt-carousel-nav {
  --btn-radius: var(--radius-full);
  flex-shrink: 0;
}

.vt-carousel-controls {
  display: flex;
  justify-content: center;
  gap: var(--spacing-2);
}

.vt-carousel-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-2);
}

.vt-carousel-dot {
  width: var(--spacing-2);
  height: var(--spacing-2);
  padding: 0;
  border: 0;
  border-radius: var(--radius-full);
  background: hsl(var(--surface-moderate));
  cursor: pointer;
  transition: background-color var(--transition-fast);
}

.vt-carousel-dot.vt-active {
  background: hsl(var(--brand-fill));
}
/* Auto-generated by scripts/build-component-css.mjs from components/codeheader.json. Do not edit manually. */

/* ── CodeHeader ────────────────────────────────────────── */

.vt-code-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-2);
  min-height: var(--control-height-md);
  padding: var(--spacing-1) var(--spacing-1) var(--spacing-1) var(--spacing-4);
  border-bottom: var(--border-width-thin) solid hsl(var(--border-default));
}

.vt-code-header-title {
  color: hsl(var(--foreground-muted));
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/codeinline.json. Do not edit manually. */

/* ── CodeInline ────────────────────────────────────────── */

.vt-code-inline {
  border-radius: var(--radius-sm);
  background: hsl(var(--surface-subtle));
  padding: var(--spacing-0_5) var(--spacing-1_5);
  font-family: var(--font-family-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace);
  color: hsl(var(--foreground-primary));
  font-size: var(--type-code-md-size);
  line-height: var(--type-code-md-line-height);
  font-weight: var(--type-code-md-weight);
  letter-spacing: var(--type-code-md-tracking);
}

/* ── CodeInline · size ── */

.vt-code-inline-sm {
  padding: var(--spacing-0_5) var(--spacing-1);
  font-size: var(--type-code-sm-size);
  line-height: var(--type-code-sm-line-height);
  font-weight: var(--type-code-sm-weight);
  letter-spacing: var(--type-code-sm-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/codeblock.json. Do not edit manually. */

/* ── CodeBlock ────────────────────────────────────────── */

.vt-code-block {
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-md);
  background: hsl(var(--surface-subtle));
  color: hsl(var(--foreground-primary));
  overflow: hidden;
}

.vt-code-block-body {
  margin: 0;
  padding: var(--spacing-4);
  overflow-x: auto;
  font-family: var(--font-family-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace);
  font-size: var(--type-code-md-size);
  line-height: var(--type-code-md-line-height);
  font-weight: var(--type-code-md-weight);
  letter-spacing: var(--type-code-md-tracking);
}

.vt-code-block-comment {
  color: hsl(var(--foreground-muted));
}

.vt-code-block-prompt {
  color: hsl(var(--brand-fill));
  user-select: none;
}

.vt-code-block-line {
  display: block;
  margin: 0 calc(var(--spacing-4) * -1);
  padding: 0 var(--spacing-4);
}

.vt-code-block-line-highlight {
  background: hsl(var(--brand-fill) / 0.1);
  border-inline-start: var(--border-width-medium) solid hsl(var(--brand-fill));
  padding-inline-start: calc(var(--spacing-4) - var(--border-width-medium));
}

.vt-code-block-line-number {
  display: inline-block;
  min-width: var(--spacing-8);
  margin-inline-end: var(--spacing-3);
  padding-inline-end: var(--spacing-3);
  border-inline-end: var(--border-width-thin) solid hsl(var(--border-default));
  color: hsl(var(--foreground-muted));
  text-align: end;
  user-select: none;
}

.vt-code-block-dots {
  display: flex;
  align-items: center;
  gap: var(--spacing-1_5);
}

.vt-code-block-dots > span {
  width: var(--spacing-3);
  height: var(--spacing-3);
  border-radius: var(--radius-full);
  background: hsl(var(--error-fill) / 0.5);
}

.vt-code-block-dots > span + span {
  background: hsl(var(--warning-fill) / 0.5);
}

.vt-code-block-dots > span + span + span {
  background: hsl(var(--success-fill) / 0.5);
}
/* Auto-generated by scripts/build-component-css.mjs from components/media.json. Do not edit manually. */

/* ── Media ────────────────────────────────────────── */

.vt-media {
  display: flex;
  flex-direction: column;
  margin: 0;
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-2xl);
  background: hsl(var(--surface-card));
  overflow: hidden;
}

/* ── Media · ratio ── */

.vt-media-video {
  aspect-ratio: 16 / 9;
}

.vt-media-landscape {
  aspect-ratio: 4 / 3;
}

.vt-media-square {
  aspect-ratio: 1 / 1;
}

.vt-media-portrait {
  aspect-ratio: 3 / 4;
}

.vt-media-frame {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background: hsl(var(--surface-subtle));
  color: hsl(var(--foreground-muted));
  overflow: hidden;
}

.vt-media-frame > img, .vt-media-frame > video, .vt-media-frame > iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  object-fit: cover;
}

.vt-media-icon {
  width: var(--spacing-8);
  height: var(--spacing-8);
  flex-shrink: 0;
}

.vt-media-caption {
  padding: var(--spacing-3) var(--spacing-4);
  border-top: var(--border-width-thin) solid hsl(var(--border-default));
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-media-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: var(--spacing-1);
  padding: var(--spacing-6);
  background: linear-gradient(to top, hsl(var(--generic-black) / 0.8), transparent);
  color: hsl(var(--generic-white));
}

.vt-media-overlay-title {
  margin: 0;
  font-size: var(--type-heading-sm-size);
  line-height: var(--type-heading-sm-line-height);
  font-weight: var(--type-heading-sm-weight);
  letter-spacing: var(--type-heading-sm-tracking);
}

.vt-media-overlay-text {
  margin: 0;
  color: hsl(var(--generic-white) / 0.8);
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/countbadge.json. Do not edit manually. */

/* ── CountBadge ────────────────────────────────────────── */

.vt-count-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--spacing-5);
  height: var(--spacing-5);
  padding: 0 var(--spacing-1_5);
  font-size: var(--type-caption-size);
  font-weight: var(--type-caption-weight);
  border-radius: var(--radius-full);
  background: hsl(var(--error-fill));
  color: hsl(var(--on-error));
  box-shadow: 0 0 0 var(--border-width-thick) hsl(var(--surface-page));
  line-height: var(--type-caption-line-height);
  letter-spacing: var(--type-caption-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/notificationbadge.json. Do not edit manually. */

@keyframes vt-notification-ping {
  75%, 100% { transform: scale(2); opacity: 0; }
}

/* ── NotificationBadge ────────────────────────────────────────── */

.vt-notification-badge {
  --notification-badge-bg: hsl(var(--error-fill));
  --notification-badge-fg: hsl(var(--on-error));
  position: relative;
  display: inline-flex;
  vertical-align: middle;
}

/* ── NotificationBadge · intent ── */

.vt-notification-badge-info {
  --notification-badge-bg: hsl(var(--info-fill));
  --notification-badge-fg: hsl(var(--on-info));
}

.vt-notification-badge-success {
  --notification-badge-bg: hsl(var(--success-fill));
  --notification-badge-fg: hsl(var(--on-success));
}

.vt-notification-badge-warning {
  --notification-badge-bg: hsl(var(--warning-fill));
  --notification-badge-fg: hsl(var(--on-warning));
}

.vt-notification-badge-neutral {
  --notification-badge-bg: hsl(var(--foreground-muted));
  --notification-badge-fg: hsl(var(--surface-page));
}

.vt-notification-dot {
  position: absolute;
  top: calc(-1 * var(--spacing-1));
  inset-inline-end: calc(-1 * var(--spacing-1));
  width: var(--spacing-3);
  height: var(--spacing-3);
  border-radius: var(--radius-full);
  background: var(--notification-badge-bg);
  box-shadow: 0 0 0 var(--border-width-thick) hsl(var(--surface-page));
}

.vt-notification-badge > .vt-avatar + .vt-notification-dot {
  top: auto;
  bottom: 0;
  inset-inline-end: 0;
}

.vt-notification-badge > .vt-count-badge {
  position: absolute;
  top: calc(-1 * var(--spacing-1_5));
  inset-inline-end: calc(-1 * var(--spacing-1_5));
  background: var(--notification-badge-bg);
  color: var(--notification-badge-fg);
}

.vt-notification-badge-ping > .vt-notification-dot::after, .vt-notification-badge-ping > .vt-count-badge::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: inherit;
  opacity: 0.75;
  animation: vt-notification-ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
  z-index: -1;
}

.vt-notification-badge-ping > .vt-notification-dot, .vt-notification-badge-ping > .vt-count-badge {
  isolation: isolate;
}
/* Auto-generated by scripts/build-component-css.mjs from components/iconbadge.json. Do not edit manually. */

/* ── IconBadge ────────────────────────────────────────── */

.vt-icon-badge {
  --icon-badge-bg: hsl(var(--surface-subtle));
  --icon-badge-fg: hsl(var(--foreground-secondary));
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--spacing-10);
  height: var(--spacing-10);
  border-radius: var(--radius-full);
  background: var(--icon-badge-bg);
  color: var(--icon-badge-fg);
  flex-shrink: 0;
}

/* ── IconBadge · size ── */

.vt-icon-badge-sm {
  width: var(--spacing-7);
  height: var(--spacing-7);
}

.vt-icon-badge-md {
  width: var(--spacing-10);
  height: var(--spacing-10);
}

.vt-icon-badge-lg {
  width: var(--spacing-12);
  height: var(--spacing-12);
}

/* ── IconBadge · shape ── */

.vt-icon-badge-square {
  border-radius: var(--radius-md);
}

.vt-icon-badge-icon {
  width: var(--spacing-5);
  height: var(--spacing-5);
  flex-shrink: 0;
}

.vt-icon-badge-sm .vt-icon-badge-icon {
  width: var(--spacing-4);
  height: var(--spacing-4);
}

.vt-icon-badge-lg .vt-icon-badge-icon {
  width: var(--spacing-6);
  height: var(--spacing-6);
}
/* Auto-generated by scripts/build-component-css.mjs from components/statusdot.json. Do not edit manually. */

@keyframes vt-dot-ping {
  75%, 100% { transform: scale(2.5); opacity: 0; }
}

/* ── StatusDot ────────────────────────────────────────── */

.vt-dot {
  display: inline-block;
  width: var(--spacing-2);
  height: var(--spacing-2);
  border-radius: var(--radius-full);
  background: hsl(var(--foreground-muted));
  flex-shrink: 0;
  vertical-align: middle;
}

/* ── StatusDot · color ── */

.vt-dot-brand {
  background: hsl(var(--brand-fill));
}

.vt-dot-info {
  background: hsl(var(--info-fill));
}

.vt-dot-success {
  background: hsl(var(--success-fill));
}

.vt-dot-warning {
  background: hsl(var(--warning-fill));
}

.vt-dot-danger {
  background: hsl(var(--error-fill));
}

.vt-dot-current {
  background: currentColor;
}

/* ── StatusDot · size ── */

.vt-dot-sm {
  width: var(--spacing-1_5);
  height: var(--spacing-1_5);
}

.vt-dot-md {
  width: var(--spacing-2);
  height: var(--spacing-2);
}

/* ── StatusDot · motion ── */

.vt-dot-pulse {
  position: relative;
}

.vt-dot-pulse::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: inherit;
  opacity: 0.75;
  animation: vt-dot-ping 1.5s cubic-bezier(0, 0, 0.2, 1) infinite;
}

@media (prefers-reduced-motion: reduce) {
  .vt-dot-pulse::after {
    animation: none;
    opacity: 0;
  }
}
/* Auto-generated by scripts/build-component-css.mjs from components/message.json. Do not edit manually. */

/* ── Message ────────────────────────────────────────── */

.vt-message {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-2);
}

/* ── Message · direction ── */

.vt-message-out {
  justify-content: flex-end;
}

.vt-message > .vt-avatar {
  flex-shrink: 0;
}

.vt-message-body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--spacing-1);
  min-width: 0;
  max-width: min(80%, calc(var(--spacing-96) + var(--spacing-16)));
}

.vt-message-out > .vt-message-body {
  align-items: flex-end;
}

.vt-message-bubble {
  max-width: 100%;
  padding: var(--spacing-2) var(--spacing-4);
  border-radius: var(--radius-2xl);
  background: hsl(var(--surface-subtle));
  color: hsl(var(--foreground-primary));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-message-out .vt-message-bubble {
  background: hsl(var(--brand-fill));
  color: hsl(var(--on-brand));
}

.vt-message-out.vt-message-subtle .vt-message-bubble {
  background: hsl(var(--surface-subtle));
  color: hsl(var(--foreground-primary));
}

.vt-message-meta {
  display: flex;
  align-items: baseline;
  gap: var(--spacing-2);
  color: hsl(var(--foreground-muted));
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-message-author {
  color: hsl(var(--foreground-secondary));
  font-size: var(--type-label-sm-size);
  line-height: var(--type-label-sm-line-height);
  font-weight: var(--type-label-sm-weight);
  letter-spacing: var(--type-label-sm-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/footerlink.json. Do not edit manually. */

/* ── FooterLink ────────────────────────────────────────── */

.vt-footer-link {
  font-size: var(--type-body-sm-size);
  color: hsl(var(--foreground-secondary));
  text-decoration: none;
  transition: color var(--transition-fast);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-footer-link:hover {
  color: hsl(var(--foreground-primary));
}
/* Auto-generated by scripts/build-component-css.mjs from components/footer.json. Do not edit manually. */

/* ── Footer ────────────────────────────────────────── */

.vt-footer {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-10);
  width: 100%;
  padding: var(--spacing-10) var(--spacing-6);
  background: hsl(var(--surface-card));
  border-top: var(--border-width-thin) solid hsl(var(--border-default));
  color: hsl(var(--foreground-primary));
}

.vt-footer-main {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--spacing-10);
}

.vt-footer-about {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3);
  flex: 1 1 var(--spacing-64);
  max-width: var(--spacing-96);
}

.vt-footer-brand {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: var(--spacing-2);
  color: hsl(var(--foreground-primary));
  text-decoration: none;
  font-size: var(--type-heading-sm-size);
  line-height: var(--type-heading-sm-line-height);
  font-weight: var(--type-heading-sm-weight);
  letter-spacing: var(--type-heading-sm-tracking);
}

.vt-footer-brand > .vt-icon-badge {
  background: hsl(var(--brand-fill));
  color: hsl(var(--on-brand));
}

.vt-footer-description {
  margin: 0;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-footer-form {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
}

.vt-footer-form > .vt-input {
  flex: 1;
  min-width: 0;
}

.vt-footer-columns {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-12);
}

.vt-footer-column {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3);
  min-width: var(--spacing-28);
}

.vt-footer-column-title {
  margin: 0;
  color: hsl(var(--foreground-primary));
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-footer-column-links {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--spacing-2);
}

.vt-footer-bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-4);
  padding-top: var(--spacing-6);
  border-top: var(--border-width-thin) solid hsl(var(--border-default));
}

.vt-footer-copyright {
  margin: 0;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-footer-social {
  display: flex;
  align-items: center;
  gap: var(--spacing-1);
}

.vt-footer-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--spacing-6);
}

.vt-footer-centered {
  align-items: center;
  gap: var(--spacing-4);
  padding: var(--spacing-8) var(--spacing-6);
  text-align: center;
}

.vt-footer-centered .vt-footer-nav {
  justify-content: center;
}

.vt-footer-centered .vt-footer-brand {
  align-self: center;
}

.vt-footer-bar {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-4);
  min-height: var(--spacing-14);
  padding: var(--spacing-3) var(--spacing-6);
}

.vt-footer-bar .vt-footer-nav {
  gap: var(--spacing-4);
}
/* Auto-generated by scripts/build-component-css.mjs from components/header.json. Do not edit manually. */

/* ── Header ────────────────────────────────────────── */

.vt-header {
  display: flex;
  align-items: center;
  gap: var(--spacing-8);
  width: 100%;
  height: var(--spacing-16);
  padding: 0 var(--spacing-6);
  background: hsl(var(--surface-card));
  border-bottom: var(--border-width-thin) solid hsl(var(--border-default));
  color: hsl(var(--foreground-primary));
}

.vt-header-brand {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-2);
  flex-shrink: 0;
  color: hsl(var(--foreground-primary));
  text-decoration: none;
  font-size: var(--type-heading-sm-size);
  line-height: var(--type-heading-sm-line-height);
  font-weight: var(--type-heading-sm-weight);
  letter-spacing: var(--type-heading-sm-tracking);
}

.vt-header-brand > .vt-icon-badge {
  background: hsl(var(--brand-fill));
  color: hsl(var(--on-brand));
}

.vt-header-nav {
  display: flex;
  align-items: center;
  gap: var(--spacing-1);
  flex: 1;
  min-width: 0;
}

.vt-header-nav > .vt-nav-item {
  white-space: nowrap;
}

.vt-header-nav > .vt-link + .vt-link {
  margin-inline-start: var(--spacing-5);
}

.vt-header-nav .vt-link[aria-current="page"] {
  color: hsl(var(--foreground-primary));
}

.vt-header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--spacing-2);
  margin-inline-start: auto;
}

.vt-header-search {
  position: relative;
  width: var(--spacing-60);
}

.vt-header-sm {
  height: var(--spacing-14);
  gap: var(--spacing-6);
}

.vt-header-centered .vt-header-nav {
  flex: none;
}

.vt-header-centered > .vt-header-brand, .vt-header-centered > .vt-header-actions {
  flex: 1 1 0;
}

.vt-header-transparent {
  background: transparent;
  border-bottom-color: transparent;
  color: hsl(var(--on-brand));
}

.vt-header-transparent .vt-header-brand {
  color: hsl(var(--on-brand));
}

.vt-header-transparent .vt-header-brand > .vt-icon-badge {
  background: hsl(var(--on-brand));
  color: hsl(var(--brand-fill));
}

.vt-header-transparent .vt-header-nav .vt-link {
  color: hsl(var(--on-brand) / 0.8);
}

.vt-header-transparent .vt-header-nav .vt-link:hover, .vt-header-transparent .vt-header-nav .vt-link[aria-current="page"] {
  color: hsl(var(--on-brand));
}

.vt-header-transparent .vt-header-nav .vt-nav-item {
  color: hsl(var(--on-brand) / 0.8);
}

.vt-header-transparent .vt-header-nav .vt-nav-item:hover, .vt-header-transparent .vt-header-nav .vt-nav-item.vt-active {
  background: hsl(var(--on-brand) / 0.15);
  color: hsl(var(--on-brand));
}

@media (max-width: 767.98px) {
  .vt-header-search {
    display: none;
  }
}

@media (max-width: 639.98px) {
  .vt-header-nav {
    display: none;
  }
}
/* Auto-generated by scripts/build-component-css.mjs from components/timelinedot.json. Do not edit manually. */

/* ── TimelineDot ────────────────────────────────────────── */

.vt-timeline-dot {
  display: block;
  width: var(--spacing-3);
  height: var(--spacing-3);
  border-radius: var(--radius-full);
  background: hsl(var(--brand-fill));
  flex-shrink: 0;
}

/* ── TimelineDot · state ── */

.vt-timeline-dot-current {
  box-shadow: 0 0 0 var(--spacing-1) hsl(var(--brand-fill) / 0.2);
}

.vt-timeline-dot-upcoming {
  background: hsl(var(--surface-moderate));
}
/* Auto-generated by scripts/build-component-css.mjs from components/timelineitem.json. Do not edit manually. */

/* ── TimelineItem ────────────────────────────────────────── */

.vt-timeline-item {
  display: flex;
  gap: var(--spacing-4);
}

.vt-timeline-marker {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-1);
  padding-top: var(--spacing-1);
  flex-shrink: 0;
}

.vt-timeline-marker > .vt-icon-badge {
  background: hsl(var(--brand-fill) / 0.1);
  color: hsl(var(--brand-fill));
}

.vt-timeline-line {
  display: block;
  flex: 1;
  width: var(--border-width-thick);
  min-height: var(--spacing-4);
  background: hsl(var(--border-default));
}

.vt-timeline-item-complete .vt-timeline-line {
  background: hsl(var(--brand-fill));
}

.vt-timeline-content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
  flex: 1;
  min-width: 0;
  padding-bottom: var(--spacing-8);
}

.vt-timeline-item:last-child > .vt-timeline-marker > .vt-timeline-line {
  display: none;
}

.vt-timeline-item:last-child > .vt-timeline-content {
  padding-bottom: 0;
}

.vt-timeline-title {
  margin: 0;
  color: hsl(var(--foreground-primary));
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-timeline-item-upcoming .vt-timeline-title {
  color: hsl(var(--foreground-muted));
}

.vt-timeline-description {
  margin: 0;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-timeline-time {
  color: hsl(var(--foreground-muted));
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/timeline.json. Do not edit manually. */

/* ── Timeline ────────────────────────────────────────── */

.vt-timeline {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
}

.vt-timeline-alternate > .vt-timeline-item {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
}

.vt-timeline-alternate > .vt-timeline-item > .vt-timeline-marker {
  grid-column: 2;
  grid-row: 1;
}

.vt-timeline-alternate > .vt-timeline-item > .vt-timeline-content {
  grid-column: 3;
  grid-row: 1;
}

.vt-timeline-alternate > .vt-timeline-item:nth-child(odd) > .vt-timeline-content {
  grid-column: 1;
  align-items: flex-end;
  text-align: end;
}
/* Auto-generated by scripts/build-component-css.mjs from components/notificationbtn.json. Do not edit manually. */

/* ── NotificationBtn ────────────────────────────────────────── */

.vt-notification-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: var(--control-height-md);
  height: var(--control-height-md);
  border-radius: var(--radius-2xl);
  border: var(--border-width-default) solid hsl(var(--border-default));
  background: hsl(var(--surface-card));
  cursor: pointer;
  transition: background-color var(--transition-fast);
}

.vt-notification-btn:hover {
  background: hsl(var(--surface-subtle));
}
/* Auto-generated by scripts/build-component-css.mjs from components/checklabel.json. Do not edit manually. */

/* ── CheckLabel ────────────────────────────────────────── */

.vt-check-label {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  cursor: pointer;
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  color: hsl(var(--foreground-primary));
}

.vt-check-label-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
}

.vt-check-label-title {
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
  color: hsl(var(--foreground-primary));
}

.vt-check-label-description {
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  color: hsl(var(--foreground-muted));
}

.vt-check-label:has(> .vt-check-label-content) {
  align-items: flex-start;
}

.vt-check-label:has(> .vt-check-label-content) > .vt-checkbox, .vt-check-label:has(> .vt-check-label-content) > .vt-radio {
  margin-top: calc((var(--type-label-md-line-height) - var(--spacing-4)) / 2);
}

.vt-check-label.vt-disabled, .vt-check-label:has(> .disabled), .vt-check-label:has(> :disabled) {
  cursor: not-allowed;
  color: hsl(var(--foreground-disabled));
}

.vt-check-label.vt-disabled .vt-check-label-title, .vt-check-label.vt-disabled .vt-check-label-description, .vt-check-label:has(> .disabled) .vt-check-label-title, .vt-check-label:has(> .disabled) .vt-check-label-description, .vt-check-label:has(> :disabled) .vt-check-label-title, .vt-check-label:has(> :disabled) .vt-check-label-description {
  color: hsl(var(--foreground-disabled));
}
/* Auto-generated by scripts/build-component-css.mjs from components/card.json. Do not edit manually. */

/* ── Card ────────────────────────────────────────── */

.vt-card {
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-2xl);
  background: hsl(var(--surface-card));
  overflow: hidden;
}

/* ── Card · size ── */

.vt-card-sm {
  border-radius: var(--radius-lg);
}

.vt-card-header {
  position: relative;
  padding: var(--spacing-5) var(--spacing-6);
  border-bottom: var(--border-width-thin) solid hsl(var(--border-default));
}

.vt-card-title {
  margin: 0;
  font-size: var(--type-heading-sm-size);
  line-height: var(--type-heading-sm-line-height);
  font-weight: var(--type-heading-sm-weight);
  letter-spacing: var(--type-heading-sm-tracking);
}

.vt-card-description {
  margin: var(--spacing-1) 0 0;
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  color: hsl(var(--foreground-muted));
}

.vt-card-body {
  padding: var(--spacing-6);
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-card-body > * + * {
  margin-top: var(--spacing-3);
}

.vt-card-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--spacing-2);
  padding: var(--spacing-4) var(--spacing-6);
  border-top: var(--border-width-thin) solid hsl(var(--border-default));
}

.vt-card-sm .vt-card-header {
  padding: var(--spacing-3) var(--spacing-4);
}

.vt-card-sm .vt-card-body {
  padding: var(--spacing-4);
}

.vt-card-sm .vt-card-footer {
  padding: var(--spacing-3) var(--spacing-4);
}

.vt-card-close {
  position: absolute;
  top: var(--spacing-4);
  inset-inline-end: var(--spacing-4);
}

.vt-card-header:has(> .vt-card-close) {
  padding-inline-end: var(--spacing-14);
}

.vt-card-sm .vt-card-close {
  top: var(--spacing-2);
  inset-inline-end: var(--spacing-2);
}

.vt-card-sm .vt-card-header:has(> .vt-card-close) {
  padding-inline-end: var(--spacing-12);
}

.vt-card-interactive {
  display: block;
  cursor: pointer;
  transition: border-color var(--transition-fast);
}

.vt-card-interactive:hover {
  border-color: hsl(var(--brand-fill));
}

:where(.vt-card) h3 {
  margin: 0 0 var(--spacing-1);
}

:where(.vt-card) h3 + p {
  margin: 0;
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  color: hsl(var(--foreground-muted));
}
/* Auto-generated by scripts/build-component-css.mjs from components/statscard.json. Do not edit manually. */

/* ── StatsCard ────────────────────────────────────────── */

.vt-stats-card {
  --stats-card-trend: hsl(var(--success-text));
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
  padding: var(--spacing-6);
}

/* ── StatsCard · size ── */

.vt-stats-card-sm {
  gap: var(--spacing-1);
  padding: var(--spacing-4);
}

/* ── StatsCard · trend ── */

.vt-stats-card-down {
  --stats-card-trend: hsl(var(--error-text));
}

.vt-stats-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--spacing-4);
}

.vt-stats-card-content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
  flex: 1;
  min-width: 0;
}

.vt-stats-card-label {
  margin: 0;
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  color: hsl(var(--foreground-muted));
}

.vt-stats-card-value {
  margin: 0;
  font-size: var(--type-heading-md-size);
  line-height: var(--type-heading-md-line-height);
  font-weight: var(--type-heading-md-weight);
  letter-spacing: var(--type-heading-md-tracking);
}

.vt-stats-card-sm .vt-stats-card-label {
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-stats-card-sm .vt-stats-card-value {
  font-size: var(--type-heading-sm-size);
  line-height: var(--type-heading-sm-line-height);
  font-weight: var(--type-heading-sm-weight);
  letter-spacing: var(--type-heading-sm-tracking);
}

.vt-stats-card-trend {
  display: flex;
  align-items: center;
  gap: var(--spacing-1);
}

.vt-stats-card-trend-icon {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  color: var(--stats-card-trend);
}

.vt-stats-card-delta {
  font-size: var(--type-label-sm-size);
  line-height: var(--type-label-sm-line-height);
  font-weight: var(--type-label-sm-weight);
  letter-spacing: var(--type-label-sm-tracking);
  color: var(--stats-card-trend);
}

.vt-stats-card-note {
  margin: 0;
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
  color: hsl(var(--foreground-muted));
}

.vt-stats-card-chart {
  display: block;
  width: 100%;
  height: var(--spacing-10);
  color: var(--stats-card-trend);
}
/* Auto-generated by scripts/build-component-css.mjs from components/pricingcard.json. Do not edit manually. */

/* ── PricingCard ────────────────────────────────────────── */

.vt-pricing-card {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-6);
  padding: var(--spacing-6);
}

/* ── PricingCard · style ── */

.vt-pricing-card-highlighted {
  border-color: hsl(var(--brand-fill));
  border-width: var(--border-width-medium);
}

.vt-pricing-card-header {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3);
}

.vt-pricing-card-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-2);
  min-height: var(--spacing-6);
}

.vt-pricing-card-name {
  margin: 0;
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
  color: hsl(var(--foreground-secondary));
}

.vt-pricing-card-highlighted .vt-pricing-card-name {
  color: hsl(var(--brand-fill));
}

.vt-pricing-card-price {
  display: flex;
  align-items: baseline;
  gap: var(--spacing-1);
}

.vt-pricing-card-amount {
  font-size: var(--type-heading-lg-size);
  line-height: var(--type-heading-lg-line-height);
  font-weight: var(--type-heading-lg-weight);
  letter-spacing: var(--type-heading-lg-tracking);
  color: hsl(var(--foreground-primary));
}

.vt-pricing-card-period {
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  color: hsl(var(--foreground-muted));
}

.vt-pricing-card-description {
  margin: 0;
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  color: hsl(var(--foreground-muted));
}

.vt-pricing-card-features {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3);
  flex: 1;
  margin: 0;
  padding: 0;
  list-style: none;
}
/* Auto-generated by scripts/build-component-css.mjs from components/testimonial.json. Do not edit manually. */

/* ── Testimonial ────────────────────────────────────────── */

.vt-testimonial {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  margin: 0;
  padding: var(--spacing-6);
}

/* ── Testimonial · style ── */

.vt-testimonial-featured {
  align-items: center;
  gap: var(--spacing-6);
  padding: var(--spacing-8) 0;
  text-align: center;
}

.vt-testimonial-mark {
  width: var(--spacing-8);
  height: var(--spacing-8);
  flex-shrink: 0;
  color: hsl(var(--foreground-muted) / .3);
}

.vt-testimonial-quote {
  margin: 0;
  font-size: var(--type-body-md-size);
  line-height: var(--type-body-md-line-height);
  font-weight: var(--type-body-md-weight);
  letter-spacing: var(--type-body-md-tracking);
  color: hsl(var(--foreground-primary));
}

.vt-testimonial-featured .vt-testimonial-quote {
  align-self: stretch;
  font-size: var(--type-body-lg-size);
  line-height: var(--type-body-lg-line-height);
  font-weight: var(--type-body-lg-weight);
  letter-spacing: var(--type-body-lg-tracking);
}

.vt-testimonial-author {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
}

.vt-testimonial-featured .vt-testimonial-author {
  flex-direction: column;
}

.vt-testimonial-info {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
}

.vt-testimonial-featured .vt-testimonial-info {
  align-items: center;
}

.vt-testimonial-name {
  font-style: normal;
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
  color: hsl(var(--foreground-primary));
}

.vt-testimonial-role {
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
  color: hsl(var(--foreground-muted));
}
/* Auto-generated by scripts/build-component-css.mjs from components/auth.json. Do not edit manually. */

/* ── Auth ────────────────────────────────────────── */

.vt-auth {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-6);
  width: 100%;
  max-width: var(--spacing-96);
}

.vt-auth-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-4);
  text-align: center;
}

.vt-auth-heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-1);
}

.vt-auth-title {
  margin: 0;
  font-size: var(--type-heading-md-size);
  line-height: var(--type-heading-md-line-height);
  font-weight: var(--type-heading-md-weight);
  letter-spacing: var(--type-heading-md-tracking);
}

.vt-auth-description {
  margin: 0;
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  color: hsl(var(--foreground-muted));
}

.vt-auth-card {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  padding: var(--spacing-6);
}

.vt-auth-social {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
}

.vt-auth-providers {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
}

.vt-auth-providers > .vt-btn {
  width: 100%;
  min-width: 0;
}

.vt-auth-options {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-3);
}

.vt-auth-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-1);
  margin: 0;
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  color: hsl(var(--foreground-muted));
}

.vt-auth-split {
  display: flex;
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-lg);
  background: hsl(var(--surface-page));
  overflow: hidden;
}

.vt-auth-aside {
  display: none;
  flex-direction: column;
  justify-content: flex-end;
  gap: var(--spacing-2);
  width: 40%;
  padding: var(--spacing-10);
  background: hsl(var(--surface-moderate));
}

.vt-auth-quote {
  margin: 0;
  font-size: var(--type-heading-sm-size);
  line-height: var(--type-heading-sm-line-height);
  font-weight: var(--type-heading-sm-weight);
  letter-spacing: var(--type-heading-sm-tracking);
}

.vt-auth-quote-author {
  margin: 0;
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  color: hsl(var(--foreground-secondary));
}

.vt-auth-split-main {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-8);
}

@media (min-width: 1024px) {
  .vt-auth-aside {
    display: flex;
  }
}
/* Auto-generated by scripts/build-component-css.mjs from components/onboardingflow.json. Do not edit manually. */

/* ── OnboardingFlow ────────────────────────────────────────── */

.vt-onboarding {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-8);
  width: 100%;
}

.vt-card-footer.vt-onboarding-actions {
  justify-content: space-between;
}
/* Auto-generated by scripts/build-component-css.mjs from components/alert.json. Do not edit manually. */

/* ── Alert ────────────────────────────────────────── */

.vt-alert {
  display: flex;
  gap: var(--spacing-3);
  border-radius: var(--radius-md);
  border: var(--border-width-default) solid hsl(var(--border-default));
  padding: var(--spacing-4);
  align-items: flex-start;
}

/* ── Alert · intent ── */

.vt-alert-info {
  background: hsl(var(--info-surface));
  border-color: hsl(var(--info-border));
  color: hsl(var(--info-text));
}

.vt-alert-success {
  background: hsl(var(--success-surface));
  border-color: hsl(var(--success-border));
  color: hsl(var(--success-text));
}

.vt-alert-warning {
  background: hsl(var(--warning-surface));
  border-color: hsl(var(--warning-border));
  color: hsl(var(--warning-text));
}

.vt-alert-danger {
  background: hsl(var(--error-surface));
  border-color: hsl(var(--error-border));
  color: hsl(var(--error-text));
}

.vt-alert-icon {
  width: var(--spacing-5);
  height: var(--spacing-5);
  flex-shrink: 0;
}

.vt-alert-content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
  flex: 1;
  min-width: 0;
}

.vt-alert-title {
  margin: 0;
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-alert-description {
  margin: 0;
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-alert-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-2);
  padding-top: var(--spacing-2);
}

.vt-alert-info .vt-alert-actions .vt-btn-primary {
  --btn-bg: hsl(var(--info-fill));
  --btn-bg-hover: hsl(var(--info-fill-hover));
  --btn-bg-active: hsl(var(--info-fill-pressed));
  --btn-fg: hsl(var(--on-info));
}

.vt-alert-success .vt-alert-actions .vt-btn-primary {
  --btn-bg: hsl(var(--success-fill));
  --btn-bg-hover: hsl(var(--success-fill-hover));
  --btn-bg-active: hsl(var(--success-fill-pressed));
  --btn-fg: hsl(var(--on-success));
}

.vt-alert-warning .vt-alert-actions .vt-btn-primary {
  --btn-bg: hsl(var(--warning-fill));
  --btn-bg-hover: hsl(var(--warning-fill-hover));
  --btn-bg-active: hsl(var(--warning-fill-pressed));
  --btn-fg: hsl(var(--on-warning));
}

.vt-alert-danger .vt-alert-actions .vt-btn-primary {
  --btn-bg: hsl(var(--error-fill));
  --btn-bg-hover: hsl(var(--error-fill-hover));
  --btn-bg-active: hsl(var(--error-fill-pressed));
  --btn-fg: hsl(var(--on-error));
}
/* Auto-generated by scripts/build-component-css.mjs from components/calendarweekday.json. Do not edit manually. */

/* ── CalendarWeekday ────────────────────────────────────────── */

.vt-calendar-weekday {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--control-height-sm);
  margin: 0 auto;
  padding: var(--spacing-1) 0;
  color: hsl(var(--foreground-muted));
  text-align: center;
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/calendar.json. Do not edit manually. */

/* ── Calendar ────────────────────────────────────────── */

.vt-calendar, .vt-date-picker {
  display: inline-flex;
  flex-direction: column;
  gap: var(--spacing-2);
  padding: var(--spacing-3);
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-lg);
  background: hsl(var(--surface-card));
  color: hsl(var(--foreground-primary));
}

.vt-calendar-header, .vt-date-picker-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-2);
}

.vt-calendar-title, .vt-date-picker-title {
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-calendar-weekdays, .vt-calendar-week, .vt-date-picker-weekdays, .vt-date-picker-week {
  display: flex;
  align-items: center;
}

.vt-calendar-days, .vt-date-picker-days {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-0_5);
}

.vt-calendar-caption, .vt-date-picker-caption {
  margin: 0;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-calendar-cell {
  position: relative;
  display: flex;
  justify-content: center;
  margin: 0 auto;
}

.vt-calendar-dot {
  position: absolute;
  bottom: var(--spacing-1);
  inset-inline-start: 50%;
  width: var(--spacing-1);
  height: var(--spacing-1);
  border-radius: var(--radius-full);
  background: hsl(var(--brand-fill));
  transform: translateX(-50%);
  pointer-events: none;
}

.vt-calendar-dot-warning {
  background: hsl(var(--warning-fill));
}

.vt-calendar-dot-error {
  background: hsl(var(--error-fill));
}

.vt-calendar-sm {
  padding: var(--spacing-2);
}

.vt-calendar-sm .vt-calendar-day, .vt-calendar-sm .vt-calendar-weekday {
  width: var(--spacing-7);
}

.vt-calendar-sm .vt-calendar-day {
  height: var(--spacing-7);
}

.vt-date-picker-field {
  position: relative;
}

.vt-date-picker-floating {
  position: absolute;
  top: 100%;
  inset-inline-start: 0;
  z-index: 50;
  margin-top: var(--spacing-2);
  box-shadow: var(--shadow-lg);
}

.vt-date-picker-trigger {
  align-items: center;
  gap: var(--spacing-2);
  text-align: start;
  cursor: pointer;
}

.vt-date-picker-trigger > svg {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  color: hsl(var(--foreground-muted));
}

.vt-date-picker-placeholder {
  color: hsl(var(--foreground-muted));
}

.vt-date-picker-presets {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-2);
}
/* Auto-generated by scripts/build-component-css.mjs from components/buttongroup.json. Do not edit manually. */

/* ── ButtonGroup ────────────────────────────────────────── */

.vt-btn-group {
  display: inline-flex;
  isolation: isolate;
}

/* ── ButtonGroup · size ── */

.vt-btn-group-sm {
  --btn-group-radius: var(--radius-sm);
}

.vt-btn-group-lg {
  --btn-group-radius: var(--radius-lg);
}

.vt-btn-group-xl {
  --btn-group-radius: var(--radius-xl);
}

.vt-btn-group-inverted, .vt-btn-group-vertical {
  display: inline-flex;
  isolation: isolate;
}

.vt-btn-group-vertical {
  flex-direction: column;
}

.vt-btn-group > button:not(.vt-btn), .vt-btn-group > a:not(.vt-btn), .vt-btn-group-inverted > button:not(.vt-btn), .vt-btn-group-inverted > a:not(.vt-btn), .vt-btn-group-vertical > button:not(.vt-btn), .vt-btn-group-vertical > a:not(.vt-btn) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-2);
  height: var(--control-height-md);
  padding: 0 var(--spacing-4);
  font-size: var(--type-label-md-size);
  font-weight: var(--type-label-md-weight);
  line-height: var(--type-label-md-line-height);
  letter-spacing: var(--type-label-md-tracking);
  white-space: nowrap;
  cursor: pointer;
  background: hsl(var(--neutral-fill));
  color: hsl(var(--on-neutral));
  border: var(--border-width-default) solid hsl(var(--border-default));
  border-radius: var(--btn-group-radius, var(--radius-md));
  box-shadow: var(--shadow-control-bordered);
  transition: background-color var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.vt-btn-group > button:not(.vt-btn):hover, .vt-btn-group > a:not(.vt-btn):hover, .vt-btn-group-inverted > button:not(.vt-btn):hover, .vt-btn-group-inverted > a:not(.vt-btn):hover, .vt-btn-group-vertical > button:not(.vt-btn):hover, .vt-btn-group-vertical > a:not(.vt-btn):hover {
  background: hsl(var(--neutral-fill-hover));
}

.vt-btn-group > button:not(.vt-btn):active, .vt-btn-group > a:not(.vt-btn):active, .vt-btn-group-inverted > button:not(.vt-btn):active, .vt-btn-group-inverted > a:not(.vt-btn):active, .vt-btn-group-vertical > button:not(.vt-btn):active, .vt-btn-group-vertical > a:not(.vt-btn):active {
  background: hsl(var(--neutral-fill-pressed));
}

.vt-btn-group > button:not(.vt-btn):focus-visible, .vt-btn-group > a:not(.vt-btn):focus-visible, .vt-btn-group-inverted > button:not(.vt-btn):focus-visible, .vt-btn-group-inverted > a:not(.vt-btn):focus-visible, .vt-btn-group-vertical > button:not(.vt-btn):focus-visible, .vt-btn-group-vertical > a:not(.vt-btn):focus-visible {
  outline: none;
  box-shadow: var(--shadow-control-bordered), 0 0 0 var(--focus-ring-width) hsl(var(--focus-ring) / 0.25);
}

.vt-btn-group > button:not(.vt-btn).vt-active, .vt-btn-group > a:not(.vt-btn).vt-active {
  background: hsl(var(--brand-fill));
  color: hsl(var(--on-brand));
  border-color: hsl(var(--brand-fill));
}

.vt-btn-group-vertical > button:not(.vt-btn), .vt-btn-group-vertical > a:not(.vt-btn) {
  justify-content: flex-start;
}

.vt-btn-group-vertical > button:not(.vt-btn).vt-active, .vt-btn-group-vertical > a:not(.vt-btn).vt-active {
  background: hsl(var(--surface-subtle));
}

.vt-btn-group-inverted > button:not(.vt-btn), .vt-btn-group-inverted > a:not(.vt-btn) {
  background: hsl(var(--brand-fill));
  color: hsl(var(--on-brand));
  border-color: transparent;
  box-shadow: var(--shadow-control);
}

.vt-btn-group-inverted > button:not(.vt-btn):hover, .vt-btn-group-inverted > a:not(.vt-btn):hover {
  background: hsl(var(--brand-fill-hover));
}

.vt-btn-group-inverted > button:not(.vt-btn):active, .vt-btn-group-inverted > a:not(.vt-btn):active {
  background: hsl(var(--brand-fill-pressed));
}

.vt-btn-group-sm > button:not(.vt-btn), .vt-btn-group-sm > a:not(.vt-btn) {
  height: var(--control-height-sm);
  padding: 0 var(--spacing-3);
  font-size: var(--type-label-sm-size);
  line-height: var(--type-label-sm-line-height);
  font-weight: var(--type-label-sm-weight);
  letter-spacing: var(--type-label-sm-tracking);
}

.vt-btn-group-lg > button:not(.vt-btn), .vt-btn-group-lg > a:not(.vt-btn) {
  height: var(--control-height-lg);
  padding: 0 var(--spacing-6);
}

.vt-btn-group-xl > button:not(.vt-btn), .vt-btn-group-xl > a:not(.vt-btn) {
  height: var(--control-height-xl);
  padding: 0 var(--spacing-6);
  font-size: var(--type-label-lg-size);
  line-height: var(--type-label-lg-line-height);
  font-weight: var(--type-label-lg-weight);
  letter-spacing: var(--type-label-lg-tracking);
}

.vt-btn-group-sm > .vt-btn {
  --btn-height: var(--control-height-sm);
  --btn-padding-x: var(--control-padding-x-sm);
  --btn-padding-y: var(--control-padding-y-sm);
  --btn-font-size: var(--type-label-sm-size);
  --btn-font-weight: var(--type-label-sm-weight);
  --btn-line-height: var(--type-label-sm-line-height);
  --btn-tracking: var(--type-label-sm-tracking);
  --btn-shadow-depth: calc(1 * var(--border-width-thin));
  --btn-radius: var(--radius-sm);
}

.vt-btn-group-lg > .vt-btn {
  --btn-height: var(--control-height-lg);
  --btn-padding-x: var(--control-padding-x-lg);
  --btn-padding-y: var(--control-padding-y-lg);
  --btn-font-weight: var(--type-label-lg-weight);
  --btn-line-height: var(--type-label-lg-line-height);
  --btn-tracking: var(--type-label-lg-tracking);
  --btn-shadow-depth: calc(3 * var(--border-width-thin));
  --btn-radius: var(--radius-lg);
}

.vt-btn-group-xl > .vt-btn {
  --btn-height: var(--control-height-xl);
  --btn-font-size: var(--type-label-lg-size);
  --btn-padding-x: var(--control-padding-x-xl);
  --btn-padding-y: var(--control-padding-y-xl);
  --btn-font-weight: var(--type-label-lg-weight);
  --btn-line-height: var(--type-label-lg-line-height);
  --btn-tracking: var(--type-label-lg-tracking);
  --btn-shadow-depth: calc(4 * var(--border-width-thin));
  --btn-radius: var(--radius-xl);
}

.vt-btn-group-sm > .vt-btn-icon, .vt-btn-group-lg > .vt-btn-icon, .vt-btn-group-xl > .vt-btn-icon {
  --btn-padding-x: 0;
}

.vt-btn-group > .vt-btn.vt-active, .vt-btn-group-vertical > .vt-btn.vt-active {
  --btn-bg: hsl(var(--brand-fill));
  --btn-bg-hover: hsl(var(--brand-fill-hover));
  --btn-bg-active: hsl(var(--brand-fill-pressed));
  --btn-fg: hsl(var(--on-brand));
  --btn-border: var(--border-width-default) solid hsl(var(--brand-fill));
  --btn-edge-color: var(--shadow-inset-edge-color, transparent);
  --btn-shadow: var(--shadow-control);
  --btn-shadow-active: var(--shadow-control-pressed);
}

.vt-btn-group > .vt-btn:not(:first-child), .vt-btn-group > button:not(.vt-btn):not(:first-child), .vt-btn-group > a:not(.vt-btn):not(:first-child), .vt-btn-group-inverted > .vt-btn:not(:first-child), .vt-btn-group-inverted > button:not(.vt-btn):not(:first-child), .vt-btn-group-inverted > a:not(.vt-btn):not(:first-child) {
  border-start-start-radius: 0;
  border-end-start-radius: 0;
}

.vt-btn-group > .vt-btn:not(:last-child), .vt-btn-group > button:not(.vt-btn):not(:last-child), .vt-btn-group > a:not(.vt-btn):not(:last-child), .vt-btn-group-inverted > .vt-btn:not(:last-child), .vt-btn-group-inverted > button:not(.vt-btn):not(:last-child), .vt-btn-group-inverted > a:not(.vt-btn):not(:last-child) {
  border-start-end-radius: 0;
  border-end-end-radius: 0;
}

.vt-btn-group-vertical > .vt-btn:not(:first-child), .vt-btn-group-vertical > button:not(.vt-btn):not(:first-child), .vt-btn-group-vertical > a:not(.vt-btn):not(:first-child) {
  border-start-start-radius: 0;
  border-start-end-radius: 0;
}

.vt-btn-group-vertical > .vt-btn:not(:last-child), .vt-btn-group-vertical > button:not(.vt-btn):not(:last-child), .vt-btn-group-vertical > a:not(.vt-btn):not(:last-child) {
  border-end-start-radius: 0;
  border-end-end-radius: 0;
}

.vt-btn-group > * + *, .vt-btn-group-inverted > * + * {
  margin-inline-start: calc(-1 * var(--border-width-default));
}

.vt-btn-group-vertical > * + * {
  margin-block-start: calc(-1 * var(--border-width-default));
}

.vt-btn-group-inverted > * + .vt-btn, .vt-btn-group-inverted > * + button:not(.vt-btn), .vt-btn-group-inverted > * + a:not(.vt-btn) {
  border-inline-start: calc(var(--border-width-default) * (1 - var(--shadow-control-on, 0))) solid hsl(var(--generic-white) / 0.2);
}

html.dark .vt-btn-group > .vt-btn-secondary:not(.vt-active), html.dark .vt-btn-group-vertical > .vt-btn-secondary:not(.vt-active) {
  --btn-border: var(--border-width-default) solid hsl(var(--border-strong));
}

html.dark .vt-btn-group > button:not(.vt-btn):not(.vt-active), html.dark .vt-btn-group > a:not(.vt-btn):not(.vt-active), html.dark .vt-btn-group-vertical > button:not(.vt-btn):not(.vt-active), html.dark .vt-btn-group-vertical > a:not(.vt-btn):not(.vt-active) {
  border-color: hsl(var(--border-strong));
}

.vt-btn-group > *:hover, .vt-btn-group > *:active, .vt-btn-group > *.vt-active, .vt-btn-group-inverted > *:hover, .vt-btn-group-inverted > *:active, .vt-btn-group-inverted > *.vt-active, .vt-btn-group-vertical > *:hover, .vt-btn-group-vertical > *:active, .vt-btn-group-vertical > *.vt-active {
  position: relative;
  z-index: 1;
}

.vt-btn-group > *:focus-visible, .vt-btn-group-inverted > *:focus-visible, .vt-btn-group-vertical > *:focus-visible {
  position: relative;
  z-index: 2;
}
/* Auto-generated by scripts/build-component-css.mjs from components/dialog.json. Do not edit manually. */

@keyframes dialogIn {
  from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); }
}

/* ── Dialog ────────────────────────────────────────── */

.vt-dialog {
  display: flex;
  flex-direction: column;
  background: hsl(var(--surface-card));
  border: var(--border-width-default) solid hsl(var(--border-default));
  border-radius: var(--radius-2xl);
  max-width: var(--container-dialog);
  width: 100%;
  max-height: calc(100dvh - var(--spacing-8));
  overflow-y: auto;
  color: hsl(var(--foreground-primary));
  box-shadow: var(--shadow-xl);
  animation: dialogIn var(--transition-fast);
}

.vt-dialog-overlay {
  position: fixed;
  inset: 0;
  background: hsl(var(--generic-1000) / 0.5);
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-4);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease-out, visibility 0s 0.2s;
}

.vt-dialog-overlay.vt-open {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.2s ease-out, visibility 0s;
}

.vt-dialog-overlay .vt-dialog {
  transform: scale(0.95);
  opacity: 0;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease-out;
}

.vt-dialog-overlay.vt-open .vt-dialog {
  transform: scale(1);
  opacity: 1;
}

.vt-dialog-header {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-4);
  padding: var(--spacing-6);
}

.vt-dialog-heading {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1_5);
  flex: 1;
  min-width: 0;
}

.vt-dialog-title {
  margin: 0;
  font-size: var(--type-heading-sm-size);
  line-height: var(--type-heading-sm-line-height);
  font-weight: var(--type-heading-sm-weight);
  letter-spacing: var(--type-heading-sm-tracking);
}

.vt-dialog-description {
  margin: 0;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-dialog-icon {
  color: hsl(var(--brand-fill));
  background: hsl(var(--brand-fill) / 0.1);
}

.vt-dialog-icon > svg {
  width: var(--spacing-5);
  height: var(--spacing-5);
}

.vt-dialog-icon-info {
  color: hsl(var(--info-fill));
  background: hsl(var(--info-fill) / 0.1);
}

.vt-dialog-icon-success {
  color: hsl(var(--success-fill));
  background: hsl(var(--success-fill) / 0.1);
}

.vt-dialog-icon-warning {
  color: hsl(var(--warning-fill));
  background: hsl(var(--warning-fill) / 0.1);
}

.vt-dialog-icon-danger {
  color: hsl(var(--error-fill));
  background: hsl(var(--error-fill) / 0.1);
}

.vt-dialog-body {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  padding: 0 var(--spacing-6) var(--spacing-6);
}

.vt-dialog-footer {
  display: flex;
  justify-content: flex-end;
  gap: var(--spacing-2);
  padding: 0 var(--spacing-6) var(--spacing-6);
}

.vt-dialog-success .vt-dialog-footer .vt-btn-primary {
  --btn-bg: hsl(var(--success-fill));
  --btn-bg-hover: hsl(var(--success-fill-hover));
  --btn-bg-active: hsl(var(--success-fill-pressed));
  --btn-fg: hsl(var(--on-success));
}

.vt-dialog-warning .vt-dialog-footer .vt-btn-primary {
  --btn-bg: hsl(var(--warning-fill));
  --btn-bg-hover: hsl(var(--warning-fill-hover));
  --btn-bg-active: hsl(var(--warning-fill-pressed));
  --btn-fg: hsl(var(--on-warning));
}

.vt-dialog-centered .vt-dialog-header {
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.vt-dialog-centered .vt-dialog-heading {
  align-self: stretch;
}

.vt-dialog-centered .vt-dialog-footer > .vt-btn {
  flex: 1;
}

.vt-dialog-centered .vt-dialog-footer {
  justify-content: center;
}

.dialog-overlay {
  position: fixed;
  inset: 0;
  background: hsl(var(--generic-1000) / 0.5);
  z-index: 50;
  display: none;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-4);
}

.dialog-overlay.open {
  display: flex;
}

.dialog-content {
  background: hsl(var(--surface-page));
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-3xl);
  max-width: var(--container-dialog);
  width: 100%;
  box-shadow: var(--shadow-xl);
  animation: dialogIn var(--transition-fast);
}
/* Auto-generated by scripts/build-component-css.mjs from components/popover.json. Do not edit manually. */

@keyframes popFadeIn {
  from { opacity: 0; } to { opacity: 1; }
}

/* ── Popover ────────────────────────────────────────── */

.vt-popover-content {
  position: absolute;
  z-index: 50;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3);
  width: var(--spacing-72);
  padding: var(--spacing-4);
  background: hsl(var(--surface-card));
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  color: hsl(var(--foreground-primary));
  opacity: 0;
  visibility: hidden;
  will-change: transform, opacity;
  transition: opacity var(--transition-fast), transform var(--transition-fast), visibility 0s 150ms;
}

.vt-popover-content.vt-open {
  opacity: 1;
  visibility: visible;
  transition: opacity var(--transition-fast), transform var(--transition-fast), visibility 0s;
}

.vt-popover-wrap, .popover-wrapper {
  position: relative;
  display: inline-block;
  width: fit-content;
}

.vt-popover-header {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
}

.vt-popover-title {
  margin: 0;
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-popover-description {
  margin: 0;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-popover-footer {
  display: flex;
  justify-content: flex-end;
  gap: var(--spacing-2);
}

.vt-popover-top {
  bottom: 100%;
  inset-inline-start: 50%;
  margin-bottom: var(--spacing-2);
  transform: translate(-50%, var(--spacing-2));
}

.vt-popover-top.vt-open {
  transform: translate(-50%, 0);
}

.vt-popover-bottom {
  top: 100%;
  inset-inline-start: 50%;
  margin-top: var(--spacing-2);
  transform: translate(-50%, calc(-1 * var(--spacing-2)));
}

.vt-popover-bottom.vt-open {
  transform: translate(-50%, 0);
}

.vt-popover-left {
  inset-inline-end: 100%;
  top: 50%;
  margin-inline-end: var(--spacing-2);
  transform: translate(var(--spacing-2), -50%);
}

.vt-popover-left.vt-open {
  transform: translate(0, -50%);
}

.vt-popover-right {
  inset-inline-start: 100%;
  top: 50%;
  margin-inline-start: var(--spacing-2);
  transform: translate(calc(-1 * var(--spacing-2)), -50%);
}

.vt-popover-right.vt-open {
  transform: translate(0, -50%);
}

.vt-popover-bottom-start {
  top: 100%;
  inset-inline-start: 0;
  margin-top: var(--spacing-2);
  transform: translateY(calc(-1 * var(--spacing-2)));
}

.vt-popover-bottom-start.vt-open {
  transform: translateY(0);
}

.vt-popover-content.vt-popover-static {
  position: static;
  opacity: 1;
  visibility: visible;
  transform: none;
  margin: 0;
}

.popover-content {
  display: none;
  position: absolute;
  z-index: 50;
  background: hsl(var(--surface-card));
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
}

.popover-content.open {
  display: block;
  animation: popFadeIn var(--transition-fast);
}

.popover-bottom {
  top: 100%;
  inset-inline-start: 50%;
  transform: translateX(-50%);
  margin-top: var(--spacing-2);
}

.popover-top {
  bottom: 100%;
  inset-inline-start: 50%;
  transform: translateX(-50%);
  margin-bottom: var(--spacing-2);
}

.popover-right {
  inset-inline-start: 100%;
  top: 50%;
  transform: translateY(-50%);
  margin-inline-start: var(--spacing-2);
}

.popover-left {
  inset-inline-end: 100%;
  top: 50%;
  transform: translateY(-50%);
  margin-inline-end: var(--spacing-2);
}

.popover-bottom-start {
  top: 100%;
  inset-inline-start: 0;
  margin-top: var(--spacing-2);
}

.popover-bottom-end {
  top: 100%;
  inset-inline-end: 0;
  margin-top: var(--spacing-2);
}
/* Auto-generated by scripts/build-component-css.mjs from components/accordionitem.json. Do not edit manually. */

/* ── AccordionItem ────────────────────────────────────────── */

[data-accordion-trigger] {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  padding: var(--spacing-4) 0;
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: var(--type-body-sm-size);
  font-weight: var(--type-body-sm-weight);
  text-align: start;
  color: hsl(var(--foreground-primary));
  transition: all var(--transition-fast);
  line-height: var(--type-body-sm-line-height);
  letter-spacing: var(--type-body-sm-tracking);
}

[data-accordion-content] {
  max-height: 0;
  overflow: hidden;
  transition: max-height var(--transition-slow), padding-bottom var(--transition-slow);
  padding-bottom: 0;
  font-size: var(--type-body-sm-size);
  color: hsl(var(--foreground-secondary));
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

[data-accordion-content].open {
  padding-bottom: var(--spacing-4);
}

[data-accordion-item] {
  display: flex;
  flex-direction: column;
  border-bottom: var(--border-width-thin) solid hsl(var(--border-default));
  transition: border-color var(--transition-fast);
}

[data-accordion-item]:hover {
  border-bottom-color: hsl(var(--border-strong));
}

[data-accordion-icon] {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  transition: transform var(--transition-normal);
  color: hsl(var(--foreground-muted));
}

[data-accordion-trigger][aria-expanded="true"] [data-accordion-icon] {
  transform: rotate(180deg);
}

[data-accordion-variant="bordered"] [data-accordion-item] {
  border-top: var(--border-width-default) solid hsl(var(--border-default));
  border-inline-end: var(--border-width-default) solid hsl(var(--border-default));
  border-bottom: var(--border-width-default) solid hsl(var(--border-default));
  border-inline-start: var(--border-width-default) solid hsl(var(--border-default));
  border-radius: var(--radius-2xl);
}

[data-accordion-variant="bordered"] [data-accordion-trigger] {
  padding: var(--spacing-4);
  border-radius: var(--radius-2xl);
}

[data-accordion-variant="bordered"] [data-accordion-trigger]:hover {
  background: hsl(var(--surface-subtle) / 0.5);
}

[data-accordion-variant="bordered"] [data-accordion-content] {
  padding-inline-start: var(--spacing-4);
  padding-inline-end: var(--spacing-4);
}

[data-accordion-variant="bordered"] [data-accordion-content].open {
  padding-bottom: var(--spacing-4);
}

.vt-accordion-label {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
}

.vt-accordion-label > svg {
  width: var(--spacing-5);
  height: var(--spacing-5);
  flex-shrink: 0;
  color: hsl(var(--foreground-muted));
}

[data-accordion-content].vt-accordion-inset {
  padding-inline-start: var(--spacing-8);
}
/* Auto-generated by scripts/build-component-css.mjs from components/accordion.json. Do not edit manually. */

/* ── Accordion ────────────────────────────────────────── */

[data-accordion] {
  display: flex;
  flex-direction: column;
  width: 100%;
}

[data-accordion-shift] [data-accordion-trigger] {
  transition: padding-left var(--transition-fast);
}

[data-accordion-shift] [data-accordion-item]:hover [data-accordion-trigger] {
  padding-inline-start: var(--spacing-2);
}

[data-accordion-variant="bordered"] {
  gap: var(--spacing-3);
}
/* Auto-generated by scripts/build-component-css.mjs from components/collapsible.json. Do not edit manually. */

/* ── Collapsible ────────────────────────────────────────── */

.vt-collapsible {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
  color: hsl(var(--foreground-primary));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-collapsible-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-4);
}

.vt-collapsible-title {
  margin: 0;
  color: hsl(var(--foreground-primary));
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-collapsible-content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
  color: hsl(var(--foreground-secondary));
}

.vt-collapsible-content .vt-collapsible-content {
  padding-inline-start: var(--spacing-4);
}

[data-collapsible-animated] > .vt-collapsible-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height var(--transition-slow);
}

.vt-collapsible > [data-collapsible-trigger] {
  align-self: flex-start;
}

.vt-collapsible-item {
  display: flex;
  align-items: center;
  padding: var(--spacing-2) var(--spacing-4);
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-md);
  color: hsl(var(--foreground-primary));
  font-family: var(--font-family-mono, monospace);
  font-size: var(--type-code-md-size);
  line-height: var(--type-code-md-line-height);
  font-weight: var(--type-code-md-weight);
  letter-spacing: var(--type-code-md-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/slider.json. Do not edit manually. */

/* ── Slider ────────────────────────────────────────── */

input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: var(--spacing-2);
  border-radius: var(--radius-full);
  background: linear-gradient(to right, hsl(var(--brand-fill)) 0%, hsl(var(--brand-fill)) var(--slider-progress, 50%), hsl(var(--surface-subtle)) var(--slider-progress, 50%), hsl(var(--surface-subtle)) 100%);
  outline: none;
  cursor: pointer;
}

input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: var(--spacing-5);
  height: var(--spacing-5);
  border-radius: var(--radius-full);
  background: hsl(var(--brand-fill));
  border: var(--border-width-thick) solid hsl(var(--surface-page));
  box-shadow: var(--shadow-default);
  cursor: pointer;
  transition: transform 0.1s;
}

input[type="range"]::-moz-range-thumb {
  width: var(--spacing-5);
  height: var(--spacing-5);
  border-radius: var(--radius-full);
  background: hsl(var(--brand-fill));
  border: var(--border-width-thick) solid hsl(var(--surface-page));
  box-shadow: var(--shadow-default);
  cursor: pointer;
  transition: transform 0.1s;
}

input[type="range"]::-webkit-slider-thumb:hover {
  transform: scale(1.1);
}

input[type="range"]::-webkit-slider-thumb:active {
  transform: scale(1.15);
}

input[type="range"]:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

input[type="range"]:disabled::-webkit-slider-thumb {
  cursor: not-allowed;
}
/* Auto-generated by scripts/build-component-css.mjs from components/minicontrols.json. Do not edit manually. */

/* ── MiniControls ────────────────────────────────────────── */

.vt-switch-mini {
  position: relative;
  width: calc(2 * var(--spacing-4) + 2 * var(--spacing-0_5));
  height: var(--spacing-5);
  border-radius: var(--radius-full);
  background: hsl(var(--border-strong));
  cursor: pointer;
  transition: background-color var(--transition-normal);
  flex-shrink: 0;
}

.vt-switch-mini.vt-active {
  background: hsl(var(--brand-fill));
}

.vt-switch-mini .thumb {
  position: absolute;
  top: var(--spacing-0_5);
  inset-inline-start: var(--spacing-0_5);
  width: var(--spacing-4);
  height: var(--spacing-4);
  border-radius: var(--radius-full);
  background: hsl(var(--surface-page));
  transition: transform var(--transition-normal);
  box-shadow: 0 var(--border-width-thin) var(--spacing-0_5) hsl(var(--generic-1000) / 0.2);
}

.vt-switch-mini.vt-active .thumb {
  transform: translateX(var(--spacing-4));
}

.vt-checkbox-mini {
  width: calc(var(--spacing-3) + var(--spacing-0_5));
  height: calc(var(--spacing-3) + var(--spacing-0_5));
  border-radius: var(--radius-sm);
  border: var(--border-width-default) solid hsl(var(--brand-fill));
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: hsl(var(--brand-fill));
}

.vt-radio-mini {
  width: calc(var(--spacing-3) + var(--spacing-0_5));
  height: calc(var(--spacing-3) + var(--spacing-0_5));
  border-radius: 50%;
  border: var(--border-width-default) solid hsl(var(--brand-fill));
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.vt-radio-mini .dot {
  width: calc((var(--spacing-3) + var(--spacing-0_5)) / 2);
  height: calc((var(--spacing-3) + var(--spacing-0_5)) / 2);
  border-radius: 50%;
  background: hsl(var(--brand-fill));
}
/* Auto-generated by scripts/build-component-css.mjs from components/typography.json. Do not edit manually. */

/* ── Typography ────────────────────────────────────────── */

.vt-display {
  font-size: var(--type-heading-lg-size, 2rem);
  line-height: var(--type-heading-lg-line-height, 2.5rem);
  font-weight: var(--type-heading-lg-weight, 600);
  letter-spacing: var(--type-heading-lg-tracking, 0em);
}

.vt-body-sm {
  font-size: var(--type-body-sm-size, 0.875rem);
  line-height: var(--type-body-sm-line-height, 1.25rem);
  font-weight: var(--type-body-sm-weight, 400);
  letter-spacing: var(--type-body-sm-tracking, 0em);
}

.vt-body {
  font-size: var(--type-body-md-size, 1rem);
  line-height: var(--type-body-md-line-height, 1.5rem);
  font-weight: var(--type-body-md-weight, 400);
  letter-spacing: var(--type-body-md-tracking, 0em);
}

.vt-body-lg {
  font-size: var(--type-body-lg-size, 1.125rem);
  line-height: var(--type-body-lg-line-height, 1.75rem);
  font-weight: var(--type-body-lg-weight, 400);
  letter-spacing: var(--type-body-lg-tracking, 0em);
}

.vt-label-sm, .vt-label-xs {
  font-size: var(--type-label-sm-size, 0.75rem);
  line-height: var(--type-label-sm-line-height, 1rem);
  font-weight: var(--type-label-sm-weight, 500);
  letter-spacing: var(--type-label-sm-tracking, 0em);
}

.vt-label-md {
  font-size: var(--type-label-md-size, 0.875rem);
  line-height: var(--type-label-md-line-height, 1.25rem);
  font-weight: var(--type-label-md-weight, 500);
  letter-spacing: var(--type-label-md-tracking, 0em);
}

.vt-label-lg, .vt-h6 {
  font-size: var(--type-label-lg-size, 1rem);
  line-height: var(--type-label-lg-line-height, 1.5rem);
  font-weight: var(--type-label-lg-weight, 500);
  letter-spacing: var(--type-label-lg-tracking, 0em);
}

.vt-caption {
  font-size: var(--type-caption-size, 0.75rem);
  line-height: var(--type-caption-line-height, 1rem);
  font-weight: var(--type-caption-weight, 400);
  letter-spacing: var(--type-caption-tracking, 0em);
}

.vt-overline {
  font-size: var(--type-overline-size, 0.75rem);
  line-height: var(--type-overline-line-height, 1rem);
  font-weight: var(--type-overline-weight, 400);
  letter-spacing: var(--type-overline-tracking, 0em);
  text-transform: uppercase;
}

.vt-heading-sm, .vt-h4, .vt-h5 {
  font-size: var(--type-heading-sm-size, 1.25rem);
  line-height: var(--type-heading-sm-line-height, 1.75rem);
  font-weight: var(--type-heading-sm-weight, 600);
  letter-spacing: var(--type-heading-sm-tracking, 0em);
}

.vt-heading-md, .vt-h2, .vt-h3 {
  font-size: var(--type-heading-md-size, 1.5rem);
  line-height: var(--type-heading-md-line-height, 2rem);
  font-weight: var(--type-heading-md-weight, 600);
  letter-spacing: var(--type-heading-md-tracking, 0em);
}

.vt-heading-lg, .vt-h1, .vt-display {
  font-size: var(--type-heading-lg-size, 2rem);
  line-height: var(--type-heading-lg-line-height, 2.5rem);
  font-weight: var(--type-heading-lg-weight, 600);
  letter-spacing: var(--type-heading-lg-tracking, 0em);
}

.vt-code-sm {
  font-size: var(--type-code-sm-size, 0.75rem);
  line-height: var(--type-code-sm-line-height, 1rem);
  font-weight: var(--type-code-sm-weight, 400);
  letter-spacing: var(--type-code-sm-tracking, 0em);
  font-family: var(--font-family-mono, monospace);
}

.vt-code {
  font-size: var(--type-code-md-size, 0.875rem);
  line-height: var(--type-code-md-line-height, 1.25rem);
  font-weight: var(--type-code-md-weight, 400);
  letter-spacing: var(--type-code-md-tracking, 0em);
  font-family: var(--font-family-mono, monospace);
}

.vt-label {
  font-size: var(--type-body-sm-size, 0.875rem);
  line-height: var(--type-body-sm-line-height, 1.25rem);
  font-weight: var(--type-body-sm-weight, 400);
  letter-spacing: var(--type-body-sm-tracking, 0em);
  color: hsl(var(--foreground-primary));
}

.vt-label.vt-label-sm {
  font-size: var(--type-caption-size, 0.75rem);
  line-height: var(--type-caption-line-height, 1rem);
  font-weight: var(--type-caption-weight, 400);
  letter-spacing: var(--type-caption-tracking, 0em);
}

.vt-section-label {
  font-size: var(--type-overline-size, 0.75rem);
  line-height: var(--type-overline-line-height, 1rem);
  font-weight: var(--type-overline-weight, 400);
  letter-spacing: var(--type-overline-tracking, 0em);
  text-transform: uppercase;
  color: hsl(var(--foreground-muted));
}
/* Auto-generated by scripts/build-component-css.mjs from components/navitem.json. Do not edit manually. */

/* ── NavItem ────────────────────────────────────────── */

.vt-nav-item {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  padding: var(--spacing-2) var(--spacing-3);
  border: none;
  border-radius: var(--radius-md);
  background: transparent;
  color: hsl(var(--foreground-secondary));
  font-family: inherit;
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  text-align: start;
  text-decoration: none;
  cursor: pointer;
  transition: color var(--transition-fast), background-color var(--transition-fast);
}

button.vt-nav-item {
  width: 100%;
}

.vt-nav-item:hover {
  background: hsl(var(--surface-subtle));
  color: hsl(var(--foreground-primary));
}

.vt-nav-item.vt-active {
  background: hsl(var(--brand-fill) / 0.1);
  color: hsl(var(--brand-fill));
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-nav-item.vt-muted {
  color: hsl(var(--foreground-muted));
}

.vt-nav-item.vt-muted:hover {
  color: hsl(var(--foreground-primary));
}

.vt-nav-item-icon {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
}

.vt-nav-item > .vt-count-badge {
  margin-inline-start: auto;
  flex-shrink: 0;
}

.vt-nav-item-chevron {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  margin-inline-start: auto;
  color: hsl(var(--foreground-muted));
  transition: transform var(--transition-normal);
}

.vt-nav-item > .vt-count-badge ~ .vt-nav-item-chevron {
  margin-inline-start: 0;
}

.vt-nav-item-sm {
  gap: var(--spacing-2);
  padding: var(--spacing-1_5) var(--spacing-3);
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-nav-item-sm.vt-active {
  font-size: var(--type-label-sm-size);
  line-height: var(--type-label-sm-line-height);
  font-weight: var(--type-label-sm-weight);
  letter-spacing: var(--type-label-sm-tracking);
}

.vt-nav-item-compact {
  justify-content: center;
  gap: 0;
  padding: var(--spacing-3);
}

.vt-nav-item-sub {
  display: flex;
  align-items: center;
  padding: var(--spacing-1_5) var(--spacing-3);
  border-radius: var(--radius-md);
  color: hsl(var(--foreground-secondary));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  text-decoration: none;
  cursor: pointer;
  transition: color var(--transition-fast), background-color var(--transition-fast);
}

.vt-nav-item-sub:hover {
  background: hsl(var(--surface-subtle));
  color: hsl(var(--foreground-primary));
}

.vt-nav-item-sub.vt-active {
  background: hsl(var(--brand-fill) / 0.1);
  color: hsl(var(--brand-fill));
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-nav-item-sub.vt-muted {
  color: hsl(var(--foreground-muted));
}

.vt-nav-item-sub.vt-muted:hover {
  color: hsl(var(--foreground-primary));
}

.vt-nav-item.vt-active-neutral, .vt-nav-item-sub.vt-active-neutral {
  background: hsl(var(--surface-subtle));
  color: hsl(var(--foreground-primary));
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/sidebarnav.json. Do not edit manually. */

/* ── SidebarNav ────────────────────────────────────────── */

.vt-side-nav {
  display: flex;
  flex-direction: column;
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-2xl);
  background: hsl(var(--surface-card));
  overflow: hidden;
}

.vt-side-nav-header {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
  height: var(--spacing-16);
  flex-shrink: 0;
  padding: 0 var(--spacing-5);
  border-bottom: var(--border-width-thin) solid hsl(var(--border-default));
}

.vt-side-nav-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: var(--spacing-7);
  height: var(--spacing-7);
  border-radius: var(--radius-sm);
  background: hsl(var(--brand-fill));
  color: hsl(var(--on-brand));
  font-size: var(--type-label-sm-size);
  line-height: var(--type-label-sm-line-height);
  font-weight: var(--type-label-sm-weight);
  letter-spacing: var(--type-label-sm-tracking);
}

.vt-side-nav-title {
  color: hsl(var(--foreground-primary));
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-side-nav-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: var(--spacing-0_5);
  padding: var(--spacing-3);
  min-height: 0;
  overflow-y: auto;
}

.vt-side-nav-group {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-0_5);
}

.vt-side-nav-group + .vt-side-nav-group {
  padding-top: var(--spacing-4);
}

.vt-side-nav-group > .vt-section-label {
  display: flex;
  align-items: center;
  margin: 0;
  padding: var(--spacing-2) var(--spacing-3);
}

.vt-side-nav-section {
  display: flex;
  flex-direction: column;
}

.vt-side-nav-children {
  display: none;
  flex-direction: column;
  gap: var(--spacing-0_5);
  padding-top: var(--spacing-0_5);
  padding-inline-start: var(--spacing-10);
}

[data-sidebar-collapsible].open > .vt-side-nav-children {
  display: flex;
}

[data-sidebar-collapsible].open > .vt-nav-item > .vt-nav-item-chevron {
  transform: rotate(180deg);
}

.vt-side-nav-footer {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-0_5);
  padding: var(--spacing-3);
  border-top: var(--border-width-thin) solid hsl(var(--border-default));
}

.vt-side-nav-compact .vt-side-nav-header {
  justify-content: center;
  padding: 0 var(--spacing-3);
}

.vt-side-nav-compact .vt-side-nav-body, .vt-side-nav-compact .vt-side-nav-footer {
  align-items: center;
  gap: var(--spacing-1);
}
/* Auto-generated by scripts/build-component-css.mjs from components/pagelayout.json. Do not edit manually. */

/* ── PageLayout ────────────────────────────────────────── */

.vt-page-layout {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  background: hsl(var(--surface-page));
  color: hsl(var(--foreground-primary));
}

.vt-page-layout-screen {
  height: 100dvh;
}

.vt-page-layout-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-6);
  height: var(--spacing-16);
  flex-shrink: 0;
  padding: 0 var(--spacing-6);
  border-bottom: var(--border-width-thin) solid hsl(var(--border-default));
  background: hsl(var(--surface-card));
}

.vt-page-layout-brand {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
  color: hsl(var(--foreground-primary));
  font-size: var(--type-label-lg-size);
  line-height: var(--type-label-lg-line-height);
  font-weight: var(--type-label-lg-weight);
  letter-spacing: var(--type-label-lg-tracking);
}

.vt-page-layout-title {
  margin: 0;
  color: hsl(var(--foreground-primary));
  font-size: var(--type-label-lg-size);
  line-height: var(--type-label-lg-line-height);
  font-weight: var(--type-label-lg-weight);
  letter-spacing: var(--type-label-lg-tracking);
}

.vt-page-layout-nav {
  display: flex;
  align-items: center;
  gap: var(--spacing-6);
}

.vt-page-layout-actions {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
}

.vt-page-layout-body {
  display: flex;
  flex: 1;
  min-height: 0;
}

.vt-page-layout-body > .vt-page-layout-sidebar {
  width: var(--spacing-64);
  flex-shrink: 0;
  border: none;
  border-inline-end: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: 0;
  background: hsl(var(--surface-card));
  overflow-y: auto;
}

.vt-page-layout-body > .vt-page-layout-sidebar-wide {
  width: var(--spacing-80);
}

.vt-page-layout-content {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
}

.vt-page-layout-main {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  flex: 1;
  min-width: 0;
  min-height: 0;
  padding: var(--spacing-6);
  overflow-y: auto;
}

.vt-page-layout-main > * {
  flex-shrink: 0;
}

.vt-page-layout-aside {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2);
  width: var(--spacing-56);
  flex-shrink: 0;
  padding: var(--spacing-4);
  border-inline-start: var(--border-width-thin) solid hsl(var(--border-default));
  background: hsl(var(--surface-card));
  overflow-y: auto;
}

.vt-page-layout-aside > .vt-link {
  align-self: flex-start;
}

.vt-page-layout-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-4);
  flex-shrink: 0;
  padding: var(--spacing-4) var(--spacing-6);
  border-top: var(--border-width-thin) solid hsl(var(--border-default));
  background: hsl(var(--surface-card));
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-page-layout-contained > .vt-page-layout-header, .vt-page-layout-contained > .vt-page-layout-main, .vt-page-layout-contained > .vt-page-layout-footer {
  padding-inline: max(var(--spacing-6), (100% - var(--container-width)) / 2);
}
/* Auto-generated by scripts/build-component-css.mjs from components/combobox.json. Do not edit manually. */

/* ── Combobox ────────────────────────────────────────── */

.vt-combobox-wrapper {
  position: relative;
}

.vt-combobox-wrapper > .vt-dropdown-menu {
  width: 100%;
  margin-top: var(--spacing-1);
}

.vt-combobox-group {
  display: flex;
  flex-direction: column;
}

.vt-combobox-tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--spacing-1_5);
  min-height: var(--control-height-md);
  width: 100%;
  border-radius: var(--radius-md);
  border: var(--border-width-default) solid hsl(var(--border-strong));
  background: var(--input-bg, hsl(var(--surface-card)));
  padding: var(--spacing-2) var(--spacing-3);
  cursor: text;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.vt-combobox-tags:focus-within {
  border-color: hsl(var(--brand-fill));
  box-shadow: 0 0 0 var(--focus-ring-width) hsl(var(--brand-fill) / 0.15);
}

.vt-combobox-tag {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-1);
  border-radius: var(--radius-2xs);
  background: hsl(var(--surface-subtle));
  padding: var(--spacing-0_5) var(--spacing-2);
  color: hsl(var(--foreground-primary));
  font-size: var(--type-label-sm-size);
  line-height: var(--type-label-sm-line-height);
  font-weight: var(--type-label-sm-weight);
  letter-spacing: var(--type-label-sm-tracking);
}

.vt-combobox-tag-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  border-radius: var(--radius-2xs);
  background: transparent;
  color: inherit;
  cursor: pointer;
  transition: background var(--transition-fast);
}

.vt-combobox-tag-remove:hover {
  background: hsl(var(--surface-moderate));
}

.vt-combobox-tag-remove > svg {
  width: var(--spacing-3);
  height: var(--spacing-3);
}

.vt-combobox-tags-input {
  flex: 1;
  min-width: var(--spacing-10);
  border: none;
  outline: none;
  padding: 0;
  background: transparent;
  color: hsl(var(--foreground-primary));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-combobox-tags-input::placeholder {
  color: hsl(var(--foreground-muted));
}

.vt-combobox-trigger {
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-2);
  cursor: pointer;
  text-align: start;
}

.vt-combobox-trigger:hover {
  background: hsl(var(--surface-subtle));
}

.vt-combobox-trigger > svg {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  color: hsl(var(--foreground-muted));
}

.vt-combobox-button-label {
  color: hsl(var(--foreground-muted));
}

.vt-combobox-button-label.vt-selected {
  color: hsl(var(--foreground-primary));
}

.vt-combobox-empty {
  padding: var(--spacing-4) 0;
  text-align: center;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-combobox-item {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
  padding: var(--spacing-1_5) var(--spacing-2);
  border-radius: calc(var(--radius-lg) - var(--spacing-1));
  color: hsl(var(--foreground-primary));
  cursor: pointer;
  user-select: none;
  transition: background var(--transition-fast);
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-combobox-item:hover, .vt-combobox-item.vt-selected {
  background: hsl(var(--surface-subtle));
}

.vt-combobox-item[aria-disabled="true"] {
  opacity: 0.5;
  pointer-events: none;
}

.vt-combobox-icon {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  color: hsl(var(--brand-fill));
}
/* Auto-generated by scripts/build-component-css.mjs from components/command.json. Do not edit manually. */

/* ── Command ────────────────────────────────────────── */

.vt-command-wrapper {
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-lg);
  border: var(--border-width-thin) solid hsl(var(--border-default));
  background: hsl(var(--surface-card));
  overflow: hidden;
}

.vt-command-search {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
  padding: 0 var(--spacing-3);
  border-bottom: var(--border-width-thin) solid hsl(var(--border-default));
}

.vt-command-search-icon {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  color: hsl(var(--foreground-muted));
}

.vt-command-input {
  display: flex;
  height: var(--control-height-lg);
  flex: 1;
  min-width: 0;
  background: transparent;
  border: none;
  outline: none;
  padding: 0;
  color: hsl(var(--foreground-primary));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-command-input::placeholder {
  color: hsl(var(--foreground-muted));
}

.vt-command-list {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-1);
  padding: var(--spacing-2);
  max-height: var(--spacing-72);
  overflow-y: auto;
}

.vt-command-group {
  display: flex;
  flex-direction: column;
}

.vt-command-group-heading {
  display: flex;
  align-items: center;
  padding: var(--spacing-1_5) var(--spacing-2);
  color: hsl(var(--foreground-muted));
  font-size: var(--type-label-sm-size);
  line-height: var(--type-label-sm-line-height);
  font-weight: var(--type-label-sm-weight);
  letter-spacing: var(--type-label-sm-tracking);
}

.vt-command-separator {
  height: var(--border-width-thin);
  background: hsl(var(--border-default));
  flex-shrink: 0;
}

.vt-command-empty {
  padding: var(--spacing-6) 0;
  text-align: center;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-command-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-3);
  padding: var(--spacing-2) var(--spacing-3);
  border-top: var(--border-width-thin) solid hsl(var(--border-default));
  color: hsl(var(--foreground-muted));
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/menuitem.json. Do not edit manually. */

/* ── MenuItem ────────────────────────────────────────── */

.vt-command-item {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
  padding: var(--spacing-1_5) var(--spacing-2);
  border-radius: var(--radius-sm);
  color: hsl(var(--foreground-primary));
  cursor: pointer;
  user-select: none;
  transition: background var(--transition-fast);
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

/* ── MenuItem · size ── */

.vt-command-item-sm {
  gap: var(--spacing-1_5);
  padding: var(--spacing-1) var(--spacing-2);
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}

.vt-command-item:hover, .vt-command-item.vt-selected, .vt-command-item.vt-active {
  background: hsl(var(--surface-subtle));
}

.vt-command-item[aria-disabled="true"] {
  opacity: 0.5;
  pointer-events: none;
}

.vt-command-item.vt-command-danger {
  color: hsl(var(--error-fill));
}

.vt-command-item.vt-command-danger:hover, .vt-command-item.vt-command-danger.vt-selected, .vt-command-item.vt-command-danger.vt-active {
  background: hsl(var(--error-surface));
}

.vt-command-danger .vt-command-item-icon {
  color: inherit;
}

.vt-command-item-icon {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  color: hsl(var(--foreground-muted));
}

.vt-command-item-check {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  color: hsl(var(--brand-fill));
  opacity: 0;
}

.vt-command-item[aria-checked="true"] > .vt-command-item-check, .vt-command-item[aria-selected="true"] > .vt-command-item-check {
  opacity: 1;
}

.vt-command-item-check > svg {
  width: var(--spacing-4);
  height: var(--spacing-4);
}

.vt-command-shortcut {
  margin-inline-start: auto;
  font-family: inherit;
  color: hsl(var(--foreground-muted));
  font-size: var(--type-caption-size);
  line-height: var(--type-caption-line-height);
  font-weight: var(--type-caption-weight);
  letter-spacing: var(--type-caption-tracking);
}
/* Auto-generated by scripts/build-component-css.mjs from components/dropdownmenu.json. Do not edit manually. */

/* ── DropdownMenu ────────────────────────────────────────── */

.vt-dropdown-menu {
  position: absolute;
  top: 100%;
  inset-inline-start: 0;
  z-index: 50;
  display: flex;
  flex-direction: column;
  min-width: var(--spacing-48);
  margin-top: var(--spacing-2);
  padding: var(--spacing-1);
  background: hsl(var(--surface-card));
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  opacity: 0;
  visibility: hidden;
  transform: translateY(calc(-1 * var(--spacing-2)));
  transition: opacity var(--transition-fast), transform var(--transition-fast), visibility 0s 150ms;
}

.vt-dropdown-menu.vt-open {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition: opacity var(--transition-fast), transform var(--transition-fast), visibility 0s;
}

.vt-dropdown-menu-static {
  position: static;
  margin-top: 0;
  opacity: 1;
  visibility: visible;
  transform: none;
}

.vt-dropdown-wrap {
  position: relative;
  display: inline-block;
}

.vt-dropdown-menu .vt-command-item {
  border-radius: calc(var(--radius-lg) - var(--spacing-1));
}

.vt-dropdown-label {
  display: flex;
  align-items: center;
  padding: var(--spacing-1_5) var(--spacing-2);
  color: hsl(var(--foreground-muted));
  font-size: var(--type-label-sm-size);
  line-height: var(--type-label-sm-line-height);
  font-weight: var(--type-label-sm-weight);
  letter-spacing: var(--type-label-sm-tracking);
}

.vt-dropdown-separator {
  display: flex;
  flex-direction: column;
  padding: var(--spacing-1) 0;
}

.vt-dropdown-separator::before {
  content: "";
  height: var(--border-width-thin);
  background: hsl(var(--border-default));
}
/* Auto-generated by scripts/build-component-css.mjs from components/treeitem.json. Do not edit manually. */

/* ── TreeItem ────────────────────────────────────────── */

.vt-tree-toggle {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
  width: 100%;
  padding: var(--spacing-1) var(--spacing-2);
  border: none;
  border-radius: var(--radius-md);
  background: transparent;
  color: hsl(var(--foreground-primary));
  font-family: inherit;
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
  text-align: start;
  cursor: pointer;
  transition: color var(--transition-fast), background-color var(--transition-fast);
}

.vt-tree-toggle:hover {
  background: hsl(var(--surface-subtle));
}

.vt-tree-leaf {
  display: flex;
  align-items: center;
  gap: var(--spacing-2);
  padding: var(--spacing-1) var(--spacing-2) var(--spacing-1) var(--spacing-8);
  border-radius: var(--radius-md);
  color: hsl(var(--foreground-secondary));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
  text-decoration: none;
  cursor: pointer;
  transition: color var(--transition-fast), background-color var(--transition-fast);
}

.vt-tree-leaf:hover {
  color: hsl(var(--foreground-primary));
  background: hsl(var(--surface-subtle));
}

.vt-tree-toggle.vt-tree-active, .vt-tree-leaf.vt-tree-active {
  color: hsl(var(--brand-fill));
  background: hsl(var(--brand-fill) / 0.1);
  font-size: var(--type-label-md-size);
  line-height: var(--type-label-md-line-height);
  font-weight: var(--type-label-md-weight);
  letter-spacing: var(--type-label-md-tracking);
}

.vt-tree-chevron {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  color: hsl(var(--foreground-muted));
  transition: transform var(--transition-normal);
}

.vt-tree-icon {
  width: var(--spacing-4);
  height: var(--spacing-4);
  flex-shrink: 0;
  color: hsl(var(--foreground-muted));
}

.vt-tree-active > .vt-tree-icon {
  color: hsl(var(--brand-fill));
}
/* Auto-generated by scripts/build-component-css.mjs from components/treeview.json. Do not edit manually. */

/* ── TreeView ────────────────────────────────────────── */

.vt-tree {
  display: flex;
  flex-direction: column;
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-tree-item {
  display: flex;
  flex-direction: column;
}

.vt-tree-children {
  display: none;
  flex-direction: column;
  padding-inline-start: var(--spacing-6);
}

[data-tree-branch].open > .vt-tree-children {
  display: flex;
}

[data-tree-branch].open > .vt-tree-toggle > .vt-tree-chevron {
  transform: rotate(90deg);
}
/* Auto-generated by scripts/build-component-css.mjs from components/resizable.json. Do not edit manually. */

/* ── Resizable ────────────────────────────────────────── */

.vt-resizable {
  display: flex;
  border: var(--border-width-thin) solid hsl(var(--border-default));
  border-radius: var(--radius-2xl);
  background: hsl(var(--surface-card));
  overflow: hidden;
}

.vt-resizable[data-resizable="vertical"] {
  flex-direction: column;
}

.vt-resizable .vt-resizable {
  border: none;
  border-radius: 0;
  background: transparent;
  gap: 0;
  padding: 0;
}

.vt-resizable-panel {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-3);
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  padding: var(--spacing-4);
  overflow: hidden;
  color: hsl(var(--foreground-secondary));
  font-size: var(--type-body-sm-size);
  line-height: var(--type-body-sm-line-height);
  font-weight: var(--type-body-sm-weight);
  letter-spacing: var(--type-body-sm-tracking);
}

.vt-resize-handle {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-0_5);
  width: var(--spacing-1_5);
  flex-shrink: 0;
  background: hsl(var(--border-default));
  cursor: col-resize;
  transition: background var(--transition-fast);
}

.vt-resize-handle:hover {
  background: hsl(var(--brand-fill) / 0.5);
}

.vt-resizable[data-resizable="vertical"] > .vt-resize-handle, .vt-resize-handle-row {
  flex-direction: row;
  width: auto;
  height: var(--spacing-1_5);
  cursor: row-resize;
}

.vt-resize-handle-col {
  flex-direction: column;
  width: var(--spacing-1_5);
  height: auto;
  cursor: col-resize;
}

.vt-resize-handle-dot {
  width: var(--spacing-0_5);
  height: var(--spacing-0_5);
  flex-shrink: 0;
  border-radius: var(--radius-full);
  background: hsl(var(--foreground-muted));
}
/* Auto-generated by scripts/build-component-css.mjs from components/scrollview.json. Do not edit manually. */

/* ── ScrollView ────────────────────────────────────────── */

.vt-scroll {
  overflow: auto;
}

.vt-scroll::-webkit-scrollbar, .vt-scroll-autohide::-webkit-scrollbar {
  width: var(--spacing-1_5);
  height: var(--spacing-1_5);
}

.vt-scroll::-webkit-scrollbar-track, .vt-scroll-autohide::-webkit-scrollbar-track, .vt-scroll::-webkit-scrollbar-corner, .vt-scroll-autohide::-webkit-scrollbar-corner {
  background: transparent;
}

.vt-scroll::-webkit-scrollbar-thumb {
  background: hsl(var(--border-default));
  border-radius: var(--radius-2xs);
}

.vt-scroll::-webkit-scrollbar-thumb:hover {
  background: hsl(var(--surface-strong));
}

.vt-scroll-hidden {
  overflow: auto;
}

.vt-scroll-hidden::-webkit-scrollbar {
  display: none;
}

.vt-scroll-autohide {
  overflow: auto;
}

.vt-scroll-autohide::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: var(--radius-2xs);
  transition: background var(--transition-normal);
}

.vt-scroll-autohide:hover::-webkit-scrollbar-thumb {
  background: hsl(var(--border-default));
}

.vt-drag-scroll {
  cursor: grab;
  user-select: none;
}

.vt-scroll-indicator, .vt-scroll-indicator-h {
  position: relative;
}

.vt-scroll-indicator::before, .vt-scroll-indicator::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  height: var(--spacing-8);
  pointer-events: none;
  z-index: 1;
  opacity: 0;
  transition: opacity var(--transition-normal);
}

.vt-scroll-indicator::before {
  top: 0;
  background: linear-gradient(to bottom, hsl(var(--surface-page)), transparent);
}

.vt-scroll-indicator::after {
  bottom: 0;
  background: linear-gradient(to top, hsl(var(--surface-page)), transparent);
}

.vt-scroll-indicator-h::before, .vt-scroll-indicator-h::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: var(--spacing-8);
  pointer-events: none;
  z-index: 1;
  opacity: 0;
  transition: opacity var(--transition-normal);
}

.vt-scroll-indicator-h::before {
  inset-inline-start: 0;
  background: linear-gradient(to right, hsl(var(--surface-page)), transparent);
}

.vt-scroll-indicator-h::after {
  inset-inline-end: 0;
  background: linear-gradient(to left, hsl(var(--surface-page)), transparent);
}

.vt-scroll-indicator.vt-show-top::before, .vt-scroll-indicator.vt-show-bottom::after, .vt-scroll-indicator-h.vt-show-left::before, .vt-scroll-indicator-h.vt-show-right::after {
  opacity: 1;
}

/* Firefox has no ::-webkit-scrollbar; it styles the bar with the standard
   properties. They are kept to browsers without the pseudo-elements because
   Chrome, which reads both, ignores the ::-webkit-scrollbar rules above as
   soon as scrollbar-width or scrollbar-color is set. */
@supports not selector(::-webkit-scrollbar) {
  .vt-scroll { scrollbar-width: thin; scrollbar-color: hsl(var(--border-default)) transparent; }
  .vt-scroll-autohide { scrollbar-width: thin; scrollbar-color: transparent transparent; }
  .vt-scroll-autohide:hover { scrollbar-color: hsl(var(--border-default)) transparent; }
  .vt-scroll-hidden { scrollbar-width: none; }
}
/* Auto-generated by scripts/generate-vt-utilities.mjs — do not edit manually. */

/* ── 1. CSS Reset ───────────────────────────────────────────── */
*, ::before, ::after {
  box-sizing: border-box;
  border-width: 0;
  border-style: solid;
  border-color: hsl(var(--border-default, 0 5% 92%));
}
html, :host {
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
  -moz-tab-size: 4;
  tab-size: 4;
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-feature-settings: normal;
  font-variation-settings: normal;
  -webkit-tap-highlight-color: transparent;
}
body { margin: 0; line-height: inherit; }
hr { height: 0; color: inherit; }
abbr:where([title]) { text-decoration: underline dotted; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
a { color: inherit; text-decoration: inherit; }
b, strong { font-weight: bolder; }
code, kbd, samp, pre { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-feature-settings: normal; font-variation-settings: normal; font-size: 1em; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sub { bottom: -0.25em; }
sup { top: -0.5em; }
table { text-indent: 0; border-color: inherit; border-collapse: collapse; }
button, input, optgroup, select, textarea { font-family: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-size: 100%; font-weight: inherit; line-height: inherit; letter-spacing: inherit; color: inherit; margin: 0; padding: 0; }
button, select { text-transform: none; }
button, input:where([type=button]), input:where([type=reset]), input:where([type=submit]) { -webkit-appearance: button; background-color: transparent; background-image: none; }
:-moz-focusring { outline: auto; }
:-moz-ui-invalid { box-shadow: none; }
progress { vertical-align: baseline; }
::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; }
[type=search] { -webkit-appearance: textfield; outline-offset: -2px; }
::-webkit-search-decoration { -webkit-appearance: none; }
::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; }
summary { display: list-item; }
blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre { margin: 0; }
fieldset { margin: 0; padding: 0; }
legend { padding: 0; }
ol, ul, menu { list-style: none; margin: 0; padding: 0; }
dialog { padding: 0; }
textarea { resize: vertical; }
input::placeholder, textarea::placeholder { opacity: 1; color: #9ca3af; }
button, [role=button] { cursor: pointer; }
:disabled { cursor: default; }
img, svg, video, canvas, audio, iframe, embed, object { display: block; vertical-align: middle; }
img, video { max-width: 100%; height: auto; }
[hidden]:where(:not([hidden=until-found])) { display: none; }

/* ── 2. Internal composition variables ──────────────────── */
*, ::before, ::after {
  --vt-translate-x: 0;
  --vt-translate-y: 0;
  --vt-rotate: 0;
  --vt-skew-x: 0;
  --vt-skew-y: 0;
  --vt-scale-x: 1;
  --vt-scale-y: 1;
  --vt-ring-inset: ;
  --vt-ring-offset-width: 0px;
  --vt-ring-offset-color: #fff;
  --vt-ring-color: hsl(var(--brand-fill) / 0.5);
  --vt-ring-offset-shadow: 0 0 #0000;
  --vt-ring-shadow: 0 0 #0000;
  --vt-shadow: 0 0 #0000;
  --vt-shadow-colored: 0 0 #0000;
  --vt-gradient-from-position: ;
  --vt-gradient-via-position: ;
  --vt-gradient-to-position: ;
  --vt-space-x-reverse: 0;
  --vt-space-y-reverse: 0;
  --vt-divide-y-reverse: 0;
  --vt-numeric-spacing: ;
  --vt-ordinal: ;
  --vt-slashed-zero: ;
  --vt-numeric-figure: ;
  --vt-numeric-fraction: ;
  --vt-backdrop-blur: ;
  --vt-backdrop-brightness: ;
  --vt-backdrop-contrast: ;
  --vt-backdrop-grayscale: ;
  --vt-backdrop-hue-rotate: ;
  --vt-backdrop-invert: ;
  --vt-backdrop-opacity: ;
  --vt-backdrop-saturate: ;
  --vt-backdrop-sepia: ;
  --vt-blur: ;
  --vt-brightness: ;
  --vt-contrast: ;
  --vt-grayscale: ;
  --vt-hue-rotate: ;
  --vt-invert: ;
  --vt-saturate: ;
  --vt-sepia: ;
  --vt-drop-shadow: ;
}

/* ── 3. Base utilities ─────────────────────────────────── */

.vt-block { display: block; }
.vt-inline-block { display: inline-block; }
.vt-inline { display: inline; }
.vt-flex { display: flex; }
.vt-inline-flex { display: inline-flex; }
.vt-grid { display: grid; }
.vt-inline-grid { display: inline-grid; }
.vt-hidden { display: none; }
.vt-table { display: table; }
.vt-table-row { display: table-row; }
.vt-table-cell { display: table-cell; }
.\!block { display: block !important; }
.vt-static { position: static; }
.vt-relative { position: relative; }
.vt-absolute { position: absolute; }
.vt-fixed { position: fixed; }
.vt-sticky { position: sticky; }
.vt-visible { visibility: visible; }
.vt-collapse { visibility: collapse; }
.vt-inset-0 { inset: 0; }
.vt-inset-2 { inset: 0.5rem; }
.vt-inset-x-0 { left: 0; right: 0; }
.vt-top-0 { top:0; }
.vt-top-0\.5 { top:0.125rem; }
.vt-top-1 { top:0.25rem; }
.vt-top-1\/2 { top:50%; }
.vt-top-2 { top:0.5rem; }
.vt-top-8 { top:2rem; }
.vt-top-12 { top:3rem; }
.vt-top-full { top:100%; }
.vt-right-0 { right:0; }
.vt-right-0\.5 { right:0.125rem; }
.vt-right-2 { right:0.5rem; }
.vt-right-3 { right:0.75rem; }
.vt-right-4 { right:1rem; }
.vt-right-6 { right:1.5rem; }
.vt-right-full { right:100%; }
.vt-bottom-0 { bottom:0; }
.vt-bottom-1 { bottom:0.25rem; }
.vt-bottom-2 { bottom:0.5rem; }
.vt-bottom-3 { bottom:0.75rem; }
.vt-bottom-4 { bottom:1rem; }
.vt-bottom-6 { bottom:1.5rem; }
.vt-bottom-full { bottom:100%; }
.vt-left-0 { left:0; }
.vt-left-1\/2 { left:50%; }
.vt-left-3 { left:0.75rem; }
.vt-left-4 { left:1rem; }
.vt-left-6 { left:1.5rem; }
.vt-left-8 { left:2rem; }
.vt-left-full { left:100%; }
.vt-z-0 { z-index: 0; }
.vt-z-10 { z-index: 10; }
.vt-z-20 { z-index: 20; }
.vt-z-30 { z-index: 30; }
.vt-z-40 { z-index: 40; }
.vt-z-50 { z-index: 50; }
.vt-z-\[100\] { z-index: 100; }

.vt-m-0 { margin: 0px; }
.vt-m-1 { margin: 0.25rem; }
.vt-m-2 { margin: 0.5rem; }
.vt-m-3 { margin: 0.75rem; }
.vt-m-4 { margin: 1rem; }
.vt-m-5 { margin: 1.25rem; }
.vt-m-6 { margin: 1.5rem; }
.vt-m-7 { margin: 1.75rem; }
.vt-m-8 { margin: 2rem; }
.vt-m-10 { margin: 2.5rem; }
.vt-m-12 { margin: 3rem; }
.vt-m-14 { margin: 3.5rem; }
.vt-m-16 { margin: 4rem; }
.vt-m-18 { margin: 4.5rem; }
.vt-m-20 { margin: 5rem; }
.vt-m-22 { margin: 5.5rem; }
.vt-m-24 { margin: 6rem; }
.vt-m-28 { margin: 7rem; }
.vt-m-32 { margin: 8rem; }
.vt-m-36 { margin: 9rem; }
.vt-m-40 { margin: 10rem; }
.vt-m-44 { margin: 11rem; }
.vt-m-48 { margin: 12rem; }
.vt-m-52 { margin: 13rem; }
.vt-m-56 { margin: 14rem; }
.vt-m-60 { margin: 15rem; }
.vt-m-64 { margin: 16rem; }
.vt-m-72 { margin: 18rem; }
.vt-m-80 { margin: 20rem; }
.vt-m-96 { margin: 24rem; }
.vt-m-0\.5 { margin: 0.125rem; }
.vt-m-1\.5 { margin: 0.375rem; }
.vt-mx-0 { margin-left: 0px; margin-right: 0px; }
.vt-mx-1 { margin-left: 0.25rem; margin-right: 0.25rem; }
.vt-mx-2 { margin-left: 0.5rem; margin-right: 0.5rem; }
.vt-mx-3 { margin-left: 0.75rem; margin-right: 0.75rem; }
.vt-mx-4 { margin-left: 1rem; margin-right: 1rem; }
.vt-mx-5 { margin-left: 1.25rem; margin-right: 1.25rem; }
.vt-mx-6 { margin-left: 1.5rem; margin-right: 1.5rem; }
.vt-mx-7 { margin-left: 1.75rem; margin-right: 1.75rem; }
.vt-mx-8 { margin-left: 2rem; margin-right: 2rem; }
.vt-mx-10 { margin-left: 2.5rem; margin-right: 2.5rem; }
.vt-mx-12 { margin-left: 3rem; margin-right: 3rem; }
.vt-mx-14 { margin-left: 3.5rem; margin-right: 3.5rem; }
.vt-mx-16 { margin-left: 4rem; margin-right: 4rem; }
.vt-mx-18 { margin-left: 4.5rem; margin-right: 4.5rem; }
.vt-mx-20 { margin-left: 5rem; margin-right: 5rem; }
.vt-mx-22 { margin-left: 5.5rem; margin-right: 5.5rem; }
.vt-mx-24 { margin-left: 6rem; margin-right: 6rem; }
.vt-mx-28 { margin-left: 7rem; margin-right: 7rem; }
.vt-mx-32 { margin-left: 8rem; margin-right: 8rem; }
.vt-mx-36 { margin-left: 9rem; margin-right: 9rem; }
.vt-mx-40 { margin-left: 10rem; margin-right: 10rem; }
.vt-mx-44 { margin-left: 11rem; margin-right: 11rem; }
.vt-mx-48 { margin-left: 12rem; margin-right: 12rem; }
.vt-mx-52 { margin-left: 13rem; margin-right: 13rem; }
.vt-mx-56 { margin-left: 14rem; margin-right: 14rem; }
.vt-mx-60 { margin-left: 15rem; margin-right: 15rem; }
.vt-mx-64 { margin-left: 16rem; margin-right: 16rem; }
.vt-mx-72 { margin-left: 18rem; margin-right: 18rem; }
.vt-mx-80 { margin-left: 20rem; margin-right: 20rem; }
.vt-mx-96 { margin-left: 24rem; margin-right: 24rem; }
.vt-mx-0\.5 { margin-left: 0.125rem; margin-right: 0.125rem; }
.vt-mx-1\.5 { margin-left: 0.375rem; margin-right: 0.375rem; }
.vt-my-0 { margin-top: 0px; margin-bottom: 0px; }
.vt-my-1 { margin-top: 0.25rem; margin-bottom: 0.25rem; }
.vt-my-2 { margin-top: 0.5rem; margin-bottom: 0.5rem; }
.vt-my-3 { margin-top: 0.75rem; margin-bottom: 0.75rem; }
.vt-my-4 { margin-top: 1rem; margin-bottom: 1rem; }
.vt-my-5 { margin-top: 1.25rem; margin-bottom: 1.25rem; }
.vt-my-6 { margin-top: 1.5rem; margin-bottom: 1.5rem; }
.vt-my-7 { margin-top: 1.75rem; margin-bottom: 1.75rem; }
.vt-my-8 { margin-top: 2rem; margin-bottom: 2rem; }
.vt-my-10 { margin-top: 2.5rem; margin-bottom: 2.5rem; }
.vt-my-12 { margin-top: 3rem; margin-bottom: 3rem; }
.vt-my-14 { margin-top: 3.5rem; margin-bottom: 3.5rem; }
.vt-my-16 { margin-top: 4rem; margin-bottom: 4rem; }
.vt-my-18 { margin-top: 4.5rem; margin-bottom: 4.5rem; }
.vt-my-20 { margin-top: 5rem; margin-bottom: 5rem; }
.vt-my-22 { margin-top: 5.5rem; margin-bottom: 5.5rem; }
.vt-my-24 { margin-top: 6rem; margin-bottom: 6rem; }
.vt-my-28 { margin-top: 7rem; margin-bottom: 7rem; }
.vt-my-32 { margin-top: 8rem; margin-bottom: 8rem; }
.vt-my-36 { margin-top: 9rem; margin-bottom: 9rem; }
.vt-my-40 { margin-top: 10rem; margin-bottom: 10rem; }
.vt-my-44 { margin-top: 11rem; margin-bottom: 11rem; }
.vt-my-48 { margin-top: 12rem; margin-bottom: 12rem; }
.vt-my-52 { margin-top: 13rem; margin-bottom: 13rem; }
.vt-my-56 { margin-top: 14rem; margin-bottom: 14rem; }
.vt-my-60 { margin-top: 15rem; margin-bottom: 15rem; }
.vt-my-64 { margin-top: 16rem; margin-bottom: 16rem; }
.vt-my-72 { margin-top: 18rem; margin-bottom: 18rem; }
.vt-my-80 { margin-top: 20rem; margin-bottom: 20rem; }
.vt-my-96 { margin-top: 24rem; margin-bottom: 24rem; }
.vt-my-0\.5 { margin-top: 0.125rem; margin-bottom: 0.125rem; }
.vt-my-1\.5 { margin-top: 0.375rem; margin-bottom: 0.375rem; }
.vt-mt-0 { margin-top: 0px; }
.vt-mt-1 { margin-top: 0.25rem; }
.vt-mt-2 { margin-top: 0.5rem; }
.vt-mt-3 { margin-top: 0.75rem; }
.vt-mt-4 { margin-top: 1rem; }
.vt-mt-5 { margin-top: 1.25rem; }
.vt-mt-6 { margin-top: 1.5rem; }
.vt-mt-7 { margin-top: 1.75rem; }
.vt-mt-8 { margin-top: 2rem; }
.vt-mt-10 { margin-top: 2.5rem; }
.vt-mt-12 { margin-top: 3rem; }
.vt-mt-14 { margin-top: 3.5rem; }
.vt-mt-16 { margin-top: 4rem; }
.vt-mt-18 { margin-top: 4.5rem; }
.vt-mt-20 { margin-top: 5rem; }
.vt-mt-22 { margin-top: 5.5rem; }
.vt-mt-24 { margin-top: 6rem; }
.vt-mt-28 { margin-top: 7rem; }
.vt-mt-32 { margin-top: 8rem; }
.vt-mt-36 { margin-top: 9rem; }
.vt-mt-40 { margin-top: 10rem; }
.vt-mt-44 { margin-top: 11rem; }
.vt-mt-48 { margin-top: 12rem; }
.vt-mt-52 { margin-top: 13rem; }
.vt-mt-56 { margin-top: 14rem; }
.vt-mt-60 { margin-top: 15rem; }
.vt-mt-64 { margin-top: 16rem; }
.vt-mt-72 { margin-top: 18rem; }
.vt-mt-80 { margin-top: 20rem; }
.vt-mt-96 { margin-top: 24rem; }
.vt-mt-0\.5 { margin-top: 0.125rem; }
.vt-mt-1\.5 { margin-top: 0.375rem; }
.vt-mr-0 { margin-right: 0px; }
.vt-mr-1 { margin-right: 0.25rem; }
.vt-mr-2 { margin-right: 0.5rem; }
.vt-mr-3 { margin-right: 0.75rem; }
.vt-mr-4 { margin-right: 1rem; }
.vt-mr-5 { margin-right: 1.25rem; }
.vt-mr-6 { margin-right: 1.5rem; }
.vt-mr-7 { margin-right: 1.75rem; }
.vt-mr-8 { margin-right: 2rem; }
.vt-mr-10 { margin-right: 2.5rem; }
.vt-mr-12 { margin-right: 3rem; }
.vt-mr-14 { margin-right: 3.5rem; }
.vt-mr-16 { margin-right: 4rem; }
.vt-mr-18 { margin-right: 4.5rem; }
.vt-mr-20 { margin-right: 5rem; }
.vt-mr-22 { margin-right: 5.5rem; }
.vt-mr-24 { margin-right: 6rem; }
.vt-mr-28 { margin-right: 7rem; }
.vt-mr-32 { margin-right: 8rem; }
.vt-mr-36 { margin-right: 9rem; }
.vt-mr-40 { margin-right: 10rem; }
.vt-mr-44 { margin-right: 11rem; }
.vt-mr-48 { margin-right: 12rem; }
.vt-mr-52 { margin-right: 13rem; }
.vt-mr-56 { margin-right: 14rem; }
.vt-mr-60 { margin-right: 15rem; }
.vt-mr-64 { margin-right: 16rem; }
.vt-mr-72 { margin-right: 18rem; }
.vt-mr-80 { margin-right: 20rem; }
.vt-mr-96 { margin-right: 24rem; }
.vt-mr-0\.5 { margin-right: 0.125rem; }
.vt-mr-1\.5 { margin-right: 0.375rem; }
.vt-mb-0 { margin-bottom: 0px; }
.vt-mb-1 { margin-bottom: 0.25rem; }
.vt-mb-2 { margin-bottom: 0.5rem; }
.vt-mb-3 { margin-bottom: 0.75rem; }
.vt-mb-4 { margin-bottom: 1rem; }
.vt-mb-5 { margin-bottom: 1.25rem; }
.vt-mb-6 { margin-bottom: 1.5rem; }
.vt-mb-7 { margin-bottom: 1.75rem; }
.vt-mb-8 { margin-bottom: 2rem; }
.vt-mb-10 { margin-bottom: 2.5rem; }
.vt-mb-12 { margin-bottom: 3rem; }
.vt-mb-14 { margin-bottom: 3.5rem; }
.vt-mb-16 { margin-bottom: 4rem; }
.vt-mb-18 { margin-bottom: 4.5rem; }
.vt-mb-20 { margin-bottom: 5rem; }
.vt-mb-22 { margin-bottom: 5.5rem; }
.vt-mb-24 { margin-bottom: 6rem; }
.vt-mb-28 { margin-bottom: 7rem; }
.vt-mb-32 { margin-bottom: 8rem; }
.vt-mb-36 { margin-bottom: 9rem; }
.vt-mb-40 { margin-bottom: 10rem; }
.vt-mb-44 { margin-bottom: 11rem; }
.vt-mb-48 { margin-bottom: 12rem; }
.vt-mb-52 { margin-bottom: 13rem; }
.vt-mb-56 { margin-bottom: 14rem; }
.vt-mb-60 { margin-bottom: 15rem; }
.vt-mb-64 { margin-bottom: 16rem; }
.vt-mb-72 { margin-bottom: 18rem; }
.vt-mb-80 { margin-bottom: 20rem; }
.vt-mb-96 { margin-bottom: 24rem; }
.vt-mb-0\.5 { margin-bottom: 0.125rem; }
.vt-mb-1\.5 { margin-bottom: 0.375rem; }
.vt-ml-0 { margin-left: 0px; }
.vt-ml-1 { margin-left: 0.25rem; }
.vt-ml-2 { margin-left: 0.5rem; }
.vt-ml-3 { margin-left: 0.75rem; }
.vt-ml-4 { margin-left: 1rem; }
.vt-ml-5 { margin-left: 1.25rem; }
.vt-ml-6 { margin-left: 1.5rem; }
.vt-ml-7 { margin-left: 1.75rem; }
.vt-ml-8 { margin-left: 2rem; }
.vt-ml-10 { margin-left: 2.5rem; }
.vt-ml-12 { margin-left: 3rem; }
.vt-ml-14 { margin-left: 3.5rem; }
.vt-ml-16 { margin-left: 4rem; }
.vt-ml-18 { margin-left: 4.5rem; }
.vt-ml-20 { margin-left: 5rem; }
.vt-ml-22 { margin-left: 5.5rem; }
.vt-ml-24 { margin-left: 6rem; }
.vt-ml-28 { margin-left: 7rem; }
.vt-ml-32 { margin-left: 8rem; }
.vt-ml-36 { margin-left: 9rem; }
.vt-ml-40 { margin-left: 10rem; }
.vt-ml-44 { margin-left: 11rem; }
.vt-ml-48 { margin-left: 12rem; }
.vt-ml-52 { margin-left: 13rem; }
.vt-ml-56 { margin-left: 14rem; }
.vt-ml-60 { margin-left: 15rem; }
.vt-ml-64 { margin-left: 16rem; }
.vt-ml-72 { margin-left: 18rem; }
.vt-ml-80 { margin-left: 20rem; }
.vt-ml-96 { margin-left: 24rem; }
.vt-ml-0\.5 { margin-left: 0.125rem; }
.vt-ml-1\.5 { margin-left: 0.375rem; }
.vt-mx-auto { margin-left: auto; margin-right: auto; }
.vt-ml-auto { margin-left: auto; }
.vt-mt-auto { margin-top: auto; }

.vt-ms-0 { margin-inline-start: 0px; }
.vt-ms-1 { margin-inline-start: 0.25rem; }
.vt-ms-2 { margin-inline-start: 0.5rem; }
.vt-ms-3 { margin-inline-start: 0.75rem; }
.vt-ms-4 { margin-inline-start: 1rem; }
.vt-ms-5 { margin-inline-start: 1.25rem; }
.vt-ms-6 { margin-inline-start: 1.5rem; }
.vt-ms-7 { margin-inline-start: 1.75rem; }
.vt-ms-8 { margin-inline-start: 2rem; }
.vt-ms-10 { margin-inline-start: 2.5rem; }
.vt-ms-12 { margin-inline-start: 3rem; }
.vt-ms-14 { margin-inline-start: 3.5rem; }
.vt-ms-16 { margin-inline-start: 4rem; }
.vt-ms-18 { margin-inline-start: 4.5rem; }
.vt-ms-20 { margin-inline-start: 5rem; }
.vt-ms-22 { margin-inline-start: 5.5rem; }
.vt-ms-24 { margin-inline-start: 6rem; }
.vt-ms-28 { margin-inline-start: 7rem; }
.vt-ms-32 { margin-inline-start: 8rem; }
.vt-ms-36 { margin-inline-start: 9rem; }
.vt-ms-40 { margin-inline-start: 10rem; }
.vt-ms-44 { margin-inline-start: 11rem; }
.vt-ms-48 { margin-inline-start: 12rem; }
.vt-ms-52 { margin-inline-start: 13rem; }
.vt-ms-56 { margin-inline-start: 14rem; }
.vt-ms-60 { margin-inline-start: 15rem; }
.vt-ms-64 { margin-inline-start: 16rem; }
.vt-ms-72 { margin-inline-start: 18rem; }
.vt-ms-80 { margin-inline-start: 20rem; }
.vt-ms-96 { margin-inline-start: 24rem; }
.vt-ms-0\.5 { margin-inline-start: 0.125rem; }
.vt-ms-1\.5 { margin-inline-start: 0.375rem; }
.vt-me-0 { margin-inline-end: 0px; }
.vt-me-1 { margin-inline-end: 0.25rem; }
.vt-me-2 { margin-inline-end: 0.5rem; }
.vt-me-3 { margin-inline-end: 0.75rem; }
.vt-me-4 { margin-inline-end: 1rem; }
.vt-me-5 { margin-inline-end: 1.25rem; }
.vt-me-6 { margin-inline-end: 1.5rem; }
.vt-me-7 { margin-inline-end: 1.75rem; }
.vt-me-8 { margin-inline-end: 2rem; }
.vt-me-10 { margin-inline-end: 2.5rem; }
.vt-me-12 { margin-inline-end: 3rem; }
.vt-me-14 { margin-inline-end: 3.5rem; }
.vt-me-16 { margin-inline-end: 4rem; }
.vt-me-18 { margin-inline-end: 4.5rem; }
.vt-me-20 { margin-inline-end: 5rem; }
.vt-me-22 { margin-inline-end: 5.5rem; }
.vt-me-24 { margin-inline-end: 6rem; }
.vt-me-28 { margin-inline-end: 7rem; }
.vt-me-32 { margin-inline-end: 8rem; }
.vt-me-36 { margin-inline-end: 9rem; }
.vt-me-40 { margin-inline-end: 10rem; }
.vt-me-44 { margin-inline-end: 11rem; }
.vt-me-48 { margin-inline-end: 12rem; }
.vt-me-52 { margin-inline-end: 13rem; }
.vt-me-56 { margin-inline-end: 14rem; }
.vt-me-60 { margin-inline-end: 15rem; }
.vt-me-64 { margin-inline-end: 16rem; }
.vt-me-72 { margin-inline-end: 18rem; }
.vt-me-80 { margin-inline-end: 20rem; }
.vt-me-96 { margin-inline-end: 24rem; }
.vt-me-0\.5 { margin-inline-end: 0.125rem; }
.vt-me-1\.5 { margin-inline-end: 0.375rem; }
.vt-ps-0 { padding-inline-start: 0px; }
.vt-ps-1 { padding-inline-start: 0.25rem; }
.vt-ps-2 { padding-inline-start: 0.5rem; }
.vt-ps-3 { padding-inline-start: 0.75rem; }
.vt-ps-4 { padding-inline-start: 1rem; }
.vt-ps-5 { padding-inline-start: 1.25rem; }
.vt-ps-6 { padding-inline-start: 1.5rem; }
.vt-ps-7 { padding-inline-start: 1.75rem; }
.vt-ps-8 { padding-inline-start: 2rem; }
.vt-ps-10 { padding-inline-start: 2.5rem; }
.vt-ps-12 { padding-inline-start: 3rem; }
.vt-ps-14 { padding-inline-start: 3.5rem; }
.vt-ps-16 { padding-inline-start: 4rem; }
.vt-ps-18 { padding-inline-start: 4.5rem; }
.vt-ps-20 { padding-inline-start: 5rem; }
.vt-ps-22 { padding-inline-start: 5.5rem; }
.vt-ps-24 { padding-inline-start: 6rem; }
.vt-ps-28 { padding-inline-start: 7rem; }
.vt-ps-32 { padding-inline-start: 8rem; }
.vt-ps-36 { padding-inline-start: 9rem; }
.vt-ps-40 { padding-inline-start: 10rem; }
.vt-ps-44 { padding-inline-start: 11rem; }
.vt-ps-48 { padding-inline-start: 12rem; }
.vt-ps-52 { padding-inline-start: 13rem; }
.vt-ps-56 { padding-inline-start: 14rem; }
.vt-ps-60 { padding-inline-start: 15rem; }
.vt-ps-64 { padding-inline-start: 16rem; }
.vt-ps-72 { padding-inline-start: 18rem; }
.vt-ps-80 { padding-inline-start: 20rem; }
.vt-ps-96 { padding-inline-start: 24rem; }
.vt-ps-0\.5 { padding-inline-start: 0.125rem; }
.vt-ps-1\.5 { padding-inline-start: 0.375rem; }
.vt-pe-0 { padding-inline-end: 0px; }
.vt-pe-1 { padding-inline-end: 0.25rem; }
.vt-pe-2 { padding-inline-end: 0.5rem; }
.vt-pe-3 { padding-inline-end: 0.75rem; }
.vt-pe-4 { padding-inline-end: 1rem; }
.vt-pe-5 { padding-inline-end: 1.25rem; }
.vt-pe-6 { padding-inline-end: 1.5rem; }
.vt-pe-7 { padding-inline-end: 1.75rem; }
.vt-pe-8 { padding-inline-end: 2rem; }
.vt-pe-10 { padding-inline-end: 2.5rem; }
.vt-pe-12 { padding-inline-end: 3rem; }
.vt-pe-14 { padding-inline-end: 3.5rem; }
.vt-pe-16 { padding-inline-end: 4rem; }
.vt-pe-18 { padding-inline-end: 4.5rem; }
.vt-pe-20 { padding-inline-end: 5rem; }
.vt-pe-22 { padding-inline-end: 5.5rem; }
.vt-pe-24 { padding-inline-end: 6rem; }
.vt-pe-28 { padding-inline-end: 7rem; }
.vt-pe-32 { padding-inline-end: 8rem; }
.vt-pe-36 { padding-inline-end: 9rem; }
.vt-pe-40 { padding-inline-end: 10rem; }
.vt-pe-44 { padding-inline-end: 11rem; }
.vt-pe-48 { padding-inline-end: 12rem; }
.vt-pe-52 { padding-inline-end: 13rem; }
.vt-pe-56 { padding-inline-end: 14rem; }
.vt-pe-60 { padding-inline-end: 15rem; }
.vt-pe-64 { padding-inline-end: 16rem; }
.vt-pe-72 { padding-inline-end: 18rem; }
.vt-pe-80 { padding-inline-end: 20rem; }
.vt-pe-96 { padding-inline-end: 24rem; }
.vt-pe-0\.5 { padding-inline-end: 0.125rem; }
.vt-pe-1\.5 { padding-inline-end: 0.375rem; }
.vt-p-0 { padding: 0px; }
.vt-p-1 { padding: 0.25rem; }
.vt-p-2 { padding: 0.5rem; }
.vt-p-3 { padding: 0.75rem; }
.vt-p-4 { padding: 1rem; }
.vt-p-5 { padding: 1.25rem; }
.vt-p-6 { padding: 1.5rem; }
.vt-p-7 { padding: 1.75rem; }
.vt-p-8 { padding: 2rem; }
.vt-p-10 { padding: 2.5rem; }
.vt-p-12 { padding: 3rem; }
.vt-p-14 { padding: 3.5rem; }
.vt-p-16 { padding: 4rem; }
.vt-p-18 { padding: 4.5rem; }
.vt-p-20 { padding: 5rem; }
.vt-p-22 { padding: 5.5rem; }
.vt-p-24 { padding: 6rem; }
.vt-p-28 { padding: 7rem; }
.vt-p-32 { padding: 8rem; }
.vt-p-36 { padding: 9rem; }
.vt-p-40 { padding: 10rem; }
.vt-p-44 { padding: 11rem; }
.vt-p-48 { padding: 12rem; }
.vt-p-52 { padding: 13rem; }
.vt-p-56 { padding: 14rem; }
.vt-p-60 { padding: 15rem; }
.vt-p-64 { padding: 16rem; }
.vt-p-72 { padding: 18rem; }
.vt-p-80 { padding: 20rem; }
.vt-p-96 { padding: 24rem; }
.vt-p-0\.5 { padding: 0.125rem; }
.vt-p-1\.5 { padding: 0.375rem; }
.vt-px-0 { padding-left: 0px; padding-right: 0px; }
.vt-px-1 { padding-left: 0.25rem; padding-right: 0.25rem; }
.vt-px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }
.vt-px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
.vt-px-4 { padding-left: 1rem; padding-right: 1rem; }
.vt-px-5 { padding-left: 1.25rem; padding-right: 1.25rem; }
.vt-px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.vt-px-7 { padding-left: 1.75rem; padding-right: 1.75rem; }
.vt-px-8 { padding-left: 2rem; padding-right: 2rem; }
.vt-px-10 { padding-left: 2.5rem; padding-right: 2.5rem; }
.vt-px-12 { padding-left: 3rem; padding-right: 3rem; }
.vt-px-14 { padding-left: 3.5rem; padding-right: 3.5rem; }
.vt-px-16 { padding-left: 4rem; padding-right: 4rem; }
.vt-px-18 { padding-left: 4.5rem; padding-right: 4.5rem; }
.vt-px-20 { padding-left: 5rem; padding-right: 5rem; }
.vt-px-22 { padding-left: 5.5rem; padding-right: 5.5rem; }
.vt-px-24 { padding-left: 6rem; padding-right: 6rem; }
.vt-px-28 { padding-left: 7rem; padding-right: 7rem; }
.vt-px-32 { padding-left: 8rem; padding-right: 8rem; }
.vt-px-36 { padding-left: 9rem; padding-right: 9rem; }
.vt-px-40 { padding-left: 10rem; padding-right: 10rem; }
.vt-px-44 { padding-left: 11rem; padding-right: 11rem; }
.vt-px-48 { padding-left: 12rem; padding-right: 12rem; }
.vt-px-52 { padding-left: 13rem; padding-right: 13rem; }
.vt-px-56 { padding-left: 14rem; padding-right: 14rem; }
.vt-px-60 { padding-left: 15rem; padding-right: 15rem; }
.vt-px-64 { padding-left: 16rem; padding-right: 16rem; }
.vt-px-72 { padding-left: 18rem; padding-right: 18rem; }
.vt-px-80 { padding-left: 20rem; padding-right: 20rem; }
.vt-px-96 { padding-left: 24rem; padding-right: 24rem; }
.vt-px-0\.5 { padding-left: 0.125rem; padding-right: 0.125rem; }
.vt-px-1\.5 { padding-left: 0.375rem; padding-right: 0.375rem; }
.vt-py-0 { padding-top: 0px; padding-bottom: 0px; }
.vt-py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
.vt-py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.vt-py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.vt-py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.vt-py-5 { padding-top: 1.25rem; padding-bottom: 1.25rem; }
.vt-py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.vt-py-7 { padding-top: 1.75rem; padding-bottom: 1.75rem; }
.vt-py-8 { padding-top: 2rem; padding-bottom: 2rem; }
.vt-py-10 { padding-top: 2.5rem; padding-bottom: 2.5rem; }
.vt-py-12 { padding-top: 3rem; padding-bottom: 3rem; }
.vt-py-14 { padding-top: 3.5rem; padding-bottom: 3.5rem; }
.vt-py-16 { padding-top: 4rem; padding-bottom: 4rem; }
.vt-py-18 { padding-top: 4.5rem; padding-bottom: 4.5rem; }
.vt-py-20 { padding-top: 5rem; padding-bottom: 5rem; }
.vt-py-22 { padding-top: 5.5rem; padding-bottom: 5.5rem; }
.vt-py-24 { padding-top: 6rem; padding-bottom: 6rem; }
.vt-py-28 { padding-top: 7rem; padding-bottom: 7rem; }
.vt-py-32 { padding-top: 8rem; padding-bottom: 8rem; }
.vt-py-36 { padding-top: 9rem; padding-bottom: 9rem; }
.vt-py-40 { padding-top: 10rem; padding-bottom: 10rem; }
.vt-py-44 { padding-top: 11rem; padding-bottom: 11rem; }
.vt-py-48 { padding-top: 12rem; padding-bottom: 12rem; }
.vt-py-52 { padding-top: 13rem; padding-bottom: 13rem; }
.vt-py-56 { padding-top: 14rem; padding-bottom: 14rem; }
.vt-py-60 { padding-top: 15rem; padding-bottom: 15rem; }
.vt-py-64 { padding-top: 16rem; padding-bottom: 16rem; }
.vt-py-72 { padding-top: 18rem; padding-bottom: 18rem; }
.vt-py-80 { padding-top: 20rem; padding-bottom: 20rem; }
.vt-py-96 { padding-top: 24rem; padding-bottom: 24rem; }
.vt-py-0\.5 { padding-top: 0.125rem; padding-bottom: 0.125rem; }
.vt-py-1\.5 { padding-top: 0.375rem; padding-bottom: 0.375rem; }
.vt-pt-0 { padding-top: 0px; }
.vt-pt-1 { padding-top: 0.25rem; }
.vt-pt-2 { padding-top: 0.5rem; }
.vt-pt-3 { padding-top: 0.75rem; }
.vt-pt-4 { padding-top: 1rem; }
.vt-pt-5 { padding-top: 1.25rem; }
.vt-pt-6 { padding-top: 1.5rem; }
.vt-pt-7 { padding-top: 1.75rem; }
.vt-pt-8 { padding-top: 2rem; }
.vt-pt-10 { padding-top: 2.5rem; }
.vt-pt-12 { padding-top: 3rem; }
.vt-pt-14 { padding-top: 3.5rem; }
.vt-pt-16 { padding-top: 4rem; }
.vt-pt-18 { padding-top: 4.5rem; }
.vt-pt-20 { padding-top: 5rem; }
.vt-pt-22 { padding-top: 5.5rem; }
.vt-pt-24 { padding-top: 6rem; }
.vt-pt-28 { padding-top: 7rem; }
.vt-pt-32 { padding-top: 8rem; }
.vt-pt-36 { padding-top: 9rem; }
.vt-pt-40 { padding-top: 10rem; }
.vt-pt-44 { padding-top: 11rem; }
.vt-pt-48 { padding-top: 12rem; }
.vt-pt-52 { padding-top: 13rem; }
.vt-pt-56 { padding-top: 14rem; }
.vt-pt-60 { padding-top: 15rem; }
.vt-pt-64 { padding-top: 16rem; }
.vt-pt-72 { padding-top: 18rem; }
.vt-pt-80 { padding-top: 20rem; }
.vt-pt-96 { padding-top: 24rem; }
.vt-pt-0\.5 { padding-top: 0.125rem; }
.vt-pt-1\.5 { padding-top: 0.375rem; }
.vt-pr-0 { padding-right: 0px; }
.vt-pr-1 { padding-right: 0.25rem; }
.vt-pr-2 { padding-right: 0.5rem; }
.vt-pr-3 { padding-right: 0.75rem; }
.vt-pr-4 { padding-right: 1rem; }
.vt-pr-5 { padding-right: 1.25rem; }
.vt-pr-6 { padding-right: 1.5rem; }
.vt-pr-7 { padding-right: 1.75rem; }
.vt-pr-8 { padding-right: 2rem; }
.vt-pr-10 { padding-right: 2.5rem; }
.vt-pr-12 { padding-right: 3rem; }
.vt-pr-14 { padding-right: 3.5rem; }
.vt-pr-16 { padding-right: 4rem; }
.vt-pr-18 { padding-right: 4.5rem; }
.vt-pr-20 { padding-right: 5rem; }
.vt-pr-22 { padding-right: 5.5rem; }
.vt-pr-24 { padding-right: 6rem; }
.vt-pr-28 { padding-right: 7rem; }
.vt-pr-32 { padding-right: 8rem; }
.vt-pr-36 { padding-right: 9rem; }
.vt-pr-40 { padding-right: 10rem; }
.vt-pr-44 { padding-right: 11rem; }
.vt-pr-48 { padding-right: 12rem; }
.vt-pr-52 { padding-right: 13rem; }
.vt-pr-56 { padding-right: 14rem; }
.vt-pr-60 { padding-right: 15rem; }
.vt-pr-64 { padding-right: 16rem; }
.vt-pr-72 { padding-right: 18rem; }
.vt-pr-80 { padding-right: 20rem; }
.vt-pr-96 { padding-right: 24rem; }
.vt-pr-0\.5 { padding-right: 0.125rem; }
.vt-pr-1\.5 { padding-right: 0.375rem; }
.vt-pb-0 { padding-bottom: 0px; }
.vt-pb-1 { padding-bottom: 0.25rem; }
.vt-pb-2 { padding-bottom: 0.5rem; }
.vt-pb-3 { padding-bottom: 0.75rem; }
.vt-pb-4 { padding-bottom: 1rem; }
.vt-pb-5 { padding-bottom: 1.25rem; }
.vt-pb-6 { padding-bottom: 1.5rem; }
.vt-pb-7 { padding-bottom: 1.75rem; }
.vt-pb-8 { padding-bottom: 2rem; }
.vt-pb-10 { padding-bottom: 2.5rem; }
.vt-pb-12 { padding-bottom: 3rem; }
.vt-pb-14 { padding-bottom: 3.5rem; }
.vt-pb-16 { padding-bottom: 4rem; }
.vt-pb-18 { padding-bottom: 4.5rem; }
.vt-pb-20 { padding-bottom: 5rem; }
.vt-pb-22 { padding-bottom: 5.5rem; }
.vt-pb-24 { padding-bottom: 6rem; }
.vt-pb-28 { padding-bottom: 7rem; }
.vt-pb-32 { padding-bottom: 8rem; }
.vt-pb-36 { padding-bottom: 9rem; }
.vt-pb-40 { padding-bottom: 10rem; }
.vt-pb-44 { padding-bottom: 11rem; }
.vt-pb-48 { padding-bottom: 12rem; }
.vt-pb-52 { padding-bottom: 13rem; }
.vt-pb-56 { padding-bottom: 14rem; }
.vt-pb-60 { padding-bottom: 15rem; }
.vt-pb-64 { padding-bottom: 16rem; }
.vt-pb-72 { padding-bottom: 18rem; }
.vt-pb-80 { padding-bottom: 20rem; }
.vt-pb-96 { padding-bottom: 24rem; }
.vt-pb-0\.5 { padding-bottom: 0.125rem; }
.vt-pb-1\.5 { padding-bottom: 0.375rem; }
.vt-pl-0 { padding-left: 0px; }
.vt-pl-1 { padding-left: 0.25rem; }
.vt-pl-2 { padding-left: 0.5rem; }
.vt-pl-3 { padding-left: 0.75rem; }
.vt-pl-4 { padding-left: 1rem; }
.vt-pl-5 { padding-left: 1.25rem; }
.vt-pl-6 { padding-left: 1.5rem; }
.vt-pl-7 { padding-left: 1.75rem; }
.vt-pl-8 { padding-left: 2rem; }
.vt-pl-10 { padding-left: 2.5rem; }
.vt-pl-12 { padding-left: 3rem; }
.vt-pl-14 { padding-left: 3.5rem; }
.vt-pl-16 { padding-left: 4rem; }
.vt-pl-18 { padding-left: 4.5rem; }
.vt-pl-20 { padding-left: 5rem; }
.vt-pl-22 { padding-left: 5.5rem; }
.vt-pl-24 { padding-left: 6rem; }
.vt-pl-28 { padding-left: 7rem; }
.vt-pl-32 { padding-left: 8rem; }
.vt-pl-36 { padding-left: 9rem; }
.vt-pl-40 { padding-left: 10rem; }
.vt-pl-44 { padding-left: 11rem; }
.vt-pl-48 { padding-left: 12rem; }
.vt-pl-52 { padding-left: 13rem; }
.vt-pl-56 { padding-left: 14rem; }
.vt-pl-60 { padding-left: 15rem; }
.vt-pl-64 { padding-left: 16rem; }
.vt-pl-72 { padding-left: 18rem; }
.vt-pl-80 { padding-left: 20rem; }
.vt-pl-96 { padding-left: 24rem; }
.vt-pl-0\.5 { padding-left: 0.125rem; }
.vt-pl-1\.5 { padding-left: 0.375rem; }
.vt-\!p-0 { padding: 0 !important; }

.vt-w-0 { width: 0px; }
.vt-w-1 { width: 0.25rem; }
.vt-w-2 { width: 0.5rem; }
.vt-w-3 { width: 0.75rem; }
.vt-w-4 { width: 1rem; }
.vt-w-5 { width: 1.25rem; }
.vt-w-6 { width: 1.5rem; }
.vt-w-7 { width: 1.75rem; }
.vt-w-8 { width: 2rem; }
.vt-w-10 { width: 2.5rem; }
.vt-w-12 { width: 3rem; }
.vt-w-14 { width: 3.5rem; }
.vt-w-16 { width: 4rem; }
.vt-w-18 { width: 4.5rem; }
.vt-w-20 { width: 5rem; }
.vt-w-22 { width: 5.5rem; }
.vt-w-24 { width: 6rem; }
.vt-w-28 { width: 7rem; }
.vt-w-32 { width: 8rem; }
.vt-w-36 { width: 9rem; }
.vt-w-40 { width: 10rem; }
.vt-w-44 { width: 11rem; }
.vt-w-48 { width: 12rem; }
.vt-w-52 { width: 13rem; }
.vt-w-56 { width: 14rem; }
.vt-w-60 { width: 15rem; }
.vt-w-64 { width: 16rem; }
.vt-w-72 { width: 18rem; }
.vt-w-80 { width: 20rem; }
.vt-w-96 { width: 24rem; }
.vt-w-0\.5 { width: 0.125rem; }
.vt-w-1\.5 { width: 0.375rem; }
.vt-w-3\.5 { width: 0.875rem; }
.vt-w-px { width: 1px; }
.vt-w-fit { width: fit-content; }
.vt-w-max { width: max-content; }
.vt-w-1\/2 { width: 50%; }
.vt-w-1\/3 { width: 33.333333%; }
.vt-w-2\/3 { width: 66.666667%; }
.vt-w-1\/4 { width: 25%; }
.vt-w-3\/4 { width: 75%; }
.vt-w-1\/5 { width: 20%; }
.vt-w-2\/5 { width: 40%; }
.vt-w-3\/5 { width: 60%; }
.vt-w-4\/5 { width: 80%; }
.vt-w-5\/6 { width: 83.333333%; }
.vt-w-4\/6 { width: 66.666667%; }
.vt-w-5\/12 { width: 41.666667%; }
.vt-w-full { width: 100%; }
.vt-w-auto { width: auto; }
.vt-h-0 { height: 0px; }
.vt-h-1 { height: 0.25rem; }
.vt-h-2 { height: 0.5rem; }
.vt-h-3 { height: 0.75rem; }
.vt-h-4 { height: 1rem; }
.vt-h-5 { height: 1.25rem; }
.vt-h-6 { height: 1.5rem; }
.vt-h-7 { height: 1.75rem; }
.vt-h-8 { height: 2rem; }
.vt-h-10 { height: 2.5rem; }
.vt-h-12 { height: 3rem; }
.vt-h-14 { height: 3.5rem; }
.vt-h-16 { height: 4rem; }
.vt-h-18 { height: 4.5rem; }
.vt-h-20 { height: 5rem; }
.vt-h-22 { height: 5.5rem; }
.vt-h-24 { height: 6rem; }
.vt-h-28 { height: 7rem; }
.vt-h-32 { height: 8rem; }
.vt-h-36 { height: 9rem; }
.vt-h-40 { height: 10rem; }
.vt-h-44 { height: 11rem; }
.vt-h-48 { height: 12rem; }
.vt-h-52 { height: 13rem; }
.vt-h-56 { height: 14rem; }
.vt-h-60 { height: 15rem; }
.vt-h-64 { height: 16rem; }
.vt-h-72 { height: 18rem; }
.vt-h-80 { height: 20rem; }
.vt-h-96 { height: 24rem; }
.vt-h-0\.5 { height: 0.125rem; }
.vt-h-1\.5 { height: 0.375rem; }
.vt-h-3\.5 { height: 0.875rem; }
.vt-h-1\/2 { height: 50%; }
.vt-h-full { height: 100%; }
.vt-h-auto { height: auto; }
.vt-h-screen { height: 100vh; }
.vt-h-px { height: 1px; }
.vt-size-32 { width: 8rem; height: 8rem; }
.vt-min-h-0 { min-height: 0px; }
.vt-min-h-1 { min-height: 0.25rem; }
.vt-min-h-2 { min-height: 0.5rem; }
.vt-min-h-3 { min-height: 0.75rem; }
.vt-min-h-4 { min-height: 1rem; }
.vt-min-h-5 { min-height: 1.25rem; }
.vt-min-h-6 { min-height: 1.5rem; }
.vt-min-h-7 { min-height: 1.75rem; }
.vt-min-h-8 { min-height: 2rem; }
.vt-min-h-10 { min-height: 2.5rem; }
.vt-min-h-12 { min-height: 3rem; }
.vt-min-h-14 { min-height: 3.5rem; }
.vt-min-h-16 { min-height: 4rem; }
.vt-min-h-18 { min-height: 4.5rem; }
.vt-min-h-20 { min-height: 5rem; }
.vt-min-h-22 { min-height: 5.5rem; }
.vt-min-h-24 { min-height: 6rem; }
.vt-min-h-28 { min-height: 7rem; }
.vt-min-h-32 { min-height: 8rem; }
.vt-min-h-36 { min-height: 9rem; }
.vt-min-h-40 { min-height: 10rem; }
.vt-min-h-44 { min-height: 11rem; }
.vt-min-h-48 { min-height: 12rem; }
.vt-min-h-52 { min-height: 13rem; }
.vt-min-h-56 { min-height: 14rem; }
.vt-min-h-60 { min-height: 15rem; }
.vt-min-h-64 { min-height: 16rem; }
.vt-min-h-72 { min-height: 18rem; }
.vt-min-h-80 { min-height: 20rem; }
.vt-min-h-96 { min-height: 24rem; }
.vt-min-h-0\.5 { min-height: 0.125rem; }
.vt-min-h-1\.5 { min-height: 0.375rem; }
.vt-min-h-screen { min-height: 100vh; }
.vt-min-w-0 { min-width: 0px; }
.vt-min-w-5 { min-width: 1.25rem; }
.vt-max-h-72 { max-height: 18rem; }
.vt-max-w-xs { max-width: 20rem; }
.vt-max-w-sm { max-width: 24rem; }
.vt-max-w-md { max-width: 28rem; }
.vt-max-w-lg { max-width: 32rem; }
.vt-max-w-xl { max-width: 36rem; }
.vt-max-w-2xl { max-width: 42rem; }
.vt-max-w-3xl { max-width: 48rem; }
.vt-max-w-4xl { max-width: 56rem; }
.vt-max-w-5xl { max-width: 64rem; }
.vt-max-w-6xl { max-width: 72rem; }

.vt-flex-1 { flex: 1 1 0%; }
.vt-flex-shrink-0, .vt-shrink-0 { flex-shrink: 0; }
.vt-flex-shrink { flex-shrink: 1; }
.vt-flex-col { flex-direction: column; }
.vt-flex-row { flex-direction: row; }
.vt-flex-wrap { flex-wrap: wrap; }
.vt-justify-start { justify-content: flex-start; }
.vt-justify-end { justify-content: flex-end; }
.vt-justify-center { justify-content: center; }
.vt-justify-between { justify-content: space-between; }
.vt-justify-around { justify-content: space-around; }
.vt-items-start { align-items: flex-start; }
.vt-items-end { align-items: flex-end; }
.vt-items-center { align-items: center; }
.vt-items-baseline { align-items: baseline; }
.vt-self-center { align-self: center; }
.vt-to-brand-fill\/70 { --vt-gradient-to: hsl(var(--brand-fill) / 0.7) var(--vt-gradient-to-position); }
.vt-grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.vt-grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vt-grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vt-grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.vt-grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.vt-grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.vt-grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.vt-grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.vt-grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); }
.vt-grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); }
.vt-grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); }
.vt-grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.vt-col-span-1 { grid-column: span 1 / span 1; }
.vt-col-span-2 { grid-column: span 2 / span 2; }
.vt-col-span-3 { grid-column: span 3 / span 3; }
.vt-col-span-4 { grid-column: span 4 / span 4; }
.vt-col-span-5 { grid-column: span 5 / span 5; }
.vt-col-span-6 { grid-column: span 6 / span 6; }
.vt-col-span-full { grid-column: 1 / -1; }
.vt-grid-rows-1 { grid-template-rows: repeat(1, minmax(0, 1fr)); }
.vt-grid-rows-2 { grid-template-rows: repeat(2, minmax(0, 1fr)); }
.vt-grid-rows-3 { grid-template-rows: repeat(3, minmax(0, 1fr)); }
.vt-grid-rows-4 { grid-template-rows: repeat(4, minmax(0, 1fr)); }
.vt-auto-rows-fr { grid-auto-rows: minmax(0, 1fr); }
.vt-place-items-center { place-items: center; }
.vt-gap-0 { gap: 0px; }
.vt-gap-1 { gap: 0.25rem; }
.vt-gap-2 { gap: 0.5rem; }
.vt-gap-3 { gap: 0.75rem; }
.vt-gap-4 { gap: 1rem; }
.vt-gap-5 { gap: 1.25rem; }
.vt-gap-6 { gap: 1.5rem; }
.vt-gap-7 { gap: 1.75rem; }
.vt-gap-8 { gap: 2rem; }
.vt-gap-10 { gap: 2.5rem; }
.vt-gap-12 { gap: 3rem; }
.vt-gap-14 { gap: 3.5rem; }
.vt-gap-16 { gap: 4rem; }
.vt-gap-18 { gap: 4.5rem; }
.vt-gap-20 { gap: 5rem; }
.vt-gap-22 { gap: 5.5rem; }
.vt-gap-24 { gap: 6rem; }
.vt-gap-28 { gap: 7rem; }
.vt-gap-32 { gap: 8rem; }
.vt-gap-36 { gap: 9rem; }
.vt-gap-40 { gap: 10rem; }
.vt-gap-44 { gap: 11rem; }
.vt-gap-48 { gap: 12rem; }
.vt-gap-52 { gap: 13rem; }
.vt-gap-56 { gap: 14rem; }
.vt-gap-60 { gap: 15rem; }
.vt-gap-64 { gap: 16rem; }
.vt-gap-72 { gap: 18rem; }
.vt-gap-80 { gap: 20rem; }
.vt-gap-96 { gap: 24rem; }
.vt-gap-0\.5 { gap: 0.125rem; }
.vt-gap-1\.5 { gap: 0.375rem; }
.vt-gap-x-0 { column-gap: 0px; }
.vt-gap-x-1 { column-gap: 0.25rem; }
.vt-gap-x-2 { column-gap: 0.5rem; }
.vt-gap-x-3 { column-gap: 0.75rem; }
.vt-gap-x-4 { column-gap: 1rem; }
.vt-gap-x-5 { column-gap: 1.25rem; }
.vt-gap-x-6 { column-gap: 1.5rem; }
.vt-gap-x-7 { column-gap: 1.75rem; }
.vt-gap-x-8 { column-gap: 2rem; }
.vt-gap-x-10 { column-gap: 2.5rem; }
.vt-gap-x-12 { column-gap: 3rem; }
.vt-gap-x-14 { column-gap: 3.5rem; }
.vt-gap-x-16 { column-gap: 4rem; }
.vt-gap-x-18 { column-gap: 4.5rem; }
.vt-gap-x-20 { column-gap: 5rem; }
.vt-gap-x-22 { column-gap: 5.5rem; }
.vt-gap-x-24 { column-gap: 6rem; }
.vt-gap-x-28 { column-gap: 7rem; }
.vt-gap-x-32 { column-gap: 8rem; }
.vt-gap-x-36 { column-gap: 9rem; }
.vt-gap-x-40 { column-gap: 10rem; }
.vt-gap-x-44 { column-gap: 11rem; }
.vt-gap-x-48 { column-gap: 12rem; }
.vt-gap-x-52 { column-gap: 13rem; }
.vt-gap-x-56 { column-gap: 14rem; }
.vt-gap-x-60 { column-gap: 15rem; }
.vt-gap-x-64 { column-gap: 16rem; }
.vt-gap-x-72 { column-gap: 18rem; }
.vt-gap-x-80 { column-gap: 20rem; }
.vt-gap-x-96 { column-gap: 24rem; }
.vt-gap-x-0\.5 { column-gap: 0.125rem; }
.vt-gap-x-1\.5 { column-gap: 0.375rem; }
.vt-gap-y-0 { row-gap: 0px; }
.vt-gap-y-1 { row-gap: 0.25rem; }
.vt-gap-y-2 { row-gap: 0.5rem; }
.vt-gap-y-3 { row-gap: 0.75rem; }
.vt-gap-y-4 { row-gap: 1rem; }
.vt-gap-y-5 { row-gap: 1.25rem; }
.vt-gap-y-6 { row-gap: 1.5rem; }
.vt-gap-y-7 { row-gap: 1.75rem; }
.vt-gap-y-8 { row-gap: 2rem; }
.vt-gap-y-10 { row-gap: 2.5rem; }
.vt-gap-y-12 { row-gap: 3rem; }
.vt-gap-y-14 { row-gap: 3.5rem; }
.vt-gap-y-16 { row-gap: 4rem; }
.vt-gap-y-18 { row-gap: 4.5rem; }
.vt-gap-y-20 { row-gap: 5rem; }
.vt-gap-y-22 { row-gap: 5.5rem; }
.vt-gap-y-24 { row-gap: 6rem; }
.vt-gap-y-28 { row-gap: 7rem; }
.vt-gap-y-32 { row-gap: 8rem; }
.vt-gap-y-36 { row-gap: 9rem; }
.vt-gap-y-40 { row-gap: 10rem; }
.vt-gap-y-44 { row-gap: 11rem; }
.vt-gap-y-48 { row-gap: 12rem; }
.vt-gap-y-52 { row-gap: 13rem; }
.vt-gap-y-56 { row-gap: 14rem; }
.vt-gap-y-60 { row-gap: 15rem; }
.vt-gap-y-64 { row-gap: 16rem; }
.vt-gap-y-72 { row-gap: 18rem; }
.vt-gap-y-80 { row-gap: 20rem; }
.vt-gap-y-96 { row-gap: 24rem; }
.vt-gap-y-0\.5 { row-gap: 0.125rem; }
.vt-gap-y-1\.5 { row-gap: 0.375rem; }

.vt-space-y-0 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(0px * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(0px * var(--vt-space-y-reverse)); }
.vt-space-y-1 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(0.25rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(0.25rem * var(--vt-space-y-reverse)); }
.vt-space-y-2 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(0.5rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(0.5rem * var(--vt-space-y-reverse)); }
.vt-space-y-3 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(0.75rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(0.75rem * var(--vt-space-y-reverse)); }
.vt-space-y-4 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(1rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(1rem * var(--vt-space-y-reverse)); }
.vt-space-y-5 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(1.25rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(1.25rem * var(--vt-space-y-reverse)); }
.vt-space-y-6 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(1.5rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(1.5rem * var(--vt-space-y-reverse)); }
.vt-space-y-7 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(1.75rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(1.75rem * var(--vt-space-y-reverse)); }
.vt-space-y-8 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(2rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(2rem * var(--vt-space-y-reverse)); }
.vt-space-y-10 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(2.5rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(2.5rem * var(--vt-space-y-reverse)); }
.vt-space-y-12 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(3rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(3rem * var(--vt-space-y-reverse)); }
.vt-space-y-14 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(3.5rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(3.5rem * var(--vt-space-y-reverse)); }
.vt-space-y-16 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(4rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(4rem * var(--vt-space-y-reverse)); }
.vt-space-y-18 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(4.5rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(4.5rem * var(--vt-space-y-reverse)); }
.vt-space-y-20 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(5rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(5rem * var(--vt-space-y-reverse)); }
.vt-space-y-22 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(5.5rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(5.5rem * var(--vt-space-y-reverse)); }
.vt-space-y-24 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(6rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(6rem * var(--vt-space-y-reverse)); }
.vt-space-y-28 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(7rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(7rem * var(--vt-space-y-reverse)); }
.vt-space-y-32 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(8rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(8rem * var(--vt-space-y-reverse)); }
.vt-space-y-36 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(9rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(9rem * var(--vt-space-y-reverse)); }
.vt-space-y-40 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(10rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(10rem * var(--vt-space-y-reverse)); }
.vt-space-y-44 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(11rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(11rem * var(--vt-space-y-reverse)); }
.vt-space-y-48 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(12rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(12rem * var(--vt-space-y-reverse)); }
.vt-space-y-52 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(13rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(13rem * var(--vt-space-y-reverse)); }
.vt-space-y-56 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(14rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(14rem * var(--vt-space-y-reverse)); }
.vt-space-y-60 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(15rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(15rem * var(--vt-space-y-reverse)); }
.vt-space-y-64 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(16rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(16rem * var(--vt-space-y-reverse)); }
.vt-space-y-72 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(18rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(18rem * var(--vt-space-y-reverse)); }
.vt-space-y-80 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(20rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(20rem * var(--vt-space-y-reverse)); }
.vt-space-y-96 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(24rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(24rem * var(--vt-space-y-reverse)); }
.vt-space-y-0\.5 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(0.125rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(0.125rem * var(--vt-space-y-reverse)); }
.vt-space-y-1\.5 > :not([hidden]) ~ :not([hidden]) { --vt-space-y-reverse: 0; margin-top: calc(0.375rem * calc(1 - var(--vt-space-y-reverse))); margin-bottom: calc(0.375rem * var(--vt-space-y-reverse)); }
.vt--space-x-2 > :not([hidden]) ~ :not([hidden]) { --vt-space-x-reverse: 0; margin-right: calc(-0.5rem * var(--vt-space-x-reverse)); margin-left: calc(-0.5rem * calc(1 - var(--vt-space-x-reverse))); }
.vt--space-x-3 > :not([hidden]) ~ :not([hidden]) { --vt-space-x-reverse: 0; margin-right: calc(-0.75rem * var(--vt-space-x-reverse)); margin-left: calc(-0.75rem * calc(1 - var(--vt-space-x-reverse))); }
.vt--space-x-4 > :not([hidden]) ~ :not([hidden]) { --vt-space-x-reverse: 0; margin-right: calc(-1rem * var(--vt-space-x-reverse)); margin-left: calc(-1rem * calc(1 - var(--vt-space-x-reverse))); }
.vt--space-x-1\.5 > :not([hidden]) ~ :not([hidden]) { --vt-space-x-reverse: 0; margin-right: calc(-0.375rem * var(--vt-space-x-reverse)); margin-left: calc(-0.375rem * calc(1 - var(--vt-space-x-reverse))); }

.vt-divide-y > :not([hidden]) ~ :not([hidden]) { --vt-divide-y-reverse: 0; border-top-width: calc(1px * calc(1 - var(--vt-divide-y-reverse))); border-bottom-width: calc(1px * var(--vt-divide-y-reverse)); }
.vt-divide-border-default > :not([hidden]) ~ :not([hidden]) { border-color: hsl(var(--border-default)); }

.vt-border-0 { border-width: 0px; }
.vt-border { border-width: 1px; }
.vt-border-2 { border-width: 2px; }
.vt-border-4 { border-width: 4px; }
.vt-border-8 { border-width: 8px; }
.vt-border-\[1\.5px\] { border-width: 1.5px; }
.vt-border-\[3px\] { border-width: 3px; }
.vt-border-b { border-bottom-width: 1px; }
.vt-border-b-2 { border-bottom-width: 2px; }
.vt-border-l { border-left-width: 1px; }
.vt-border-l-2 { border-left-width: 2px; }
.vt-border-l-4 { border-left-width: 4px; }
.vt-border-r { border-right-width: 1px; }
.vt-border-t { border-top-width: 1px; }
.vt-border-none { border-style: none; }
.vt-border-dashed { border-style: dashed; }
.vt-border-collapse { border-collapse: collapse; }
.vt-border-border-default { border-color: hsl(var(--border-default)); }
.vt-border-border-default\/50 { border-color: hsl(var(--border-default) / 0.5); }
.vt-border-border-strong { border-color: hsl(var(--border-strong)); }
.vt-border-brand-fill { border-color: hsl(var(--brand-fill)); }
.vt-border-brand-fill\/30 { border-color: hsl(var(--brand-fill) / 0.3); }
.vt-border-info-fill { border-color: hsl(var(--info-fill)); }
.vt-border-info-fill\/30 { border-color: hsl(var(--info-fill) / 0.3); }
.vt-border-success-fill { border-color: hsl(var(--success-fill)); }
.vt-border-success-fill\/30 { border-color: hsl(var(--success-fill) / 0.3); }
.vt-border-warning-fill { border-color: hsl(var(--warning-fill)); }
.vt-border-warning-fill\/30 { border-color: hsl(var(--warning-fill) / 0.3); }
.vt-border-error-fill { border-color: hsl(var(--error-fill)); }
.vt-border-error-fill\/30 { border-color: hsl(var(--error-fill) / 0.3); }
.vt-border-error-fill\/50 { border-color: hsl(var(--error-fill) / 0.5); }
.vt-border-input { border-color: hsl(var(--border-default)); }
.vt-border-surface-page { border-color: hsl(var(--surface-page)); }
.vt-border-surface-card { border-color: hsl(var(--surface-card)); }
.vt-border-foreground-muted\/30 { border-color: hsl(var(--foreground-muted) / 0.3); }
.vt-border-transparent { border-color: transparent; }
.vt-border-current { border-color: currentColor; }
.vt-border-white\/10 { border-color: rgba(255,255,255,0.1); }
.vt-border-white\/20 { border-color: rgba(255,255,255,0.2); }
.vt-border-b-brand-fill { border-bottom-color: hsl(var(--brand-fill)); }
.vt-border-b-info-fill { border-bottom-color: hsl(var(--info-fill)); }
.vt-border-b-border-default { border-bottom-color: hsl(var(--border-default)); }
.vt-border-b-surface-card { border-bottom-color: hsl(var(--surface-card)); }
.vt-border-l-brand-fill { border-left-color: hsl(var(--brand-fill)); }
.vt-border-l-info-fill { border-left-color: hsl(var(--info-fill)); }
.vt-border-l-success-fill { border-left-color: hsl(var(--success-fill)); }
.vt-border-l-warning-fill { border-left-color: hsl(var(--warning-fill)); }
.vt-border-l-error-fill { border-left-color: hsl(var(--error-fill)); }
.vt-border-r-brand-fill { border-right-color: hsl(var(--brand-fill)); }
.vt-border-r-info-fill { border-right-color: hsl(var(--info-fill)); }
.vt-border-t-brand-fill { border-top-color: hsl(var(--brand-fill)); }
.vt-border-t-info-fill { border-top-color: hsl(var(--info-fill)); }
.vt-border-t-error-fill { border-top-color: hsl(var(--error-fill)); }

.vt-rounded { border-radius: 0.25rem; }
.vt-rounded-2xs { border-radius: var(--radius-2xs); }
.vt-rounded-xs { border-radius: var(--radius-xs); }
.vt-rounded-sm { border-radius: var(--radius-sm); }
.vt-rounded-md { border-radius: var(--radius-md); }
.vt-rounded-lg { border-radius: var(--radius-lg); }
.vt-rounded-xl { border-radius: var(--radius-xl); }
.vt-rounded-2xl { border-radius: var(--radius-2xl); }
.vt-rounded-3xl { border-radius: var(--radius-3xl); }
.vt-rounded-4xl { border-radius: var(--radius-4xl); }
.vt-rounded-full { border-radius: 9999px; }
.vt-rounded-none { border-radius: 0; }
.vt-rounded-concentric-3 { border-radius: calc(var(--radius-2xl) - var(--spacing-3)); }
.vt-rounded-t { border-top-left-radius: 0.25rem; border-top-right-radius: 0.25rem; }
.vt-rounded-t-md { border-top-left-radius: var(--radius-md); border-top-right-radius: var(--radius-md); }
.vt-rounded-t-lg { border-top-left-radius: var(--radius-lg); border-top-right-radius: var(--radius-lg); }
.vt-rounded-t-xl { border-top-left-radius: var(--radius-xl); border-top-right-radius: var(--radius-xl); }
.vt-rounded-t-2xl { border-top-left-radius: var(--radius-2xl); border-top-right-radius: var(--radius-2xl); }
.vt-rounded-bl-sm { border-bottom-left-radius: var(--radius-sm); }
.vt-rounded-bl-md { border-bottom-left-radius: 0.375rem; }
.vt-rounded-br { border-bottom-right-radius: 0.25rem; }
.vt-rounded-br-sm { border-bottom-right-radius: var(--radius-sm); }
.vt-rounded-br-md { border-bottom-right-radius: 0.375rem; }

.vt-bg-surface-page { background-color: hsl(var(--surface-page)); }
.vt-bg-surface-page\/80 { background-color: hsl(var(--surface-page) / 0.8); }
.vt-bg-surface-card { background-color: hsl(var(--surface-card)); }
.vt-bg-surface-card\/80 { background-color: hsl(var(--surface-card) / 0.8); }
.vt-bg-surface-card\/90 { background-color: hsl(var(--surface-card) / 0.9); }
.vt-bg-surface-moderate { background-color: hsl(var(--surface-moderate)); }
.vt-bg-surface-moderate\/30 { background-color: hsl(var(--surface-moderate) / 0.3); }
.vt-bg-surface-moderate\/50 { background-color: hsl(var(--surface-moderate) / 0.5); }
.vt-bg-surface-subtle { background-color: hsl(var(--surface-subtle)); }
.vt-bg-surface-subtle\/50 { background-color: hsl(var(--surface-subtle) / 0.5); }
.vt-bg-border-default { background-color: hsl(var(--border-default)); }
.vt-bg-generic-white { background-color: hsl(var(--generic-white)); }
.vt-bg-generic-white\/20 { background-color: hsl(var(--generic-white) / 0.2); }
.vt-bg-foreground-disabled { background-color: hsl(var(--foreground-disabled)); }
.vt-bg-foreground-primary\/10 { background-color: hsl(var(--foreground-primary) / 0.1); }
.vt-bg-foreground-primary\/20 { background-color: hsl(var(--foreground-primary) / 0.2); }
.vt-bg-foreground-primary\/50 { background-color: hsl(var(--foreground-primary) / 0.5); }
.vt-bg-foreground-muted { background-color: hsl(var(--foreground-muted)); }
.vt-bg-foreground-muted\/10 { background-color: hsl(var(--foreground-muted) / 0.1); }
.vt-bg-foreground-muted\/20 { background-color: hsl(var(--foreground-muted) / 0.2); }
.vt-bg-brand-fill { background-color: hsl(var(--brand-fill)); }
.vt-bg-brand-fill\/5 { background-color: hsl(var(--brand-fill) / 0.05); }
.vt-bg-brand-fill\/10 { background-color: hsl(var(--brand-fill) / 0.1); }
.vt-bg-brand-fill\/15 { background-color: hsl(var(--brand-fill) / 0.15); }
.vt-bg-brand-fill\/20 { background-color: hsl(var(--brand-fill) / 0.2); }
.vt-bg-brand-fill\/30 { background-color: hsl(var(--brand-fill) / 0.3); }
.vt-bg-brand-fill\/50 { background-color: hsl(var(--brand-fill) / 0.5); }
.vt-bg-info-fill { background-color: hsl(var(--info-fill)); }
.vt-bg-info-fill\/5 { background-color: hsl(var(--info-fill) / 0.05); }
.vt-bg-info-fill\/10 { background-color: hsl(var(--info-fill) / 0.1); }
.vt-bg-info-fill\/15 { background-color: hsl(var(--info-fill) / 0.15); }
.vt-bg-info-fill\/20 { background-color: hsl(var(--info-fill) / 0.2); }
.vt-bg-info-fill\/30 { background-color: hsl(var(--info-fill) / 0.3); }
.vt-bg-info-fill\/50 { background-color: hsl(var(--info-fill) / 0.5); }
.vt-bg-success-fill { background-color: hsl(var(--success-fill)); }
.vt-bg-success-fill\/10 { background-color: hsl(var(--success-fill) / 0.1); }
.vt-bg-success-fill\/15 { background-color: hsl(var(--success-fill) / 0.15); }
.vt-bg-success-fill\/20 { background-color: hsl(var(--success-fill) / 0.2); }
.vt-bg-success-fill\/50 { background-color: hsl(var(--success-fill) / 0.5); }
.vt-bg-warning-fill { background-color: hsl(var(--warning-fill)); }
.vt-bg-warning-fill\/10 { background-color: hsl(var(--warning-fill) / 0.1); }
.vt-bg-warning-fill\/15 { background-color: hsl(var(--warning-fill) / 0.15); }
.vt-bg-warning-fill\/20 { background-color: hsl(var(--warning-fill) / 0.2); }
.vt-bg-warning-fill\/50 { background-color: hsl(var(--warning-fill) / 0.5); }
.vt-bg-error-fill { background-color: hsl(var(--error-fill)); }
.vt-bg-error-fill\/10 { background-color: hsl(var(--error-fill) / 0.1); }
.vt-bg-error-fill\/15 { background-color: hsl(var(--error-fill) / 0.15); }
.vt-bg-error-fill\/30 { background-color: hsl(var(--error-fill) / 0.3); }
.vt-bg-error-fill\/50 { background-color: hsl(var(--error-fill) / 0.5); }
.vt-bg-brand-tint { background-color: hsl(var(--brand-fill) / 0.1); }
.vt-bg-info-surface { background-color: hsl(var(--info-surface)); }
.vt-bg-warning-surface { background-color: hsl(var(--warning-surface)); }
.vt-bg-error-surface { background-color: hsl(var(--error-surface)); }
.vt-bg-generic-black\/20 { background-color: hsl(var(--generic-black) / 0.2); }
.vt-bg-generic-black\/30 { background-color: hsl(var(--generic-black) / 0.3); }
.vt-bg-generic-black\/50 { background-color: hsl(var(--generic-black) / 0.5); }
.vt-bg-border-strong { background-color: hsl(var(--border-strong)); }
.vt-bg-foreground-disabled\/20 { background-color: hsl(var(--foreground-disabled) / 0.2); }
.vt-bg-transparent { background-color: transparent; }
.vt-bg-current { background-color: currentColor; }
.\!bg-transparent { background-color: transparent !important; }
.vt-bg-blue-500 { background-color: rgb(59 130 246); }
.vt-bg-blue-600 { background-color: rgb(37 99 235); }
.vt-bg-green-500 { background-color: rgb(34 197 94); }
.vt-bg-purple-500 { background-color: rgb(168 85 247); }
.vt-bg-white { background-color: rgb(255 255 255); }
.vt-bg-white\/15 { background-color: rgba(255,255,255,0.15); }
.vt-bg-white\/20 { background-color: rgba(255,255,255,0.2); }
.vt-bg-white\/30 { background-color: rgba(255,255,255,0.3); }
.vt-bg-white\/40 { background-color: rgba(255,255,255,0.4); }
.vt-bg-white\/50 { background-color: rgba(255,255,255,0.5); }
.vt-bg-black\/30 { background-color: rgba(0,0,0,0.3); }
.vt-bg-info\/10 { background-color: hsl(var(--info-fill) / 0.1); }
.vt-bg-success\/10 { background-color: hsl(var(--success-fill) / 0.1); }

.vt-bg-gradient-to-t { background-image: linear-gradient(to top, var(--vt-gradient-stops)); }
.vt-bg-gradient-to-b { background-image: linear-gradient(to bottom, var(--vt-gradient-stops)); }
.vt-bg-gradient-to-br { background-image: linear-gradient(to bottom right, var(--vt-gradient-stops)); }
.vt-from-brand-tint { --vt-gradient-from: hsl(var(--brand-fill) / 0.1) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--brand-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-info-surface { --vt-gradient-from: hsl(var(--info-surface)) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--info-surface) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-info-fill { --vt-gradient-from: hsl(var(--info-fill)) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--info-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-to-info-fill\/70 { --vt-gradient-to: hsl(var(--info-fill) / 0.7) var(--vt-gradient-to-position); }
.vt-via-success-surface { --vt-gradient-to: hsl(var(--success-surface) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), hsl(var(--success-surface)) var(--vt-gradient-via-position), var(--vt-gradient-to); }
.vt-to-warning-surface { --vt-gradient-to: hsl(var(--warning-surface)) var(--vt-gradient-to-position); }
.vt-from-brand-fill { --vt-gradient-from: hsl(var(--brand-fill)) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--brand-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-success-fill { --vt-gradient-from: hsl(var(--success-fill)) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--success-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-warning-fill { --vt-gradient-from: hsl(var(--warning-fill)) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--warning-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-error-fill { --vt-gradient-from: hsl(var(--error-fill)) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--error-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-brand-fill\/20 { --vt-gradient-from: hsl(var(--brand-fill) / 0.2) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--brand-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-info-fill\/10 { --vt-gradient-from: hsl(var(--info-fill) / 0.1) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--info-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-info-fill\/20 { --vt-gradient-from: hsl(var(--info-fill) / 0.2) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--info-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-info-fill\/30 { --vt-gradient-from: hsl(var(--info-fill) / 0.3) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--info-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-success-fill\/20 { --vt-gradient-from: hsl(var(--success-fill) / 0.2) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--success-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-success-fill\/30 { --vt-gradient-from: hsl(var(--success-fill) / 0.3) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--success-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-warning-fill\/20 { --vt-gradient-from: hsl(var(--warning-fill) / 0.2) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--warning-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-warning-fill\/30 { --vt-gradient-from: hsl(var(--warning-fill) / 0.3) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--warning-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-error-fill\/20 { --vt-gradient-from: hsl(var(--error-fill) / 0.2) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--error-fill) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-surface-strong\/20 { --vt-gradient-from: hsl(var(--surface-strong) / 0.2) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--surface-strong) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-surface-strong\/40 { --vt-gradient-from: hsl(var(--surface-strong) / 0.4) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--surface-strong) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-from-generic-black\/80 { --vt-gradient-from: hsl(var(--generic-black) / 0.8) var(--vt-gradient-from-position); --vt-gradient-to: hsl(var(--generic-black) / 0) var(--vt-gradient-to-position); --vt-gradient-stops: var(--vt-gradient-from), var(--vt-gradient-to); }
.vt-to-brand-fill\/5 { --vt-gradient-to: hsl(var(--brand-fill) / 0.05) var(--vt-gradient-to-position); }
.vt-to-brand-fill\/20 { --vt-gradient-to: hsl(var(--brand-fill) / 0.2) var(--vt-gradient-to-position); }
.vt-to-info-fill\/5 { --vt-gradient-to: hsl(var(--info-fill) / 0.05) var(--vt-gradient-to-position); }
.vt-to-info-fill\/10 { --vt-gradient-to: hsl(var(--info-fill) / 0.1) var(--vt-gradient-to-position); }
.vt-to-info-fill\/20 { --vt-gradient-to: hsl(var(--info-fill) / 0.2) var(--vt-gradient-to-position); }
.vt-to-info-fill\/60 { --vt-gradient-to: hsl(var(--info-fill) / 0.6) var(--vt-gradient-to-position); }
.vt-to-success-fill\/5 { --vt-gradient-to: hsl(var(--success-fill) / 0.05) var(--vt-gradient-to-position); }
.vt-to-success-fill\/10 { --vt-gradient-to: hsl(var(--success-fill) / 0.1) var(--vt-gradient-to-position); }
.vt-to-warning-fill\/5 { --vt-gradient-to: hsl(var(--warning-fill) / 0.05) var(--vt-gradient-to-position); }
.vt-to-warning-fill\/10 { --vt-gradient-to: hsl(var(--warning-fill) / 0.1) var(--vt-gradient-to-position); }
.vt-to-warning-fill\/50 { --vt-gradient-to: hsl(var(--warning-fill) / 0.5) var(--vt-gradient-to-position); }
.vt-to-error-fill\/5 { --vt-gradient-to: hsl(var(--error-fill) / 0.05) var(--vt-gradient-to-position); }
.vt-to-surface-strong\/5 { --vt-gradient-to: hsl(var(--surface-strong) / 0.05) var(--vt-gradient-to-position); }
.vt-to-surface-strong\/10 { --vt-gradient-to: hsl(var(--surface-strong) / 0.1) var(--vt-gradient-to-position); }
.vt-to-surface-page { --vt-gradient-to: hsl(var(--surface-page)) var(--vt-gradient-to-position); }
.vt-to-transparent { --vt-gradient-to: transparent var(--vt-gradient-to-position); }

.vt-text-foreground-primary { color: hsl(var(--foreground-primary)); }
.vt-text-foreground-primary\/60 { color: hsl(var(--foreground-primary) / 0.6); }
.vt-text-foreground-secondary { color: hsl(var(--foreground-secondary)); }
.vt-text-foreground-muted { color: hsl(var(--foreground-muted)); }
.vt-text-foreground-disabled { color: hsl(var(--foreground-disabled)); }
.vt-text-foreground-disabled\/20 { color: hsl(var(--foreground-disabled) / 0.2); }
.vt-text-foreground-disabled\/30 { color: hsl(var(--foreground-disabled) / 0.3); }
.vt-text-foreground-disabled\/40 { color: hsl(var(--foreground-disabled) / 0.4); }
.vt-text-foreground-disabled\/50 { color: hsl(var(--foreground-disabled) / 0.5); }
.vt-text-foreground-disabled\/60 { color: hsl(var(--foreground-disabled) / 0.6); }
.vt-text-generic-white { color: hsl(var(--generic-white)); }
.vt-text-generic-white\/70 { color: hsl(var(--generic-white) / 0.7); }
.vt-text-generic-white\/80 { color: hsl(var(--generic-white) / 0.8); }
.vt-text-brand-fill { color: hsl(var(--brand-fill)); }
.vt-text-brand-fill\/40 { color: hsl(var(--brand-fill) / 0.4); }
.vt-text-brand-fill\/60 { color: hsl(var(--brand-fill) / 0.6); }
.vt-text-info-fill { color: hsl(var(--info-fill)); }
.vt-text-info-fill\/40 { color: hsl(var(--info-fill) / 0.4); }
.vt-text-info-fill\/60 { color: hsl(var(--info-fill) / 0.6); }
.vt-text-success-fill { color: hsl(var(--success-fill)); }
.vt-text-success-fill\/40 { color: hsl(var(--success-fill) / 0.4); }
.vt-text-error-fill { color: hsl(var(--error-fill)); }
.vt-text-error-fill\/40 { color: hsl(var(--error-fill) / 0.4); }
.vt-text-error-fill\/60 { color: hsl(var(--error-fill) / 0.6); }
.vt-text-warning-fill { color: hsl(var(--warning-fill)); }
.vt-text-warning-fill\/40 { color: hsl(var(--warning-fill) / 0.4); }
.vt-text-warning-fill\/60 { color: hsl(var(--warning-fill) / 0.6); }
.vt-text-white { color: rgb(255 255 255); }
.vt-text-info { color: hsl(var(--info-fill)); }
.vt-text-success { color: hsl(var(--success-fill)); }
.vt-text-foreground-muted\/20 { color: hsl(var(--foreground-muted) / 0.2); }
.vt-text-foreground-muted\/30 { color: hsl(var(--foreground-muted) / 0.3); }
.vt-text-foreground-muted\/40 { color: hsl(var(--foreground-muted) / 0.4); }
.vt-text-foreground-muted\/50 { color: hsl(var(--foreground-muted) / 0.5); }
.vt-text-foreground-muted\/60 { color: hsl(var(--foreground-muted) / 0.6); }
.vt-text-xs { font-size: 0.75rem; line-height: 1rem; }
.vt-text-sm { font-size: 0.875rem; line-height: 1.25rem; }
.vt-text-base { font-size: 1rem; line-height: 1.5rem; }
.vt-text-lg { font-size: 1.125rem; line-height: 1.75rem; }
.vt-text-xl { font-size: 1.25rem; line-height: 1.75rem; }
.vt-text-2xl { font-size: 1.5rem; line-height: 2rem; }
.vt-text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
.vt-text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
.vt-text-5xl { font-size: 3rem; line-height: 1; }
.vt-text-left { text-align: left; }
.vt-text-center { text-align: center; }
.vt-text-right { text-align: right; }
.vt-text-start { text-align: start; }
.vt-text-end { text-align: end; }
.vt-font-normal { font-weight: 400; }
.vt-font-medium { font-weight: 500; }
.vt-font-semibold { font-weight: 600; }
.vt-font-bold { font-weight: 700; }
.vt-font-extrabold { font-weight: 800; }
.vt-font-black { font-weight: 900; }
.vt-font-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
.vt-font-sans { font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; }
.vt-leading-none { line-height: 1; }
.vt-leading-tight { line-height: 1.25; }
.vt-leading-snug { line-height: 1.375; }
.vt-leading-relaxed { line-height: 1.625; }
.vt-tracking-tight { letter-spacing: -0.025em; }
.vt-tracking-wider { letter-spacing: 0.05em; }
.vt-uppercase { text-transform: uppercase; }
.vt-lowercase { text-transform: lowercase; }
.vt-capitalize { text-transform: capitalize; }
.vt-italic { font-style: italic; }
.vt-underline { text-decoration-line: underline; }
.vt-line-through { text-decoration-line: line-through; }
.vt-no-underline { text-decoration-line: none; }
.vt-underline-offset-2 { text-underline-offset: 2px; }
.vt-underline-offset-4 { text-underline-offset: 4px; }
.vt-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vt-whitespace-nowrap { white-space: nowrap; }
.vt-break-words { overflow-wrap: break-word; }
.vt-break-all { word-break: break-all; }
.vt-list-disc { list-style-type: disc; }
.vt-list-decimal { list-style-type: decimal; }
.vt-list-inside { list-style-position: inside; }
.vt-tabular-nums { --vt-numeric-spacing: tabular-nums; font-variant-numeric: var(--vt-ordinal) var(--vt-slashed-zero) var(--vt-numeric-figure) var(--vt-numeric-spacing) var(--vt-numeric-fraction); }
.vt-fill-current { fill: currentColor; }
.vt-object-cover { object-fit: cover; }
.vt-align-top { vertical-align: top; }

.vt-shadow-sm { --vt-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); box-shadow: var(--vt-ring-offset-shadow, 0 0 #0000), var(--vt-ring-shadow, 0 0 #0000), var(--vt-shadow); }
.vt-shadow { --vt-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); box-shadow: var(--vt-ring-offset-shadow, 0 0 #0000), var(--vt-ring-shadow, 0 0 #0000), var(--vt-shadow); }
.vt-shadow-md { --vt-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); box-shadow: var(--vt-ring-offset-shadow, 0 0 #0000), var(--vt-ring-shadow, 0 0 #0000), var(--vt-shadow); }
.vt-shadow-lg { --vt-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); box-shadow: var(--vt-ring-offset-shadow, 0 0 #0000), var(--vt-ring-shadow, 0 0 #0000), var(--vt-shadow); }
.vt-shadow-xl { --vt-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); box-shadow: var(--vt-ring-offset-shadow, 0 0 #0000), var(--vt-ring-shadow, 0 0 #0000), var(--vt-shadow); }
.vt-shadow-2xl { --vt-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); box-shadow: var(--vt-ring-offset-shadow, 0 0 #0000), var(--vt-ring-shadow, 0 0 #0000), var(--vt-shadow); }
.vt-shadow-inner { --vt-shadow: inset 0 2px 4px 0 rgb(0 0 0 / 0.05); box-shadow: var(--vt-ring-offset-shadow, 0 0 #0000), var(--vt-ring-shadow, 0 0 #0000), var(--vt-shadow); }
.vt-shadow-none { --vt-shadow: 0 0 #0000; box-shadow: var(--vt-ring-offset-shadow, 0 0 #0000), var(--vt-ring-shadow, 0 0 #0000), var(--vt-shadow); }

.vt-ring-2 { --vt-ring-offset-shadow: var(--vt-ring-inset) 0 0 0 var(--vt-ring-offset-width) var(--vt-ring-offset-color); --vt-ring-shadow: var(--vt-ring-inset) 0 0 0 calc(2px + var(--vt-ring-offset-width)) var(--vt-ring-color); box-shadow: var(--vt-ring-offset-shadow), var(--vt-ring-shadow), var(--vt-shadow, 0 0 #0000); }
.vt-ring-4 { --vt-ring-offset-shadow: var(--vt-ring-inset) 0 0 0 var(--vt-ring-offset-width) var(--vt-ring-offset-color); --vt-ring-shadow: var(--vt-ring-inset) 0 0 0 calc(4px + var(--vt-ring-offset-width)) var(--vt-ring-color); box-shadow: var(--vt-ring-offset-shadow), var(--vt-ring-shadow), var(--vt-shadow, 0 0 #0000); }
.vt-ring-brand-fill { --vt-ring-color: hsl(var(--brand-fill)); }
.vt-ring-brand-fill\/20 { --vt-ring-color: hsl(var(--brand-fill) / 0.2); }
.vt-ring-info-fill { --vt-ring-color: hsl(var(--info-fill)); }
.vt-ring-surface-page { --vt-ring-color: hsl(var(--surface-page)); }
.vt-ring-info\/20 { --vt-ring-color: hsl(var(--info-fill) / 0.2); }
.vt-ring-primary\/20 { --vt-ring-color: hsl(var(--brand-fill) / 0.2); }
.vt-ring-offset-1 { --vt-ring-offset-width: 1px; }
.vt-ring-offset-2 { --vt-ring-offset-width: 2px; }
.vt-ring-offset-surface-page { --vt-ring-offset-color: hsl(var(--surface-page)); }

.vt-opacity-0 { opacity: 0; }
.vt-opacity-25 { opacity: 0.25; }
.vt-opacity-30 { opacity: 0.3; }
.vt-opacity-50 { opacity: 0.5; }
.vt-opacity-70 { opacity: 0.7; }
.vt-opacity-75 { opacity: 0.75; }
.vt-opacity-80 { opacity: 0.8; }
.vt-opacity-90 { opacity: 0.9; }
.vt-transform { transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
.vt--translate-y-1\/2 { --vt-translate-y: -50%; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
.vt--translate-x-1\/2 { --vt-translate-x: -50%; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
.vt--translate-x-full { --vt-translate-x: -100%; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
.vt-translate-x-full { --vt-translate-x: 100%; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
.vt-translate-x-0 { --vt-translate-x: 0; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
.vt-translate-y-0\.5 { --vt-translate-y: 0.125rem; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
.vt-translate-y-24 { --vt-translate-y: 6rem; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
.vt-rotate-45 { --vt-rotate: 45deg; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
.vt-rotate-12 { --vt-rotate: 12deg; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
.vt--rotate-12 { --vt-rotate: -12deg; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
.vt-rotate-90 { --vt-rotate: 90deg; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
.vt--rotate-90 { --vt-rotate: -90deg; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
.vt-rotate-180 { --vt-rotate: 180deg; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }

.vt-transition { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
.vt-transition-all { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
.vt-transition-colors { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
.vt-transition-opacity { transition-property: opacity; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
.vt-transition-shadow { transition-property: box-shadow; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
.vt-transition-transform { transition-property: transform; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
.vt-duration-200 { transition-duration: 200ms; }
.vt-duration-300 { transition-duration: 300ms; }
.vt-ease-in-out { transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
.vt-ease-out { transition-timing-function: cubic-bezier(0, 0, 0.2, 1); }
@keyframes vt-spin { to { transform: rotate(360deg); } }
@keyframes vt-ping { 75%, 100% { transform: scale(2); opacity: 0; } }
@keyframes vt-pulse { 50% { opacity: 0.5; } }
.vt-animate-spin { animation: vt-spin 1s linear infinite; }
.vt-animate-ping { animation: vt-ping 1s cubic-bezier(0, 0, 0.2, 1) infinite; }
.vt-animate-pulse { animation: vt-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; }

.vt-overflow-auto { overflow: auto; }
.vt-overflow-hidden { overflow: hidden; }
.vt-overflow-visible { overflow: visible; }
.vt-overflow-x-auto { overflow-x: auto; }
.vt-overflow-y-auto { overflow-y: auto; }
.vt-overflow-y-hidden { overflow-y: hidden; }
.vt-cursor-pointer { cursor: pointer; }
.vt-cursor-not-allowed { cursor: not-allowed; }
.vt-cursor-col-resize { cursor: col-resize; }
.vt-cursor-row-resize { cursor: row-resize; }
.vt-cursor-wait { cursor: wait; }
.vt-cursor-text { cursor: text; }
.vt-select-none { user-select: none; }
.vt-pointer-events-none { pointer-events: none; }
.vt-pointer-events-auto { pointer-events: auto; }
.vt-resize-none { resize: none; }
.vt-resize-y { resize: vertical; }
.vt-appearance-none { appearance: none; }
.vt-outline-none { outline: 2px solid transparent; outline-offset: 2px; }
.vt-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border-width: 0; }
.vt-scroll-mt-6 { scroll-margin-top: 1.5rem; }
.vt-aspect-square { aspect-ratio: 1/1; }

.vt-backdrop-blur { --vt-backdrop-blur: blur(8px); backdrop-filter: var(--vt-backdrop-blur) var(--vt-backdrop-brightness) var(--vt-backdrop-contrast) var(--vt-backdrop-grayscale) var(--vt-backdrop-hue-rotate) var(--vt-backdrop-invert) var(--vt-backdrop-opacity) var(--vt-backdrop-saturate) var(--vt-backdrop-sepia); }
.vt-backdrop-blur-sm { --vt-backdrop-blur: blur(4px); backdrop-filter: var(--vt-backdrop-blur) var(--vt-backdrop-brightness) var(--vt-backdrop-contrast) var(--vt-backdrop-grayscale) var(--vt-backdrop-hue-rotate) var(--vt-backdrop-invert) var(--vt-backdrop-opacity) var(--vt-backdrop-saturate) var(--vt-backdrop-sepia); }
.vt-backdrop-blur-md { --vt-backdrop-blur: blur(12px); backdrop-filter: var(--vt-backdrop-blur) var(--vt-backdrop-brightness) var(--vt-backdrop-contrast) var(--vt-backdrop-grayscale) var(--vt-backdrop-hue-rotate) var(--vt-backdrop-invert) var(--vt-backdrop-opacity) var(--vt-backdrop-saturate) var(--vt-backdrop-sepia); }
.vt-backdrop-blur-lg { --vt-backdrop-blur: blur(16px); backdrop-filter: var(--vt-backdrop-blur) var(--vt-backdrop-brightness) var(--vt-backdrop-contrast) var(--vt-backdrop-grayscale) var(--vt-backdrop-hue-rotate) var(--vt-backdrop-invert) var(--vt-backdrop-opacity) var(--vt-backdrop-saturate) var(--vt-backdrop-sepia); }
.vt-backdrop-blur-xl { --vt-backdrop-blur: blur(24px); backdrop-filter: var(--vt-backdrop-blur) var(--vt-backdrop-brightness) var(--vt-backdrop-contrast) var(--vt-backdrop-grayscale) var(--vt-backdrop-hue-rotate) var(--vt-backdrop-invert) var(--vt-backdrop-opacity) var(--vt-backdrop-saturate) var(--vt-backdrop-sepia); }
.vt-backdrop-blur-2xl { --vt-backdrop-blur: blur(40px); backdrop-filter: var(--vt-backdrop-blur) var(--vt-backdrop-brightness) var(--vt-backdrop-contrast) var(--vt-backdrop-grayscale) var(--vt-backdrop-hue-rotate) var(--vt-backdrop-invert) var(--vt-backdrop-opacity) var(--vt-backdrop-saturate) var(--vt-backdrop-sepia); }
.vt-backdrop-blur-3xl { --vt-backdrop-blur: blur(64px); backdrop-filter: var(--vt-backdrop-blur) var(--vt-backdrop-brightness) var(--vt-backdrop-contrast) var(--vt-backdrop-grayscale) var(--vt-backdrop-hue-rotate) var(--vt-backdrop-invert) var(--vt-backdrop-opacity) var(--vt-backdrop-saturate) var(--vt-backdrop-sepia); }
.vt-backdrop-blur-none { --vt-backdrop-blur: ; backdrop-filter: var(--vt-backdrop-blur) var(--vt-backdrop-brightness) var(--vt-backdrop-contrast) var(--vt-backdrop-grayscale) var(--vt-backdrop-hue-rotate) var(--vt-backdrop-invert) var(--vt-backdrop-opacity) var(--vt-backdrop-saturate) var(--vt-backdrop-sepia); }
.vt-blur { --vt-blur: blur(8px); filter: var(--vt-blur) var(--vt-brightness) var(--vt-contrast) var(--vt-grayscale) var(--vt-hue-rotate) var(--vt-invert) var(--vt-saturate) var(--vt-sepia) var(--vt-drop-shadow); }
.vt-blur-sm { --vt-blur: blur(4px); filter: var(--vt-blur) var(--vt-brightness) var(--vt-contrast) var(--vt-grayscale) var(--vt-hue-rotate) var(--vt-invert) var(--vt-saturate) var(--vt-sepia) var(--vt-drop-shadow); }
.vt-blur-md { --vt-blur: blur(12px); filter: var(--vt-blur) var(--vt-brightness) var(--vt-contrast) var(--vt-grayscale) var(--vt-hue-rotate) var(--vt-invert) var(--vt-saturate) var(--vt-sepia) var(--vt-drop-shadow); }
.vt-blur-lg { --vt-blur: blur(16px); filter: var(--vt-blur) var(--vt-brightness) var(--vt-contrast) var(--vt-grayscale) var(--vt-hue-rotate) var(--vt-invert) var(--vt-saturate) var(--vt-sepia) var(--vt-drop-shadow); }
.vt-blur-xl { --vt-blur: blur(24px); filter: var(--vt-blur) var(--vt-brightness) var(--vt-contrast) var(--vt-grayscale) var(--vt-hue-rotate) var(--vt-invert) var(--vt-saturate) var(--vt-sepia) var(--vt-drop-shadow); }
.vt-blur-2xl { --vt-blur: blur(40px); filter: var(--vt-blur) var(--vt-brightness) var(--vt-contrast) var(--vt-grayscale) var(--vt-hue-rotate) var(--vt-invert) var(--vt-saturate) var(--vt-sepia) var(--vt-drop-shadow); }
.vt-blur-3xl { --vt-blur: blur(64px); filter: var(--vt-blur) var(--vt-brightness) var(--vt-contrast) var(--vt-grayscale) var(--vt-hue-rotate) var(--vt-invert) var(--vt-saturate) var(--vt-sepia) var(--vt-drop-shadow); }
.vt-blur-none { --vt-blur: ; filter: var(--vt-blur) var(--vt-brightness) var(--vt-contrast) var(--vt-grayscale) var(--vt-hue-rotate) var(--vt-invert) var(--vt-saturate) var(--vt-sepia) var(--vt-drop-shadow); }
.vt-drop-shadow { --vt-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06)); filter: var(--vt-blur) var(--vt-brightness) var(--vt-contrast) var(--vt-grayscale) var(--vt-hue-rotate) var(--vt-invert) var(--vt-saturate) var(--vt-sepia) var(--vt-drop-shadow); }
.vt-drop-shadow-md { --vt-drop-shadow: drop-shadow(0 4px 3px rgb(0 0 0 / 0.07)) drop-shadow(0 2px 2px rgb(0 0 0 / 0.06)); filter: var(--vt-blur) var(--vt-brightness) var(--vt-contrast) var(--vt-grayscale) var(--vt-hue-rotate) var(--vt-invert) var(--vt-saturate) var(--vt-sepia) var(--vt-drop-shadow); }
.vt-filter { filter: var(--vt-blur) var(--vt-brightness) var(--vt-contrast) var(--vt-grayscale) var(--vt-hue-rotate) var(--vt-invert) var(--vt-saturate) var(--vt-sepia) var(--vt-drop-shadow); }
.vt-group { /* group marker */ }
.vt-group\/avatar { /* group/avatar marker */ }

.vt--mb-\[1px\] { margin-bottom:-1px; }
.vt--mb-px { margin-bottom:-1px; }
.vt--ml-1 { margin-left:-0.25rem; }
.vt--ml-2 { margin-left:-0.5rem; }
.vt--mr-1 { margin-right:-0.25rem; }
.vt--mt-1 { margin-top:-0.25rem; }
.vt--mt-1\.5 { margin-top:-0.375rem; }
.vt--mx-1 { margin-left:-0.25rem;margin-right:-0.25rem; }
.vt--mx-2 { margin-left:-0.5rem;margin-right:-0.5rem; }
.vt--bottom-0\.5 { bottom:-0.125rem; }
.vt--right-0\.5 { right:-0.125rem; }
.vt--right-1 { right:-0.25rem; }
.vt--right-1\.5 { right:-0.375rem; }
.vt--right-2 { right:-0.5rem; }
.vt--top-0\.5 { top:-0.125rem; }
.vt--top-1 { top:-0.25rem; }
.vt--top-1\.5 { top:-0.375rem; }
.vt--top-3 { top:-0.75rem; }

/* ── 4. Responsive variants ────────────────────────────── */
@media (min-width: 640px) {
  .vt-sm\:flex { display: flex; }
  .vt-sm\:flex-row { flex-direction: row; }
  .vt-sm\:col-span-1 { grid-column: span 1 / span 1; }
  .vt-sm\:mb-0 { margin-bottom: 0; }
  .vt-sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vt-sm\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .vt-sm\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .vt-sm\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .vt-sm\:items-center { align-items: center; }
  .vt-sm\:w-40 { width: 10rem; }
  .vt-sm\:rotate-0 { --vt-rotate: 0deg; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
  .vt-sm\:table-cell { display: table-cell; }
}
@media (min-width: 768px) {
  .vt-md\:flex { display: flex; }
  .vt-md\:flex-row { flex-direction: row; }
  .vt-md\:hidden { display: none; }
  .vt-md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vt-md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .vt-md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .vt-md\:col-span-2 { grid-column: span 2 / span 2; }
  .vt-md\:w-56 { width: 14rem; }
  .vt-md\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
  .vt-md\:py-12 { padding-top: 3rem; padding-bottom: 3rem; }
  .vt-md\:table-cell { display: table-cell; }
}
@media (min-width: 1024px) {
  .vt-lg\:flex { display: flex; }
  .vt-lg\:block { display: block; }
  .vt-lg\:hidden { display: none; }
  .vt-lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vt-lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .vt-lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .vt-lg\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .vt-lg\:col-span-2 { grid-column: span 2 / span 2; }
  .vt-lg\:col-span-3 { grid-column: span 3 / span 3; }
  .vt-lg\:h-full { height: 100%; }
}
/* ── 4b. Container queries ─────────────────────────────── */
.vt-cq { container-type: inline-size; }
@container (min-width: 24rem) {
  .vt-cq-sm\:flex { display: flex; }
  .vt-cq-sm\:block { display: block; }
  .vt-cq-sm\:hidden { display: none; }
  .vt-cq-sm\:flex-row { flex-direction: row; }
  .vt-cq-sm\:flex-col { flex-direction: column; }
  .vt-cq-sm\:items-center { align-items: center; }
  .vt-cq-sm\:items-start { align-items: flex-start; }
  .vt-cq-sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vt-cq-sm\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .vt-cq-sm\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .vt-cq-sm\:gap-4 { gap: 1rem; }
  .vt-cq-sm\:gap-6 { gap: 1.5rem; }
  .vt-cq-sm\:text-start { text-align: start; }
  .vt-cq-sm\:text-center { text-align: center; }
}
@container (min-width: 32rem) {
  .vt-cq-md\:flex { display: flex; }
  .vt-cq-md\:block { display: block; }
  .vt-cq-md\:hidden { display: none; }
  .vt-cq-md\:flex-row { flex-direction: row; }
  .vt-cq-md\:flex-col { flex-direction: column; }
  .vt-cq-md\:items-center { align-items: center; }
  .vt-cq-md\:items-start { align-items: flex-start; }
  .vt-cq-md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vt-cq-md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .vt-cq-md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .vt-cq-md\:gap-4 { gap: 1rem; }
  .vt-cq-md\:gap-6 { gap: 1.5rem; }
  .vt-cq-md\:text-start { text-align: start; }
  .vt-cq-md\:text-center { text-align: center; }
}
@container (min-width: 48rem) {
  .vt-cq-lg\:flex { display: flex; }
  .vt-cq-lg\:block { display: block; }
  .vt-cq-lg\:hidden { display: none; }
  .vt-cq-lg\:flex-row { flex-direction: row; }
  .vt-cq-lg\:flex-col { flex-direction: column; }
  .vt-cq-lg\:items-center { align-items: center; }
  .vt-cq-lg\:items-start { align-items: flex-start; }
  .vt-cq-lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vt-cq-lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .vt-cq-lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .vt-cq-lg\:gap-4 { gap: 1rem; }
  .vt-cq-lg\:gap-6 { gap: 1.5rem; }
  .vt-cq-lg\:text-start { text-align: start; }
  .vt-cq-lg\:text-center { text-align: center; }
}


/* ── 5. State variants ─────────────────────────────────── */
.vt-placeholder\:text-foreground-disabled::placeholder { color: hsl(var(--foreground-disabled)); }
.vt-placeholder\:text-foreground-disabled::-moz-placeholder { color: hsl(var(--foreground-disabled)); }
.vt-last\:border-b-0:last-child { border-bottom-width: 0; }

.vt-hover\:bg-brand-fill\/5:hover { background-color:hsl(var(--brand-fill)/0.05); }
.vt-hover\:bg-brand-fill\/50:hover { background-color:hsl(var(--brand-fill)/0.5); }
.vt-hover\:bg-brand-fill\/90:hover { background-color:hsl(var(--brand-fill)/0.9); }
.vt-hover\:bg-info-fill\/5:hover { background-color:hsl(var(--info-fill)/0.05); }
.vt-hover\:bg-info-fill\/50:hover { background-color:hsl(var(--info-fill)/0.5); }
.vt-hover\:bg-info-fill\/90:hover { background-color:hsl(var(--info-fill)/0.9); }
.vt-hover\:bg-error-fill\/10:hover { background-color:hsl(var(--error-fill)/0.1); }
.vt-hover\:bg-error-fill\/90:hover { background-color:hsl(var(--error-fill)/0.9); }
.vt-hover\:bg-black\/5:hover { background-color:rgba(0,0,0,0.05); }
.vt-hover\:bg-surface-subtle:hover { background-color:hsl(var(--surface-subtle)); }
.vt-hover\:bg-surface-subtle\/50:hover { background-color:hsl(var(--surface-subtle)/0.5); }
.vt-hover\:bg-surface-subtle\/80:hover { background-color:hsl(var(--surface-subtle)/0.8); }
.vt-hover\:border-brand-fill:hover { border-color:hsl(var(--brand-fill)); }
.vt-hover\:border-brand-fill\/50:hover { border-color:hsl(var(--brand-fill)/0.5); }
.vt-hover\:text-brand-fill\/80:hover { color:hsl(var(--brand-fill)/0.8); }
.vt-hover\:border-info-fill:hover { border-color:hsl(var(--info-fill)); }
.vt-hover\:border-info-fill\/50:hover { border-color:hsl(var(--info-fill)/0.5); }
.vt-hover\:text-info-fill\/80:hover { color:hsl(var(--info-fill)/0.8); }
.vt-hover\:text-error-fill:hover { color:hsl(var(--error-fill)); }
.vt-hover\:text-foreground-primary:hover { color:hsl(var(--foreground-primary)); }
.vt-hover\:text-foreground-primary\/80:hover { color:hsl(var(--foreground-primary)/0.8); }
.vt-hover\:text-generic-white:hover { color:hsl(var(--generic-white)); }
.vt-hover\:bg-surface-moderate:hover { background-color:hsl(var(--surface-moderate)); }
.vt-hover\:bg-foreground-disabled\/40:hover { background-color:hsl(var(--foreground-disabled)/0.4); }
.vt-hover\:bg-generic-white\/90:hover { background-color:hsl(var(--generic-white)/0.9); }
.vt-hover\:border-info-fill\/30:hover { border-color:hsl(var(--info-fill)/0.3); }
.vt-hover\:decoration-info-fill:hover { text-decoration-color:hsl(var(--info-fill)); }
.vt-hover\:decoration-foreground-primary:hover { text-decoration-color:hsl(var(--foreground-primary)); }
.vt-hover\:shadow-sm:hover { box-shadow:0 1px 2px 0 rgb(0 0 0 / 0.05); }
.vt-hover\:underline:hover { text-decoration-line:underline; }
.vt-hover\:opacity-100:hover { opacity:1; }
.vt-hover\:opacity-70:hover { opacity:0.7; }
.vt-hover\:opacity-80:hover { opacity:0.8; }
.vt-hover\:opacity-90:hover { opacity:0.9; }
.vt-hover\:z-10:hover { z-index:10; }
.vt-hover\:ring-2:hover { --vt-ring-offset-shadow: var(--vt-ring-inset) 0 0 0 var(--vt-ring-offset-width) var(--vt-ring-offset-color); --vt-ring-shadow: var(--vt-ring-inset) 0 0 0 calc(2px + var(--vt-ring-offset-width)) var(--vt-ring-color); box-shadow: var(--vt-ring-offset-shadow), var(--vt-ring-shadow), var(--vt-shadow, 0 0 #0000); }
.vt-hover\:ring-brand-fill:hover { --vt-ring-color:hsl(var(--brand-fill)); }
.vt-hover\:ring-info-fill:hover { --vt-ring-color:hsl(var(--info-fill)); }
.vt-focus\:outline-none:focus { outline:2px solid transparent;outline-offset:2px; }
.vt-focus\:ring-0:focus { --vt-ring-offset-shadow: var(--vt-ring-inset) 0 0 0 var(--vt-ring-offset-width) var(--vt-ring-offset-color); --vt-ring-shadow: var(--vt-ring-inset) 0 0 0 calc(0px + var(--vt-ring-offset-width)) var(--vt-ring-color); box-shadow: var(--vt-ring-offset-shadow), var(--vt-ring-shadow), var(--vt-shadow, 0 0 #0000); }
.vt-focus\:ring-1:focus { --vt-ring-offset-shadow: var(--vt-ring-inset) 0 0 0 var(--vt-ring-offset-width) var(--vt-ring-offset-color); --vt-ring-shadow: var(--vt-ring-inset) 0 0 0 calc(1px + var(--vt-ring-offset-width)) var(--vt-ring-color); box-shadow: var(--vt-ring-offset-shadow), var(--vt-ring-shadow), var(--vt-shadow, 0 0 #0000); }
.vt-focus\:ring-2:focus { --vt-ring-offset-shadow: var(--vt-ring-inset) 0 0 0 var(--vt-ring-offset-width) var(--vt-ring-offset-color); --vt-ring-shadow: var(--vt-ring-inset) 0 0 0 calc(2px + var(--vt-ring-offset-width)) var(--vt-ring-color); box-shadow: var(--vt-ring-offset-shadow), var(--vt-ring-shadow), var(--vt-shadow, 0 0 #0000); }
.vt-focus\:ring-brand-fill:focus { --vt-ring-color:hsl(var(--brand-fill)); }
.vt-focus\:ring-info-fill:focus { --vt-ring-color:hsl(var(--info-fill)); }
.vt-focus\:ring-offset-2:focus { --vt-ring-offset-width:2px; }
.vt-focus\:ring-offset-surface-page:focus { --vt-ring-offset-color:hsl(var(--surface-page)); }
.vt-focus-visible\:outline-none:focus-visible { outline:2px solid transparent;outline-offset:2px; }
.vt-focus-visible\:ring-1:focus-visible { --vt-ring-offset-shadow: var(--vt-ring-inset) 0 0 0 var(--vt-ring-offset-width) var(--vt-ring-offset-color); --vt-ring-shadow: var(--vt-ring-inset) 0 0 0 calc(1px + var(--vt-ring-offset-width)) var(--vt-ring-color); box-shadow: var(--vt-ring-offset-shadow), var(--vt-ring-shadow), var(--vt-shadow, 0 0 #0000); }
.vt-focus-visible\:ring-2:focus-visible { --vt-ring-offset-shadow: var(--vt-ring-inset) 0 0 0 var(--vt-ring-offset-width) var(--vt-ring-offset-color); --vt-ring-shadow: var(--vt-ring-inset) 0 0 0 calc(2px + var(--vt-ring-offset-width)) var(--vt-ring-color); box-shadow: var(--vt-ring-offset-shadow), var(--vt-ring-shadow), var(--vt-shadow, 0 0 #0000); }
.vt-focus-visible\:ring-brand-fill:focus-visible { --vt-ring-color:hsl(var(--brand-fill)); }
.vt-focus-visible\:ring-info-fill:focus-visible { --vt-ring-color:hsl(var(--info-fill)); }
.vt-focus-visible\:ring-error-fill:focus-visible { --vt-ring-color:hsl(var(--error-fill)); }
.vt-focus-visible\:ring-success-fill:focus-visible { --vt-ring-color:hsl(var(--success-fill)); }
.vt-focus-visible\:ring-offset-1:focus-visible { --vt-ring-offset-width:1px; }
.vt-focus-visible\:ring-offset-2:focus-visible { --vt-ring-offset-width:2px; }
.vt-focus-within\:ring-1:focus-within { --vt-ring-offset-shadow: var(--vt-ring-inset) 0 0 0 var(--vt-ring-offset-width) var(--vt-ring-offset-color); --vt-ring-shadow: var(--vt-ring-inset) 0 0 0 calc(1px + var(--vt-ring-offset-width)) var(--vt-ring-color); box-shadow: var(--vt-ring-offset-shadow), var(--vt-ring-shadow), var(--vt-shadow, 0 0 #0000); }
.vt-focus-within\:ring-2:focus-within { --vt-ring-offset-shadow: var(--vt-ring-inset) 0 0 0 var(--vt-ring-offset-width) var(--vt-ring-offset-color); --vt-ring-shadow: var(--vt-ring-inset) 0 0 0 calc(2px + var(--vt-ring-offset-width)) var(--vt-ring-color); box-shadow: var(--vt-ring-offset-shadow), var(--vt-ring-shadow), var(--vt-shadow, 0 0 #0000); }
.vt-focus-within\:ring-info-fill:focus-within { --vt-ring-color:hsl(var(--info-fill)); }
.vt-focus-within\:border-info-fill:focus-within { border-color:hsl(var(--info-fill)); }
.vt-disabled\:cursor-not-allowed:disabled { cursor: not-allowed; }
.vt-disabled\:opacity-50:disabled { opacity: 0.5; }
.vt-group:hover .vt-group-hover\:opacity-100 { opacity: 1; }
.vt-group:hover .vt-group-hover\:pointer-events-auto { pointer-events: auto; }
.vt-group:hover .vt-group-hover\:text-info-fill { color: hsl(var(--info-fill)); }
.vt-group:hover .vt-group-hover\:border-brand-fill { border-color: hsl(var(--brand-fill)); }
.vt-group:hover .vt-group-hover\:translate-x-0\.5 { --vt-translate-x: 0.125rem; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }
.vt-group\/avatar:hover .vt-group-hover\/avatar\:opacity-100 { opacity: 1; }
.vt-group\/avatar:hover .vt-group-hover\/avatar\:scale-110 { --vt-scale-x: 1.1; --vt-scale-y: 1.1; transform: translate(var(--vt-translate-x), var(--vt-translate-y)) rotate(var(--vt-rotate)) skew(var(--vt-skew-x)) skewY(var(--vt-skew-y)) scaleX(var(--vt-scale-x)) scaleY(var(--vt-scale-y)); }

/* ── 6. Dark mode variants ─────────────────────────────── */
.vt-dark\:block:is(.dark *) { display: block; }
.vt-dark\:hidden:is(.dark *) { display: none; }
.vt-dark\:bg-black\/15:is(.dark *) { background-color: rgba(0,0,0,0.15); }
.vt-dark\:bg-black\/20:is(.dark *) { background-color: rgba(0,0,0,0.2); }
.vt-dark\:bg-black\/30:is(.dark *) { background-color: rgba(0,0,0,0.3); }
.vt-dark\:hover\:bg-white\/10:hover:is(.dark *) { background-color: rgba(255,255,255,0.1); }

/* ── 7. Arbitrary-value one-offs ───────────────────────── */
.vt-aspect-\[16\/9\] { aspect-ratio: 16/9; }
.vt-aspect-\[21\/9\] { aspect-ratio: 21/9; }
.vt-aspect-\[4\/3\] { aspect-ratio: 4/3; }
.vt-flex-\[4\] { flex: 4; }
.vt-flex-\[6\] { flex: 6; }
.vt-h-\[0\.5px\] { height: 0.5px; }
.vt-h-\[20px\] { height: 20px; }
.vt-h-\[24px\] { height: 24px; }
.vt-h-\[calc\(100\%-1\.5rem\)\] { height: calc(100% - 1.5rem); }
.vt-left-\[22px\] { left: 22px; }
.vt-left-\[2px\] { left: 2px; }
.vt-left-\[60\%\] { left: 60%; }
.vt-max-w-\[120px\] { max-width: 120px; }
.vt-max-w-\[200px\] { max-width: 200px; }
.vt-max-w-\[300px\] { max-width: 300px; }
.vt-max-w-\[400px\] { max-width: 400px; }
.vt-max-w-\[500px\] { max-width: 500px; }
.vt-min-h-\[120px\] { min-height: 120px; }
.vt-min-h-\[200px\] { min-height: 200px; }
.vt-min-h-\[40px\] { min-height: 40px; }
.vt-min-h-\[42px\] { min-height: 42px; }
.vt-min-h-\[80px\] { min-height: 80px; }
.vt-min-w-\[16px\] { min-width: 16px; }
.vt-min-w-\[20px\] { min-width: 20px; }
.vt-min-w-\[400px\] { min-width: 400px; }
.vt-min-w-\[48px\] { min-width: 48px; }
.vt-min-w-\[60px\] { min-width: 60px; }
.vt-min-w-\[70px\] { min-width: 70px; }
.vt-min-w-\[80px\] { min-width: 80px; }
.vt-mt-\[68px\] { margin-top: 68px; }
.vt-mt-\[84px\] { margin-top: 84px; }
.vt-text-\[6px\] { font-size: 6px; }
.vt-text-\[7px\] { font-size: 7px; }
.vt-text-\[8px\] { font-size: 8px; }
.vt-text-\[9px\] { font-size: 9px; }
.vt-text-\[10px\] { font-size: 10px; }
.vt-text-\[11px\] { font-size: 11px; }
.vt-w-\[0\.5px\] { width: 0.5px; }
.vt-w-\[20px\] { width: 20px; }
.vt-w-\[220px\] { width: 220px; }
.vt-w-\[300px\] { width: 300px; }
.vt-w-\[44px\] { width: 44px; }
.vt-w-\[480px\] { width: 480px; }
.vt-w-\[70px\] { width: 70px; }
.vt-w-\[calc\(33\.333\%-11px\)\] { width: calc(33.333% - 11px); }
.vt-w-\[calc\(50\%-8px\)\] { width: calc(50% - 8px); }

/* ── 9. Webkit slider-thumb ────────────────────────────── */
.\[\&\:\:-webkit-slider-thumb\]\:h-5::-webkit-slider-thumb { height: 1.25rem; }
.\[\&\:\:-webkit-slider-thumb\]\:w-5::-webkit-slider-thumb { width: 1.25rem; }
.\[\&\:\:-webkit-slider-thumb\]\:appearance-none::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; }
.\[\&\:\:-webkit-slider-thumb\]\:rounded-full::-webkit-slider-thumb { border-radius: 9999px; }
.\[\&\:\:-webkit-slider-thumb\]\:border-2::-webkit-slider-thumb { border-width: 2px; }
.\[\&\:\:-webkit-slider-thumb\]\:bg-brand-fill::-webkit-slider-thumb { background-color: hsl(var(--brand-fill)); }
.\[\&\:\:-webkit-slider-thumb\]\:bg-info-fill::-webkit-slider-thumb { background-color: hsl(var(--info-fill)); }
.\[\&\:\:-webkit-slider-thumb\]\:shadow::-webkit-slider-thumb { box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); }
.\[\&\:\:-webkit-slider-thumb\]\:border-background::-webkit-slider-thumb { border-color: hsl(var(--surface-card)); }

/* ── 10. Site long-tail ────────────────────────────────── */
.vt--right-1\.5 { right: -0.375rem; }
.vt-decoration-border-default { text-decoration-color: hsl(var(--border-default)); }
.vt-decoration-info-fill\/30 { text-decoration-color: hsl(var(--info-fill) / 0.3); }
.vt-decoration-brand-fill\/30 { text-decoration-color: hsl(var(--brand-fill) / 0.3); }
.vt-decoration-foreground-disabled\/30 { text-decoration-color: hsl(var(--foreground-disabled) / 0.3); }
.vt-bg-generic-black { background-color: hsl(var(--generic-black)); }
.vt-bg-surface-strong { background-color: hsl(var(--surface-strong)); }
.vt-text-generic-black { color: hsl(var(--generic-black)); }
.vt-bg-success-fill\/5 { background-color: hsl(var(--success-fill) / 0.05); }
.vt-bg-surface-card\/80 { background-color: hsl(var(--surface-card) / 0.8); }
.vt-border-generic-white\/10 { border-color: hsl(var(--generic-white) / 0.1); }
.vt-ring-info-fill\/20 { --vt-ring-color: hsl(var(--info-fill) / 0.2); }
.vt-ring-surface-card { --vt-ring-color: hsl(var(--surface-card)); }
.vt-divide-border > :not([hidden]) ~ :not([hidden]) { border-color: hsl(var(--border-default)); }
.vt-max-w-\[420px\] { max-width: 420px; }
.vt-min-h-\[2\.5rem\] { min-height: 2.5rem; }
.vt-min-h-\[400px\] { min-height: 400px; }
.vt-min-h-\[440px\] { min-height: 440px; }
.vt-min-h-\[480px\] { min-height: 480px; }
.vt-min-h-\[560px\] { min-height: 560px; }
.vt-min-w-\[40px\] { min-width: 40px; }
.vt-min-w-\[100px\] { min-width: 100px; }

.vt-bg-neutral-fill { background-color: hsl(var(--neutral-fill)); }
.vt-text-neutral-fill { color: hsl(var(--neutral-fill)); }
.vt-border-neutral-fill { border-color: hsl(var(--neutral-fill)); }
.vt-bg-neutral-fill-hover { background-color: hsl(var(--neutral-fill-hover)); }
.vt-text-neutral-fill-hover { color: hsl(var(--neutral-fill-hover)); }
.vt-border-neutral-fill-hover { border-color: hsl(var(--neutral-fill-hover)); }
.vt-bg-neutral-fill-pressed { background-color: hsl(var(--neutral-fill-pressed)); }
.vt-text-neutral-fill-pressed { color: hsl(var(--neutral-fill-pressed)); }
.vt-border-neutral-fill-pressed { border-color: hsl(var(--neutral-fill-pressed)); }
.vt-bg-neutral-fill-disabled { background-color: hsl(var(--neutral-fill-disabled)); }
.vt-text-neutral-fill-disabled { color: hsl(var(--neutral-fill-disabled)); }
.vt-border-neutral-fill-disabled { border-color: hsl(var(--neutral-fill-disabled)); }
.vt-bg-on-neutral { background-color: hsl(var(--on-neutral)); }
.vt-text-on-neutral { color: hsl(var(--on-neutral)); }
.vt-border-on-neutral { border-color: hsl(var(--on-neutral)); }
.vt-placeholder\:text-foreground-muted::placeholder { color: hsl(var(--foreground-muted)); }
:root{font-size:14px}@media(min-width: 768px){:root{font-size:16px}}:root,html[data-theme=default]{--font-family-base: Inter, system-ui, sans-serif;--radius-sm: 0.5rem;--radius-md: 0.75rem;--radius-lg: 1rem;--radius-xl: 1.25rem;--radius-2xl: 1.5rem;--radius-3xl: 2rem;--radius-4xl: 2.5rem;--border-width-none: 0px;--border-width-thin: 1px;--border-width-default: 1px;--border-width-medium: 1.5px;--border-width-thick: 2px;--spacing-0: 0;--spacing-1: 0.25rem;--spacing-2: 0.5rem;--spacing-3: 0.75rem;--spacing-4: 1rem;--spacing-5: 1.25rem;--spacing-6: 1.5rem;--spacing-7: 1.75rem;--spacing-8: 2rem;--spacing-10: 2.5rem;--spacing-12: 3rem;--spacing-14: 3.5rem;--spacing-16: 4rem;--spacing-18: 4.5rem;--spacing-20: 5rem;--spacing-22: 5.5rem;--spacing-24: 6rem;--spacing-28: 7rem;--spacing-32: 8rem;--spacing-36: 9rem;--spacing-40: 10rem;--spacing-44: 11rem;--spacing-48: 12rem;--spacing-52: 13rem;--spacing-56: 14rem;--spacing-60: 15rem;--spacing-64: 16rem;--spacing-72: 18rem;--spacing-80: 20rem;--spacing-96: 24rem;--spacing-0_5: 0.125rem;--spacing-1_5: 0.375rem;--font-size-xs: 0.75rem;--font-size-sm: 0.875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-size-5xl: 3rem;--font-size-6xl: 3.75rem;--font-size-7xl: 4.5rem;--font-size-8xl: 6rem;--font-size-9xl: 8rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-loose: 1.75;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);--shadow-default: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);--shadow-control: 0 0 0 0 rgb(0 0 0 / 0);--shadow-control-pressed: 0 0 0 0 rgb(0 0 0 / 0);--shadow-control-bordered: 0 0 0 0 rgb(0 0 0 / 0);--shadow-control-bordered-pressed: 0 0 0 0 rgb(0 0 0 / 0);--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-drawer: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070;--transition-fast: 150ms ease;--transition-normal: 200ms ease;--transition-slow: 300ms ease;--container-width: 80rem;--container-dialog: 30rem;--container-toast-min: 18.75rem;--container-toast-max: 26.25rem;--control-height-sm: 2rem;--control-height-md: 2.5rem;--control-height-lg: 3rem;--control-height-xl: 3.5rem;--control-padding-x-sm: 0.75rem;--control-padding-x-md: 1rem;--control-padding-x-lg: 1.25rem;--control-padding-x-xl: 1.5rem;--control-padding-y-sm: 0.25rem;--control-padding-y-md: 0.5rem;--control-padding-y-lg: 0.5rem;--control-padding-y-xl: 0.75rem;--focus-ring-width: 3px;--focus-ring-offset: 0px;--motion-ease-out: cubic-bezier(0.16, 1, 0.3, 1);--motion-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);--motion-ease-spring: cubic-bezier(0.5, 1.6, 0.4, 1);--motion-preset-interactive: all 150ms cubic-bezier(0.16, 1, 0.3, 1);--motion-preset-fade: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1);--intent-success: var(--success-fill);--intent-warning: var(--warning-fill);--intent-danger: var(--error-fill);--intent-info: var(--info-fill);--elevation-0: none;--elevation-1: var(--shadow-sm);--elevation-2: var(--shadow-default);--elevation-3: var(--shadow-md);--elevation-4: var(--shadow-lg);--elevation-5: var(--shadow-xl);--shadow-sm-color: rgb(0 0 0 / 0.05);--shadow-default-color: rgb(0 0 0 / 0.1);--shadow-md-color: rgb(0 0 0 / 0.1);--shadow-lg-color: rgb(0 0 0 / 0.1);--shadow-xl-color: rgb(0 0 0 / 0.1);--shadow-control-color: rgb(0 0 0 / 0);--shadow-control-pressed-color: rgb(0 0 0 / 0);--shadow-control-bordered-color: rgb(0 0 0 / 0);--shadow-control-bordered-pressed-color: rgb(0 0 0 / 0);--type-body-sm-size: 0.875rem;--type-body-sm-line-height: 1.25rem;--type-body-sm-weight: 400;--type-body-sm-tracking: 0em;--type-body-md-size: 1rem;--type-body-md-line-height: 1.5rem;--type-body-md-weight: 400;--type-body-md-tracking: 0em;--type-body-lg-size: 1.125rem;--type-body-lg-line-height: 1.75rem;--type-body-lg-weight: 400;--type-body-lg-tracking: 0em;--type-label-sm-size: 0.75rem;--type-label-sm-line-height: 1rem;--type-label-sm-weight: 500;--type-label-sm-tracking: 0em;--type-label-md-size: 0.875rem;--type-label-md-line-height: 1.25rem;--type-label-md-weight: 500;--type-label-md-tracking: 0em;--type-label-lg-size: 1rem;--type-label-lg-line-height: 1.5rem;--type-label-lg-weight: 500;--type-label-lg-tracking: 0em;--type-caption-size: 0.75rem;--type-caption-line-height: 1rem;--type-caption-weight: 400;--type-caption-tracking: 0em;--type-overline-size: 0.75rem;--type-overline-line-height: 1rem;--type-overline-weight: 400;--type-overline-tracking: 0em;--type-heading-sm-size: 1.25rem;--type-heading-sm-line-height: 1.75rem;--type-heading-sm-weight: 600;--type-heading-sm-tracking: 0em;--type-heading-md-size: 1.5rem;--type-heading-md-line-height: 2rem;--type-heading-md-weight: 600;--type-heading-md-tracking: 0em;--type-heading-lg-size: 2rem;--type-heading-lg-line-height: 2.5rem;--type-heading-lg-weight: 600;--type-heading-lg-tracking: 0em;--type-code-sm-size: 0.75rem;--type-code-sm-line-height: 1rem;--type-code-sm-weight: 400;--type-code-sm-tracking: 0em;--type-code-md-size: 0.875rem;--type-code-md-line-height: 1.25rem;--type-code-md-weight: 400;--type-code-md-tracking: 0em;--generic-white: 0 0% 100%;--generic-black: 0 0% 0%;--foreground-primary: 240 3% 6%;--foreground-secondary: 228 4% 25%;--foreground-muted: 227 4% 43%;--foreground-disabled: 229 5% 57%;--surface-page: 0 0% 98%;--surface-card: 0 0% 100%;--surface-subtle: 0 0% 94%;--surface-moderate: 245 10% 88%;--surface-strong: 238 8% 80%;--border-default: 245 10% 88%;--border-strong: 238 8% 80%;--focus-ring: 219 88% 54%;--brand-fill: 213 87% 49%;--neutral-fill: 0 0% 98%;--neutral-fill-hover: 0 0% 94%;--neutral-fill-pressed: 245 10% 88%;--neutral-fill-disabled: 0 0% 98%;--on-neutral: 240 3% 6%;--success-fill: 162 86% 35%;--success-surface: 152 39% 98%;--success-border: 152 48% 84%;--warning-fill: 30 100% 44%;--warning-surface: 34 100% 97%;--warning-border: 32 94% 83%;--error-fill: 4 83% 55%;--error-surface: 0 100% 99%;--error-border: 2 92% 91%;--info-fill: 219 88% 54%;--info-surface: 217 100% 98%;--info-border: 216 92% 90%;--brand-50: 213 40% 98%;--brand-100: 213 50% 95%;--brand-200: 213 60% 89%;--brand-300: 213 70% 81%;--brand-400: 213 80% 66%;--brand-500: 213 87% 49%;--brand-600: 213 87% 42%;--brand-700: 213 87% 35%;--brand-800: 213 80% 28%;--brand-900: 213 70% 21%;--brand-950: 213 60% 14%;--brand-fill-hover: var(--brand-600);--brand-fill-pressed: var(--brand-700);--brand-fill-disabled: var(--brand-200);--on-brand: 0 0% 100%;--on-error: 0 0% 100%;--on-success: 0 0% 100%;--on-warning: 0 0% 100%;--on-info: 0 0% 100%;--info-fill-hover: 222 82% 48%;--info-fill-pressed: 224 76% 40%;--info-fill-disabled: 216 92% 90%;--info-text: 224 76% 40%;--success-fill-hover: 164 80% 29%;--success-fill-pressed: 166 74% 23%;--success-fill-disabled: 152 48% 84%;--success-text: 166 74% 23%;--warning-fill-hover: 28 90% 35%;--warning-fill-pressed: 26 80% 27%;--warning-fill-disabled: 32 94% 83%;--warning-text: 26 80% 27%;--error-fill-hover: 6 76% 48%;--error-fill-pressed: 8 70% 40%;--error-fill-disabled: 2 92% 91%;--error-text: 8 70% 40%}html[data-theme=editorial]{--font-family-base: 'Source Serif 4', Georgia, serif;--radius-sm: 0.375rem;--radius-md: 0.75rem;--radius-lg: 0.875rem;--radius-xl: 1rem;--radius-2xl: 1.125rem;--radius-3xl: 1.375rem;--radius-4xl: 1.625rem;--border-width-none: 0px;--border-width-thin: 1px;--border-width-default: 1px;--border-width-medium: 1.5px;--border-width-thick: 2px;--spacing-0: 0;--spacing-1: 0.25rem;--spacing-2: 0.5rem;--spacing-3: 0.75rem;--spacing-4: 1rem;--spacing-5: 1.25rem;--spacing-6: 1.5rem;--spacing-7: 1.75rem;--spacing-8: 2rem;--spacing-10: 2.5rem;--spacing-12: 3rem;--spacing-14: 3.5rem;--spacing-16: 4rem;--spacing-18: 4.5rem;--spacing-20: 5rem;--spacing-22: 5.5rem;--spacing-24: 6rem;--spacing-28: 7rem;--spacing-32: 8rem;--spacing-36: 9rem;--spacing-40: 10rem;--spacing-44: 11rem;--spacing-48: 12rem;--spacing-52: 13rem;--spacing-56: 14rem;--spacing-60: 15rem;--spacing-64: 16rem;--spacing-72: 18rem;--spacing-80: 20rem;--spacing-96: 24rem;--spacing-0_5: 0.125rem;--spacing-1_5: 0.375rem;--font-size-xs: 0.75rem;--font-size-sm: 0.875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-size-5xl: 3rem;--font-size-6xl: 3.75rem;--font-size-7xl: 4.5rem;--font-size-8xl: 6rem;--font-size-9xl: 8rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-loose: 1.75;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);--shadow-default: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);--shadow-control: 0 0 0 0 rgb(0 0 0 / 0);--shadow-control-pressed: 0 0 0 0 rgb(0 0 0 / 0);--shadow-control-bordered: 0 0 0 0 rgb(0 0 0 / 0);--shadow-control-bordered-pressed: 0 0 0 0 rgb(0 0 0 / 0);--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-drawer: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070;--transition-fast: 150ms ease;--transition-normal: 200ms ease;--transition-slow: 300ms ease;--container-width: 80rem;--container-dialog: 30rem;--container-toast-min: 18.75rem;--container-toast-max: 26.25rem;--intent-success: var(--success-fill);--intent-warning: var(--warning-fill);--intent-danger: var(--error-fill);--intent-info: var(--info-fill);--shadow-sm-color: rgb(0 0 0 / 0.05);--shadow-default-color: rgb(0 0 0 / 0.1);--shadow-md-color: rgb(0 0 0 / 0.1);--shadow-lg-color: rgb(0 0 0 / 0.1);--shadow-xl-color: rgb(0 0 0 / 0.1);--shadow-control-color: rgb(0 0 0 / 0);--shadow-control-pressed-color: rgb(0 0 0 / 0);--shadow-control-bordered-color: rgb(0 0 0 / 0);--shadow-control-bordered-pressed-color: rgb(0 0 0 / 0);--type-body-sm-size: 0.875rem;--type-body-sm-line-height: 1.25rem;--type-body-sm-weight: 400;--type-body-sm-tracking: 0em;--type-body-md-size: 1rem;--type-body-md-line-height: 1.5rem;--type-body-md-weight: 400;--type-body-md-tracking: 0em;--type-body-lg-size: 1.125rem;--type-body-lg-line-height: 1.75rem;--type-body-lg-weight: 400;--type-body-lg-tracking: 0em;--type-label-sm-size: 0.75rem;--type-label-sm-line-height: 1rem;--type-label-sm-weight: 500;--type-label-sm-tracking: 0em;--type-label-md-size: 0.875rem;--type-label-md-line-height: 1.25rem;--type-label-md-weight: 500;--type-label-md-tracking: 0em;--type-label-lg-size: 1rem;--type-label-lg-line-height: 1.5rem;--type-label-lg-weight: 500;--type-label-lg-tracking: 0em;--type-caption-size: 0.75rem;--type-caption-line-height: 1rem;--type-caption-weight: 400;--type-caption-tracking: 0em;--type-overline-size: 0.75rem;--type-overline-line-height: 1rem;--type-overline-weight: 400;--type-overline-tracking: 0em;--type-heading-sm-size: 1.25rem;--type-heading-sm-line-height: 1.75rem;--type-heading-sm-weight: 600;--type-heading-sm-tracking: 0em;--type-heading-md-size: 1.5rem;--type-heading-md-line-height: 2rem;--type-heading-md-weight: 600;--type-heading-md-tracking: 0em;--type-heading-lg-size: 2rem;--type-heading-lg-line-height: 2.5rem;--type-heading-lg-weight: 600;--type-heading-lg-tracking: 0em;--type-code-sm-size: 0.75rem;--type-code-sm-line-height: 1rem;--type-code-sm-weight: 400;--type-code-sm-tracking: 0em;--type-code-md-size: 0.875rem;--type-code-md-line-height: 1.25rem;--type-code-md-weight: 400;--type-code-md-tracking: 0em;--generic-white: 0 0% 100%;--generic-black: 0 0% 0%;--foreground-primary: 26 14% 16%;--foreground-secondary: 26 10% 28%;--foreground-muted: 27 8% 44%;--foreground-disabled: 28 6% 55%;--surface-page: 36 30% 97%;--surface-card: 38 30% 99%;--surface-subtle: 36 26% 95%;--surface-moderate: 35 24% 93%;--surface-strong: 34 18% 88%;--border-default: 34 16% 86%;--border-strong: 31 14% 72%;--focus-ring: 211 74% 45%;--brand-fill: 18 62% 45%;--neutral-fill: 36 26% 95%;--neutral-fill-hover: 35 24% 93%;--neutral-fill-pressed: 34 18% 88%;--neutral-fill-disabled: 36 26% 95%;--on-neutral: 26 14% 16%;--success-fill: 155 58% 41%;--success-surface: 153 40% 90%;--success-border: 155 46% 76%;--warning-fill: 28 80% 48%;--warning-surface: 34 100% 97%;--warning-border: 28 64% 76%;--error-fill: 3 68% 57%;--error-surface: 0 100% 96%;--error-border: 3 54% 76%;--info-fill: 211 74% 47%;--info-surface: 212 100% 94%;--info-border: 211 59% 76%;--brand-50: 14 27% 98%;--brand-100: 14 33% 95%;--brand-200: 14 40% 88%;--brand-300: 14 45% 80%;--brand-400: 15 50% 64%;--brand-500: 18 62% 45%;--brand-600: 18 62% 39%;--brand-700: 18 62% 32%;--brand-800: 17 56% 26%;--brand-900: 16 49% 20%;--brand-950: 15 42% 13%;--brand-fill-hover: var(--brand-600);--brand-fill-pressed: var(--brand-700);--brand-fill-disabled: var(--brand-200);--on-brand: 0 0% 100%;--on-error: 0 0% 100%;--on-success: 0 0% 100%;--on-warning: 0 0% 100%;--on-info: 0 0% 100%;--info-fill-hover: 211 72% 41%;--info-fill-pressed: 211 72% 34%;--info-fill-disabled: 211 48% 89%;--info-text: 211 72% 34%;--success-fill-hover: 162 100% 28%;--success-fill-pressed: 162 100% 24%;--success-fill-disabled: 144 31% 86%;--success-text: 161 100% 20%;--warning-fill-hover: 32 100% 35%;--warning-fill-pressed: 31 100% 30%;--warning-fill-disabled: 23 67% 87%;--warning-text: 31 100% 25%;--error-fill-hover: 2 56% 44%;--error-fill-pressed: 2 56% 37%;--error-fill-disabled: 4 49% 90%;--error-text: 2 56% 37%}html[data-theme=rounded-sans]{--font-family-base: Manrope, Inter, system-ui, sans-serif;--radius-sm: 0.75rem;--radius-md: 0.875rem;--radius-lg: 1.125rem;--radius-xl: 1.25rem;--radius-2xl: 1.5rem;--radius-3xl: 1.75rem;--radius-4xl: 2rem;--border-width-none: 0px;--border-width-thin: 1px;--border-width-default: 1px;--border-width-medium: 1.5px;--border-width-thick: 2px;--spacing-0: 0;--spacing-1: 0.25rem;--spacing-2: 0.5rem;--spacing-3: 0.75rem;--spacing-4: 1rem;--spacing-5: 1.25rem;--spacing-6: 1.5rem;--spacing-7: 1.75rem;--spacing-8: 2rem;--spacing-10: 2.5rem;--spacing-12: 3rem;--spacing-14: 3.5rem;--spacing-16: 4rem;--spacing-18: 4.5rem;--spacing-20: 5rem;--spacing-22: 5.5rem;--spacing-24: 6rem;--spacing-28: 7rem;--spacing-32: 8rem;--spacing-36: 9rem;--spacing-40: 10rem;--spacing-44: 11rem;--spacing-48: 12rem;--spacing-52: 13rem;--spacing-56: 14rem;--spacing-60: 15rem;--spacing-64: 16rem;--spacing-72: 18rem;--spacing-80: 20rem;--spacing-96: 24rem;--spacing-0_5: 0.125rem;--spacing-1_5: 0.375rem;--font-size-xs: 0.75rem;--font-size-sm: 0.875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-size-5xl: 3rem;--font-size-6xl: 3.75rem;--font-size-7xl: 4.5rem;--font-size-8xl: 6rem;--font-size-9xl: 8rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-loose: 1.75;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);--shadow-default: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);--shadow-control: 0 0 0 0 rgb(0 0 0 / 0);--shadow-control-pressed: 0 0 0 0 rgb(0 0 0 / 0);--shadow-control-bordered: 0 0 0 0 rgb(0 0 0 / 0);--shadow-control-bordered-pressed: 0 0 0 0 rgb(0 0 0 / 0);--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-drawer: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070;--transition-fast: 150ms ease;--transition-normal: 200ms ease;--transition-slow: 300ms ease;--container-width: 80rem;--container-dialog: 30rem;--container-toast-min: 18.75rem;--container-toast-max: 26.25rem;--intent-success: var(--success-fill);--intent-warning: var(--warning-fill);--intent-danger: var(--error-fill);--intent-info: var(--info-fill);--shadow-sm-color: rgb(0 0 0 / 0.05);--shadow-default-color: rgb(0 0 0 / 0.1);--shadow-md-color: rgb(0 0 0 / 0.1);--shadow-lg-color: rgb(0 0 0 / 0.1);--shadow-xl-color: rgb(0 0 0 / 0.1);--shadow-control-color: rgb(0 0 0 / 0);--shadow-control-pressed-color: rgb(0 0 0 / 0);--shadow-control-bordered-color: rgb(0 0 0 / 0);--shadow-control-bordered-pressed-color: rgb(0 0 0 / 0);--type-body-sm-size: 0.875rem;--type-body-sm-line-height: 1.25rem;--type-body-sm-weight: 400;--type-body-sm-tracking: 0em;--type-body-md-size: 1rem;--type-body-md-line-height: 1.5rem;--type-body-md-weight: 400;--type-body-md-tracking: 0em;--type-body-lg-size: 1.125rem;--type-body-lg-line-height: 1.75rem;--type-body-lg-weight: 400;--type-body-lg-tracking: 0em;--type-label-sm-size: 0.75rem;--type-label-sm-line-height: 1rem;--type-label-sm-weight: 500;--type-label-sm-tracking: 0em;--type-label-md-size: 0.875rem;--type-label-md-line-height: 1.25rem;--type-label-md-weight: 500;--type-label-md-tracking: 0em;--type-label-lg-size: 1rem;--type-label-lg-line-height: 1.5rem;--type-label-lg-weight: 500;--type-label-lg-tracking: 0em;--type-caption-size: 0.75rem;--type-caption-line-height: 1rem;--type-caption-weight: 400;--type-caption-tracking: 0em;--type-overline-size: 0.75rem;--type-overline-line-height: 1rem;--type-overline-weight: 400;--type-overline-tracking: 0em;--type-heading-sm-size: 1.25rem;--type-heading-sm-line-height: 1.75rem;--type-heading-sm-weight: 600;--type-heading-sm-tracking: 0em;--type-heading-md-size: 1.5rem;--type-heading-md-line-height: 2rem;--type-heading-md-weight: 600;--type-heading-md-tracking: 0em;--type-heading-lg-size: 2rem;--type-heading-lg-line-height: 2.5rem;--type-heading-lg-weight: 600;--type-heading-lg-tracking: 0em;--type-code-sm-size: 0.75rem;--type-code-sm-line-height: 1rem;--type-code-sm-weight: 400;--type-code-sm-tracking: 0em;--type-code-md-size: 0.875rem;--type-code-md-line-height: 1.25rem;--type-code-md-weight: 400;--type-code-md-tracking: 0em;--generic-white: 0 0% 100%;--generic-black: 0 0% 0%;--foreground-primary: 224 26% 15%;--foreground-secondary: 225 17% 28%;--foreground-muted: 225 12% 45%;--foreground-disabled: 226 10% 58%;--surface-page: 220 20% 98%;--surface-card: 0 0% 100%;--surface-subtle: 220 20% 97%;--surface-moderate: 220 18% 95%;--surface-strong: 220 16% 90%;--border-default: 220 14% 90%;--border-strong: 221 15% 78%;--focus-ring: 221 84% 55%;--brand-fill: 272 70% 57%;--neutral-fill: 220 20% 97%;--neutral-fill-hover: 220 18% 95%;--neutral-fill-pressed: 220 16% 90%;--neutral-fill-disabled: 220 20% 97%;--on-neutral: 224 26% 15%;--success-fill: 160 84% 35%;--success-surface: 154 48% 91%;--success-border: 160 67% 76%;--warning-fill: 28 96% 46%;--warning-surface: 34 100% 97%;--warning-border: 28 77% 76%;--error-fill: 0 78% 58%;--error-surface: 0 100% 96%;--error-border: 0 62% 76%;--info-fill: 221 84% 56%;--info-surface: 214 100% 95%;--info-border: 221 67% 76%;--brand-50: 258 32% 98%;--brand-100: 259 41% 96%;--brand-200: 259 51% 91%;--brand-300: 261 61% 84%;--brand-400: 264 70% 72%;--brand-500: 272 70% 57%;--brand-600: 272 53% 49%;--brand-700: 271 52% 41%;--brand-800: 270 49% 33%;--brand-900: 267 43% 24%;--brand-950: 265 38% 16%;--brand-fill-hover: var(--brand-600);--brand-fill-pressed: var(--brand-700);--brand-fill-disabled: var(--brand-200);--on-brand: 0 0% 100%;--on-error: 0 0% 100%;--on-success: 0 0% 100%;--on-warning: 0 0% 100%;--on-info: 0 0% 100%;--info-fill-hover: 221 66% 48%;--info-fill-pressed: 220 67% 40%;--info-fill-disabled: 216 62% 89%;--info-text: 220 67% 40%;--success-fill-hover: 164 100% 28%;--success-fill-pressed: 163 100% 24%;--success-fill-disabled: 147 33% 86%;--success-text: 163 100% 20%;--warning-fill-hover: 30 100% 36%;--warning-fill-pressed: 29 100% 31%;--warning-fill-disabled: 21 75% 88%;--warning-text: 29 100% 26%;--error-fill-hover: 358 65% 44%;--error-fill-pressed: 359 65% 36%;--error-fill-disabled: 3 56% 90%;--error-text: 359 65% 36%}html[data-theme=paper]{--font-family-base: Inter, system-ui, sans-serif;font-size:16px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-2xl: 24px;--radius-3xl: 32px;--radius-4xl: 40px;--border-width-none: 0px;--border-width-thin: 1px;--border-width-default: 1px;--border-width-medium: 1.5px;--border-width-thick: 2px;--spacing-0: 0;--spacing-1: 0.25rem;--spacing-2: 0.5rem;--spacing-3: 0.75rem;--spacing-4: 1rem;--spacing-5: 1.25rem;--spacing-6: 1.5rem;--spacing-7: 1.75rem;--spacing-8: 2rem;--spacing-10: 2.5rem;--spacing-12: 3rem;--spacing-14: 3.5rem;--spacing-16: 4rem;--spacing-18: 4.5rem;--spacing-20: 5rem;--spacing-22: 5.5rem;--spacing-24: 6rem;--spacing-28: 7rem;--spacing-32: 8rem;--spacing-36: 9rem;--spacing-40: 10rem;--spacing-44: 11rem;--spacing-48: 12rem;--spacing-52: 13rem;--spacing-56: 14rem;--spacing-60: 15rem;--spacing-64: 16rem;--spacing-72: 18rem;--spacing-80: 20rem;--spacing-96: 24rem;--spacing-0_5: 0.125rem;--spacing-1_5: 0.375rem;--font-size-xs: 0.75rem;--font-size-sm: 0.875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-size-5xl: 3rem;--font-size-6xl: 3.75rem;--font-size-7xl: 4.5rem;--font-size-8xl: 6rem;--font-size-9xl: 8rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-loose: 1.75;--shadow-sm: 0 1px 2px 0 rgb(61 45 24 / 0.06);--shadow-default: 0 1px 3px 0 rgb(61 45 24 / 0.1), 0 1px 2px -1px rgb(61 45 24 / 0.1);--shadow-md: 0 4px 6px -1px rgb(61 45 24 / 0.1), 0 2px 4px -2px rgb(61 45 24 / 0.1);--shadow-lg: 0 10px 15px -3px rgb(61 45 24 / 0.1), 0 4px 6px -4px rgb(61 45 24 / 0.1);--shadow-xl: 0 20px 25px -5px rgb(61 45 24 / 0.1), 0 8px 10px -6px rgb(61 45 24 / 0.1);--shadow-control: inset 0 0 0 1px rgba(61, 45, 24, 0.3), inset 0 2px 0 rgba(255, 255, 255, 0.45), inset 0 -1px 0 rgba(61, 45, 24, 0.12);--shadow-control-pressed: inset 0 1px 2px rgba(61, 45, 24, 0.14), inset 0 0 0 1px rgba(61, 45, 24, 0.18);--shadow-control-bordered: 0 1px 2px rgba(61, 45, 24, 0.08);--shadow-control-bordered-pressed: inset 0 1px 2px rgba(61, 45, 24, 0.1);--shadow-inset-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.18);--shadow-inset-edge-bordered: inset 0 -2px 0 rgba(61, 45, 24, 0.08);--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-drawer: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070;--transition-fast: 150ms ease;--transition-normal: 200ms ease;--transition-slow: 300ms ease;--container-width: 80rem;--container-dialog: 30rem;--container-toast-min: 18.75rem;--container-toast-max: 26.25rem;--control-height-sm: 2rem;--control-height-md: 2.5rem;--control-height-lg: 3rem;--control-height-xl: 3.5rem;--control-padding-x-sm: 0.75rem;--control-padding-x-md: 1rem;--control-padding-x-lg: 1.25rem;--control-padding-x-xl: 1.5rem;--control-padding-y-sm: 0.25rem;--control-padding-y-md: 0.5rem;--control-padding-y-lg: 0.5rem;--control-padding-y-xl: 0.75rem;--focus-ring-width: 3px;--focus-ring-offset: 0px;--motion-ease-out: cubic-bezier(0.16, 1, 0.3, 1);--motion-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);--motion-ease-spring: cubic-bezier(0.5, 1.6, 0.4, 1);--motion-preset-interactive: all 150ms cubic-bezier(0.16, 1, 0.3, 1);--motion-preset-fade: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1);--intent-success: var(--success-fill);--intent-warning: var(--warning-fill);--intent-danger: var(--error-fill);--intent-info: var(--info-fill);--elevation-0: none;--elevation-1: var(--shadow-sm);--elevation-2: var(--shadow-default);--elevation-3: var(--shadow-md);--elevation-4: var(--shadow-lg);--elevation-5: var(--shadow-xl);--shadow-sm-color: rgb(61 45 24 / 0.06);--shadow-default-color: rgb(61 45 24 / 0.1);--shadow-md-color: rgb(61 45 24 / 0.1);--shadow-lg-color: rgb(61 45 24 / 0.1);--shadow-xl-color: rgb(61 45 24 / 0.1);--shadow-control-color: rgba(61, 45, 24, 0.12);--shadow-control-on: 1;--shadow-control-pressed-color: rgba(61, 45, 24, 0.18);--shadow-control-pressed-on: 1;--shadow-control-bordered-color: rgba(61, 45, 24, 0.08);--shadow-control-bordered-pressed-color: rgba(61, 45, 24, 0.1);--shadow-control-bordered-pressed-on: 1;--shadow-inset-highlight-color: rgba(255, 255, 255, 0.18);--shadow-inset-highlight-on: 1;--shadow-inset-edge-bordered-color: rgba(61, 45, 24, 0.08);--shadow-inset-edge-bordered-on: 1;--type-body-sm-size: 0.875rem;--type-body-sm-line-height: 1.25rem;--type-body-sm-weight: 400;--type-body-sm-tracking: 0em;--type-body-md-size: 1rem;--type-body-md-line-height: 1.5rem;--type-body-md-weight: 400;--type-body-md-tracking: 0em;--type-body-lg-size: 1.125rem;--type-body-lg-line-height: 1.75rem;--type-body-lg-weight: 400;--type-body-lg-tracking: 0em;--type-label-sm-size: 0.75rem;--type-label-sm-line-height: 1rem;--type-label-sm-weight: 500;--type-label-sm-tracking: 0em;--type-label-md-size: 0.875rem;--type-label-md-line-height: 1.25rem;--type-label-md-weight: 500;--type-label-md-tracking: 0em;--type-label-lg-size: 1rem;--type-label-lg-line-height: 1.5rem;--type-label-lg-weight: 500;--type-label-lg-tracking: 0em;--type-caption-size: 0.75rem;--type-caption-line-height: 1rem;--type-caption-weight: 400;--type-caption-tracking: 0em;--type-overline-size: 0.75rem;--type-overline-line-height: 1rem;--type-overline-weight: 400;--type-overline-tracking: 0em;--type-heading-sm-size: 1.25rem;--type-heading-sm-line-height: 1.75rem;--type-heading-sm-weight: 600;--type-heading-sm-tracking: 0em;--type-heading-md-size: 1.5rem;--type-heading-md-line-height: 2rem;--type-heading-md-weight: 600;--type-heading-md-tracking: 0em;--type-heading-lg-size: 2rem;--type-heading-lg-line-height: 2.5rem;--type-heading-lg-weight: 600;--type-heading-lg-tracking: 0em;--type-code-sm-size: 0.75rem;--type-code-sm-line-height: 1rem;--type-code-sm-weight: 400;--type-code-sm-tracking: 0em;--type-code-md-size: 0.875rem;--type-code-md-line-height: 1.25rem;--type-code-md-weight: 400;--type-code-md-tracking: 0em;--generic-white: 0 0% 100%;--generic-black: 0 0% 0%;--foreground-primary: 40 9% 9%;--foreground-secondary: 38 7% 27%;--foreground-muted: 36 6% 42%;--foreground-disabled: 35 5% 58%;--surface-page: 45 30% 97%;--surface-card: 45 40% 99%;--surface-subtle: 45 27% 94%;--surface-moderate: 44 23% 90%;--surface-strong: 42 18% 84%;--border-default: 44 20% 88%;--border-strong: 40 14% 76%;--focus-ring: 219 88% 54%;--brand-fill: 252 94% 67%;--neutral-fill: 45 40% 99%;--neutral-fill-hover: 45 27% 94%;--neutral-fill-pressed: 44 23% 90%;--neutral-fill-disabled: 45 27% 94%;--on-neutral: 40 9% 9%;--success-fill: 143 52% 43%;--success-surface: 131 24% 98%;--success-border: 132 34% 86%;--warning-fill: 29 75% 63%;--warning-surface: 27 35% 98%;--warning-border: 27 49% 87%;--error-fill: 348 80% 61%;--error-surface: 355 57% 98%;--error-border: 355 87% 91%;--info-fill: 221 91% 63%;--info-surface: 216 37% 98%;--info-border: 217 55% 89%;--brand-50: 235 38% 98%;--brand-100: 235 49% 96%;--brand-200: 236 61% 91%;--brand-300: 237 73% 86%;--brand-400: 242 85% 77%;--brand-500: 252 94% 67%;--brand-600: 252 59% 55%;--brand-700: 252 48% 46%;--brand-800: 249 45% 36%;--brand-900: 246 40% 27%;--brand-950: 243 36% 17%;--brand-fill-hover: var(--brand-600);--brand-fill-pressed: var(--brand-700);--brand-fill-disabled: var(--brand-200);--on-brand: 0 0% 100%;--on-error: 0 0% 100%;--on-success: 0 0% 100%;--on-warning: 30 100% 10%;--on-info: 0 0% 100%;--info-fill-hover: 221 59% 48%;--info-fill-pressed: 221 60% 40%;--info-fill-disabled: 217 55% 89%;--info-text: 221 60% 40%;--success-fill-hover: 155 100% 28%;--success-fill-pressed: 154 100% 24%;--success-fill-disabled: 132 31% 86%;--success-text: 153 100% 20%;--warning-fill-hover: 36 100% 33%;--warning-fill-pressed: 35 100% 29%;--warning-fill-disabled: 27 49% 87%;--warning-text: 35 100% 24%;--error-fill-hover: 341 100% 43%;--error-fill-pressed: 341 100% 37%;--error-fill-disabled: 355 87% 91%;--error-text: 341 100% 31%}html.dark:not([data-theme]),html.dark[data-theme=default]{--foreground-primary: 0 0% 98%;--foreground-secondary: 245 10% 88%;--foreground-muted: 231 6% 69%;--foreground-disabled: 227 4% 43%;--surface-page: 0 0% 0%;--surface-card: 240 3% 6%;--surface-subtle: 240 4% 15%;--surface-moderate: 228 4% 25%;--surface-strong: 228 4% 34%;--border-default: 240 4% 15%;--border-strong: 228 4% 25%;--focus-ring: 218 88% 69%;--brand-fill: 213 87% 49%;--neutral-fill: 240 4% 15%;--neutral-fill-hover: 228 4% 25%;--neutral-fill-pressed: 228 4% 34%;--neutral-fill-disabled: 240 4% 15%;--on-neutral: 0 0% 98%;--success-fill: 162 86% 35%;--success-surface: 150 55% 10%;--success-border: 168 68% 18%;--warning-fill: 30 100% 44%;--warning-surface: 30 100% 10%;--warning-border: 24 70% 20%;--error-fill: 4 83% 55%;--error-surface: 356 89% 17%;--error-border: 10 64% 32%;--info-fill: 219 88% 54%;--info-surface: 216 82% 17%;--info-border: 226 70% 32%;--on-brand: 0 0% 100%;--on-error: 0 0% 100%;--on-success: 0 0% 100%;--on-warning: 0 0% 100%;--on-info: 0 0% 100%;--brand-fill-disabled: var(--brand-900);--info-fill-hover: 222 82% 48%;--info-fill-pressed: 224 76% 40%;--info-fill-disabled: 228 64% 24%;--info-text: 217 90% 83%;--success-fill-hover: 164 80% 29%;--success-fill-pressed: 166 74% 23%;--success-fill-disabled: 168 58% 14%;--success-text: 156 52% 71%;--warning-fill-hover: 28 90% 35%;--warning-fill-pressed: 26 80% 27%;--warning-fill-disabled: 22 60% 14%;--warning-text: 31 92% 73%;--error-fill-hover: 6 76% 48%;--error-fill-pressed: 8 70% 40%;--error-fill-disabled: 12 58% 24%;--error-text: 3 88% 84%}html.dark[data-theme=editorial]{--foreground-primary: 40 18% 94%;--foreground-secondary: 37 14% 80%;--foreground-muted: 35 10% 64%;--foreground-disabled: 33 7% 48%;--surface-page: 22 16% 4%;--surface-card: 24 16% 10%;--surface-subtle: 24 12% 14%;--surface-moderate: 25 13% 11%;--surface-strong: 23 10% 20%;--border-default: 23 10% 19%;--border-strong: 25 10% 29%;--focus-ring: 211 74% 56%;--brand-fill: 18 62% 45%;--neutral-fill: 24 12% 14%;--neutral-fill-hover: 25 13% 11%;--neutral-fill-pressed: 23 10% 20%;--neutral-fill-disabled: 24 12% 14%;--on-neutral: 40 18% 94%;--success-fill: 155 58% 41%;--success-surface: 153 46% 11%;--success-border: 155 41% 28%;--warning-fill: 30 84% 46%;--warning-surface: 30 63% 14%;--warning-border: 30 59% 28%;--error-fill: 3 72% 57%;--error-surface: 356 60% 16%;--error-border: 3 50% 28%;--info-fill: 211 74% 47%;--info-surface: 211 53% 16%;--info-border: 211 52% 28%;--on-brand: 0 0% 100%;--on-error: 0 0% 100%;--on-success: 0 0% 100%;--on-warning: 0 0% 100%;--on-info: 0 0% 100%;--brand-fill-disabled: var(--brand-900);--info-fill-hover: 211 72% 41%;--info-fill-pressed: 211 72% 34%;--info-fill-disabled: 211 60% 20%;--info-text: 211 56% 80%;--success-fill-hover: 162 100% 28%;--success-fill-pressed: 162 100% 24%;--success-fill-disabled: 158 100% 12%;--success-text: 146 36% 74%;--warning-fill-hover: 33 100% 34%;--warning-fill-pressed: 33 100% 30%;--warning-fill-disabled: 29 100% 15%;--warning-text: 25 72% 77%;--error-fill-hover: 2 60% 44%;--error-fill-pressed: 2 60% 36%;--error-fill-disabled: 2 49% 22%;--error-text: 4 59% 82%}html.dark[data-theme=rounded-sans]{--foreground-primary: 220 20% 96%;--foreground-secondary: 220 16% 83%;--foreground-muted: 220 12% 66%;--foreground-disabled: 220 10% 48%;--surface-page: 226 24% 4%;--surface-card: 226 24% 10%;--surface-subtle: 224 19% 16%;--surface-moderate: 226 20% 12%;--surface-strong: 224 16% 22%;--border-default: 224 15% 20%;--border-strong: 224 13% 30%;--focus-ring: 221 84% 62%;--brand-fill: 272 70% 57%;--neutral-fill: 224 19% 16%;--neutral-fill-hover: 226 20% 12%;--neutral-fill-pressed: 224 16% 22%;--neutral-fill-disabled: 224 19% 16%;--on-neutral: 220 20% 96%;--success-fill: 160 84% 35%;--success-surface: 157 58% 11%;--success-border: 160 59% 28%;--warning-fill: 32 98% 43%;--warning-surface: 29 77% 15%;--warning-border: 32 69% 28%;--error-fill: 0 84% 57%;--error-surface: 355 76% 16%;--error-border: 0 59% 28%;--info-fill: 221 84% 56%;--info-surface: 219 63% 17%;--info-border: 221 59% 28%;--on-brand: 0 0% 100%;--on-error: 0 0% 100%;--on-success: 0 0% 100%;--on-warning: 0 0% 100%;--on-info: 0 0% 100%;--brand-fill-disabled: var(--brand-900);--info-fill-hover: 221 66% 48%;--info-fill-pressed: 220 67% 40%;--info-fill-disabled: 218 61% 23%;--info-text: 216 72% 82%;--success-fill-hover: 164 100% 28%;--success-fill-pressed: 163 100% 24%;--success-fill-disabled: 160 100% 12%;--success-text: 149 38% 74%;--warning-fill-hover: 33 100% 34%;--warning-fill-pressed: 33 100% 30%;--warning-fill-disabled: 30 100% 15%;--warning-text: 25 73% 77%;--error-fill-hover: 358 76% 42%;--error-fill-pressed: 358 74% 35%;--error-fill-disabled: 0 55% 22%;--error-text: 3 70% 83%}html.dark[data-theme=paper]{--foreground-primary: 45 20% 95%;--foreground-secondary: 42 12% 80%;--foreground-muted: 40 8% 64%;--foreground-disabled: 38 6% 46%;--surface-page: 40 7% 6%;--surface-card: 40 6% 10%;--surface-subtle: 38 6% 14%;--surface-moderate: 36 5% 20%;--surface-strong: 35 5% 28%;--border-default: 38 6% 17%;--border-strong: 36 5% 27%;--focus-ring: 218 88% 69%;--brand-fill: 252 94% 67%;--neutral-fill: 38 6% 14%;--neutral-fill-hover: 36 5% 20%;--neutral-fill-pressed: 35 5% 27%;--neutral-fill-disabled: 38 6% 14%;--on-neutral: 45 20% 95%;--success-fill: 143 52% 48%;--success-surface: 144 96% 8%;--success-border: 151 100% 16%;--warning-fill: 29 75% 63%;--warning-surface: 30 80% 11%;--warning-border: 34 100% 19%;--error-fill: 348 80% 61%;--error-surface: 348 68% 14%;--error-border: 341 100% 25%;--info-fill: 221 91% 63%;--info-surface: 218 49% 15%;--info-border: 220 58% 31%;--on-brand: 0 0% 100%;--on-error: 0 0% 100%;--on-success: 150 55% 10%;--on-warning: 30 100% 10%;--on-info: 0 0% 100%;--brand-fill-disabled: var(--brand-900);--info-fill-hover: 221 59% 48%;--info-fill-pressed: 221 60% 40%;--info-fill-disabled: 219 54% 23%;--info-text: 217 65% 82%;--success-fill-hover: 154 100% 28%;--success-fill-pressed: 154 100% 24%;--success-fill-disabled: 148 100% 12%;--success-text: 134 39% 74%;--warning-fill-hover: 36 100% 33%;--warning-fill-pressed: 35 100% 29%;--warning-fill-disabled: 32 100% 15%;--warning-text: 27 56% 77%;--error-fill-hover: 341 100% 43%;--error-fill-pressed: 341 100% 37%;--error-fill-disabled: 342 97% 19%;--error-text: 353 98% 84%}body{font-family:var(--font-family-base, Inter, system-ui, sans-serif)}*,::before,::after{border-color:hsl(var(--border-default))}hr{border:none;border-top:var(--border-width-thin) solid hsl(var(--border-default));margin:0}.vt-container,.vt-container-fluid{width:100%;margin-right:auto;margin-left:auto;padding-right:var(--spacing-3);padding-left:var(--spacing-3)}.vt-container{max-width:var(--container-width)}@media(min-width: 640px){.vt-container{padding-right:var(--spacing-4);padding-left:var(--spacing-4)}}@media(min-width: 1024px){.vt-container{padding-right:var(--spacing-6);padding-left:var(--spacing-6)}}.vt-row{--vt-gutter-x: 1rem;--vt-gutter-y: 0;display:flex;flex-wrap:wrap;margin-top:calc(-1*var(--vt-gutter-y));margin-right:calc(-0.5*var(--vt-gutter-x));margin-left:calc(-0.5*var(--vt-gutter-x))}.vt-row>*{width:100%;max-width:100%;padding-right:calc(var(--vt-gutter-x)*.5);padding-left:calc(var(--vt-gutter-x)*.5);margin-top:var(--vt-gutter-y)}.vt-col{flex:1 0 0%}.vt-col-1{flex:0 0 8.3333333333%;max-width:8.3333333333%}.vt-col-2{flex:0 0 16.6666666667%;max-width:16.6666666667%}.vt-col-3{flex:0 0 25%;max-width:25%}.vt-col-4{flex:0 0 33.3333333333%;max-width:33.3333333333%}.vt-col-5{flex:0 0 41.6666666667%;max-width:41.6666666667%}.vt-col-6{flex:0 0 50%;max-width:50%}.vt-col-7{flex:0 0 58.3333333333%;max-width:58.3333333333%}.vt-col-8{flex:0 0 66.6666666667%;max-width:66.6666666667%}.vt-col-9{flex:0 0 75%;max-width:75%}.vt-col-10{flex:0 0 83.3333333333%;max-width:83.3333333333%}.vt-col-11{flex:0 0 91.6666666667%;max-width:91.6666666667%}.vt-col-12{flex:0 0 100%;max-width:100%}:root{--generic-0: 0 0% 100%;--generic-1000: 0 0% 0%;--grey-50: 0 0% 98%;--grey-100: 0 0% 94%;--grey-200: 245 10% 88%;--grey-300: 238 8% 80%;--grey-400: 231 6% 69%;--grey-500: 229 5% 57%;--grey-600: 227 4% 43%;--grey-700: 228 4% 34%;--grey-800: 228 4% 25%;--grey-900: 240 4% 15%;--grey-950: 240 3% 6%;--green-50: 152 39% 98%;--green-100: 149 44% 93%;--green-200: 152 48% 84%;--green-300: 156 52% 71%;--green-400: 160 60% 49%;--green-500: 162 86% 35%;--green-600: 164 80% 29%;--green-700: 166 74% 23%;--green-800: 168 68% 18%;--green-900: 168 58% 14%;--green-950: 150 55% 10%;--blue-50: 217 100% 98%;--blue-100: 215 96% 95%;--blue-200: 216 92% 90%;--blue-300: 217 90% 83%;--blue-400: 218 88% 69%;--blue-500: 219 88% 54%;--blue-600: 222 82% 48%;--blue-700: 224 76% 40%;--blue-800: 226 70% 32%;--blue-900: 228 64% 24%;--blue-950: 216 82% 17%;--brand-50: 213 40% 98%;--brand-100: 213 50% 95%;--brand-200: 213 60% 89%;--brand-300: 213 70% 81%;--brand-400: 213 80% 66%;--brand-500: 213 87% 49%;--brand-600: 213 87% 42%;--brand-700: 213 87% 35%;--brand-800: 213 80% 28%;--brand-900: 213 70% 21%;--brand-950: 213 60% 14%;--red-50: 0 100% 99%;--red-100: 0 96% 96%;--red-200: 2 92% 91%;--red-300: 3 88% 84%;--red-400: 4 84% 71%;--red-500: 4 83% 55%;--red-600: 6 76% 48%;--red-700: 8 70% 40%;--red-800: 10 64% 32%;--red-900: 12 58% 24%;--red-950: 356 89% 17%;--orange-50: 34 100% 97%;--orange-100: 33 96% 92%;--orange-200: 32 94% 83%;--orange-300: 31 92% 73%;--orange-400: 30 96% 56%;--orange-500: 30 100% 44%;--orange-600: 28 90% 35%;--orange-700: 26 80% 27%;--orange-800: 24 70% 20%;--orange-900: 22 60% 14%;--orange-950: 30 100% 10%;--radius-none: 0;--radius-full: 9999px;--radius-2xs: 0.25rem;--radius-xs: 0.375rem}@media(min-width: 640px){.vt-col-sm{flex:1 0 0%}.vt-col-sm-1{flex:0 0 8.3333333333%;max-width:8.3333333333%}.vt-col-sm-2{flex:0 0 16.6666666667%;max-width:16.6666666667%}.vt-col-sm-3{flex:0 0 25%;max-width:25%}.vt-col-sm-4{flex:0 0 33.3333333333%;max-width:33.3333333333%}.vt-col-sm-5{flex:0 0 41.6666666667%;max-width:41.6666666667%}.vt-col-sm-6{flex:0 0 50%;max-width:50%}.vt-col-sm-7{flex:0 0 58.3333333333%;max-width:58.3333333333%}.vt-col-sm-8{flex:0 0 66.6666666667%;max-width:66.6666666667%}.vt-col-sm-9{flex:0 0 75%;max-width:75%}.vt-col-sm-10{flex:0 0 83.3333333333%;max-width:83.3333333333%}.vt-col-sm-11{flex:0 0 91.6666666667%;max-width:91.6666666667%}.vt-col-sm-12{flex:0 0 100%;max-width:100%}}@media(min-width: 768px){.vt-col-md{flex:1 0 0%}.vt-col-md-1{flex:0 0 8.3333333333%;max-width:8.3333333333%}.vt-col-md-2{flex:0 0 16.6666666667%;max-width:16.6666666667%}.vt-col-md-3{flex:0 0 25%;max-width:25%}.vt-col-md-4{flex:0 0 33.3333333333%;max-width:33.3333333333%}.vt-col-md-5{flex:0 0 41.6666666667%;max-width:41.6666666667%}.vt-col-md-6{flex:0 0 50%;max-width:50%}.vt-col-md-7{flex:0 0 58.3333333333%;max-width:58.3333333333%}.vt-col-md-8{flex:0 0 66.6666666667%;max-width:66.6666666667%}.vt-col-md-9{flex:0 0 75%;max-width:75%}.vt-col-md-10{flex:0 0 83.3333333333%;max-width:83.3333333333%}.vt-col-md-11{flex:0 0 91.6666666667%;max-width:91.6666666667%}.vt-col-md-12{flex:0 0 100%;max-width:100%}}@media(min-width: 1024px){.vt-col-lg{flex:1 0 0%}.vt-col-lg-1{flex:0 0 8.3333333333%;max-width:8.3333333333%}.vt-col-lg-2{flex:0 0 16.6666666667%;max-width:16.6666666667%}.vt-col-lg-3{flex:0 0 25%;max-width:25%}.vt-col-lg-4{flex:0 0 33.3333333333%;max-width:33.3333333333%}.vt-col-lg-5{flex:0 0 41.6666666667%;max-width:41.6666666667%}.vt-col-lg-6{flex:0 0 50%;max-width:50%}.vt-col-lg-7{flex:0 0 58.3333333333%;max-width:58.3333333333%}.vt-col-lg-8{flex:0 0 66.6666666667%;max-width:66.6666666667%}.vt-col-lg-9{flex:0 0 75%;max-width:75%}.vt-col-lg-10{flex:0 0 83.3333333333%;max-width:83.3333333333%}.vt-col-lg-11{flex:0 0 91.6666666667%;max-width:91.6666666667%}.vt-col-lg-12{flex:0 0 100%;max-width:100%}}@media(min-width: 1280px){.vt-col-xl{flex:1 0 0%}.vt-col-xl-1{flex:0 0 8.3333333333%;max-width:8.3333333333%}.vt-col-xl-2{flex:0 0 16.6666666667%;max-width:16.6666666667%}.vt-col-xl-3{flex:0 0 25%;max-width:25%}.vt-col-xl-4{flex:0 0 33.3333333333%;max-width:33.3333333333%}.vt-col-xl-5{flex:0 0 41.6666666667%;max-width:41.6666666667%}.vt-col-xl-6{flex:0 0 50%;max-width:50%}.vt-col-xl-7{flex:0 0 58.3333333333%;max-width:58.3333333333%}.vt-col-xl-8{flex:0 0 66.6666666667%;max-width:66.6666666667%}.vt-col-xl-9{flex:0 0 75%;max-width:75%}.vt-col-xl-10{flex:0 0 83.3333333333%;max-width:83.3333333333%}.vt-col-xl-11{flex:0 0 91.6666666667%;max-width:91.6666666667%}.vt-col-xl-12{flex:0 0 100%;max-width:100%}}.vt-bg-token-grey-50{background:hsl(var(--grey-50))}.vt-bg-token-grey-100{background:hsl(var(--grey-100))}.vt-bg-token-grey-200{background:hsl(var(--grey-200))}.vt-bg-token-grey-300{background:hsl(var(--grey-300))}.vt-bg-token-grey-400{background:hsl(var(--grey-400))}.vt-bg-token-grey-500{background:hsl(var(--grey-500))}.vt-bg-token-grey-600{background:hsl(var(--grey-600))}.vt-bg-token-grey-700{background:hsl(var(--grey-700))}.vt-bg-token-grey-800{background:hsl(var(--grey-800))}.vt-bg-token-grey-900{background:hsl(var(--grey-900))}.vt-bg-token-grey-950{background:hsl(var(--grey-950))}.vt-bg-token-green-50{background:hsl(var(--green-50))}.vt-bg-token-green-100{background:hsl(var(--green-100))}.vt-bg-token-green-200{background:hsl(var(--green-200))}.vt-bg-token-green-300{background:hsl(var(--green-300))}.vt-bg-token-green-400{background:hsl(var(--green-400))}.vt-bg-token-green-500{background:hsl(var(--green-500))}.vt-bg-token-green-600{background:hsl(var(--green-600))}.vt-bg-token-green-700{background:hsl(var(--green-700))}.vt-bg-token-green-800{background:hsl(var(--green-800))}.vt-bg-token-green-900{background:hsl(var(--green-900))}.vt-bg-token-green-950{background:hsl(var(--green-950))}.vt-bg-token-blue-50{background:hsl(var(--blue-50))}.vt-bg-token-blue-100{background:hsl(var(--blue-100))}.vt-bg-token-blue-200{background:hsl(var(--blue-200))}.vt-bg-token-blue-300{background:hsl(var(--blue-300))}.vt-bg-token-blue-400{background:hsl(var(--blue-400))}.vt-bg-token-blue-500{background:hsl(var(--blue-500))}.vt-bg-token-blue-600{background:hsl(var(--blue-600))}.vt-bg-token-blue-700{background:hsl(var(--blue-700))}.vt-bg-token-blue-800{background:hsl(var(--blue-800))}.vt-bg-token-blue-900{background:hsl(var(--blue-900))}.vt-bg-token-blue-950{background:hsl(var(--blue-950))}.vt-bg-token-red-50{background:hsl(var(--red-50))}.vt-bg-token-red-100{background:hsl(var(--red-100))}.vt-bg-token-red-200{background:hsl(var(--red-200))}.vt-bg-token-red-300{background:hsl(var(--red-300))}.vt-bg-token-red-400{background:hsl(var(--red-400))}.vt-bg-token-red-500{background:hsl(var(--red-500))}.vt-bg-token-red-600{background:hsl(var(--red-600))}.vt-bg-token-red-700{background:hsl(var(--red-700))}.vt-bg-token-red-800{background:hsl(var(--red-800))}.vt-bg-token-red-900{background:hsl(var(--red-900))}.vt-bg-token-red-950{background:hsl(var(--red-950))}.vt-bg-token-orange-50{background:hsl(var(--orange-50))}.vt-bg-token-orange-100{background:hsl(var(--orange-100))}.vt-bg-token-orange-200{background:hsl(var(--orange-200))}.vt-bg-token-orange-300{background:hsl(var(--orange-300))}.vt-bg-token-orange-400{background:hsl(var(--orange-400))}.vt-bg-token-orange-500{background:hsl(var(--orange-500))}.vt-bg-token-orange-600{background:hsl(var(--orange-600))}.vt-bg-token-orange-700{background:hsl(var(--orange-700))}.vt-bg-token-orange-800{background:hsl(var(--orange-800))}.vt-bg-token-orange-900{background:hsl(var(--orange-900))}.vt-bg-token-orange-950{background:hsl(var(--orange-950))}.vt-bg-token-generic-0{background:hsl(var(--generic-0))}.vt-bg-token-generic-1000{background:hsl(var(--generic-1000))}.vt-token-table td{vertical-align:middle}.vt-colors-token-table{min-width:680px}.vt-type-scale{border:var(--border-width-thin) solid hsl(var(--border-default));border-radius:var(--radius-2xl);background:hsl(var(--surface-card));overflow:hidden}.vt-type-row{display:grid;grid-template-columns:140px 1fr;align-items:baseline;gap:24px;padding:20px 24px;border-bottom:var(--border-width-thin) solid hsl(var(--border-default))}.vt-type-row:last-child{border-bottom:0}.vt-type-meta{display:flex;flex-direction:column;gap:2px}.vt-type-name{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:hsl(var(--foreground-primary))}.vt-type-specs{font-size:var(--font-size-xs);color:hsl(var(--foreground-muted));font-family:"SF Mono",SFMono-Regular,ui-monospace,monospace}.vt-spacing-bar{background:hsl(var(--info-fill)/0.15);border:var(--border-width-default) solid hsl(var(--info-fill)/0.3);border-radius:var(--radius-sm);height:32px;transition:background-color var(--transition-normal)}.vt-spacing-bar:hover{background:hsl(var(--info-fill)/0.25)}@keyframes astroFadeInOut{0%{opacity:1}to{opacity:0}}@keyframes astroFadeIn{0%{opacity:0;mix-blend-mode:plus-lighter}to{opacity:1;mix-blend-mode:plus-lighter}}@keyframes astroFadeOut{0%{opacity:1;mix-blend-mode:plus-lighter}to{opacity:0;mix-blend-mode:plus-lighter}}@keyframes astroSlideFromRight{0%{transform:translate(100%)}}@keyframes astroSlideFromLeft{0%{transform:translate(-100%)}}@keyframes astroSlideToRight{to{transform:translate(100%)}}@keyframes astroSlideToLeft{to{transform:translate(-100%)}}@media(prefers-reduced-motion){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none !important}[data-astro-transition-scope]{animation:none !important}}.astro-route-announcer{position:absolute;left:0;top:0;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;white-space:nowrap;width:1px;height:1px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}