/*!
 * velocity-css v1.0.0
 * @author: Sven Kuhn
 * @www: https://www.holsterlabs.de
 * @license 
 * Copyright (c) 2026 Sven Kuhn
 */
@layer velocity, components, theme, utilities;
@layer velocity {
  :root,
  [data-vlx-theme="light"] {
    font-size: var(--vlx-font-size-base, 16px);
    /* =========================
     Spacing
     ========================= */
    --vlx-space-0: 0;
    --vlx-space-1: 0.25rem;
    --vlx-space-2: 0.5rem;
    --vlx-space-3: 0.75rem;
    --vlx-space-4: 1rem;
    --vlx-space-5: 1.5rem;
    --vlx-space-6: 2rem;
    --vlx-space-7: 3rem;
    --vlx-space-auto: auto;
    /* =========================
     Radius
     ========================= */
    --vlx-radius-0: 0;
    --vlx-radius-xs: 0.125rem;
    --vlx-radius-1: 0.25rem;
    --vlx-radius-2: 0.5rem;
    --vlx-radius-3: 0.75rem;
    --vlx-radius-4: 1rem;
    --vlx-radius-5: 1.5rem;
    --vlx-radius-pill: 9999px;
    /* =========================
     Typography
     ========================= */
    --vlx-font-size-xs: 0.75rem;
    --vlx-line-height-xs: 1.4;
    --vlx-font-size-s: 0.875rem;
    --vlx-line-height-s: 1.45;
    --vlx-font-size-base: 1rem;
    --vlx-line-height-base: 1.5;
    --vlx-font-size-l: 1.125rem;
    --vlx-line-height-l: 1.55;
    --vlx-font-size-xl: 1.25rem;
    --vlx-line-height-xl: 1.6;
    --vlx-font-size-2xl: 1.5rem;
    --vlx-line-height-2xl: 1.35;
    --vlx-font-size-3xl: 2rem;
    --vlx-line-height-3xl: 1.25;
    --vlx-text-width-s: 45ch;
    --vlx-text-width-m: 60ch;
    --vlx-text-width-l: 70ch;
    --vlx-text-width-xl: 80ch;
    /* =========================
     Shadow
     ========================= */
    --vlx-shadow-0: none;
    --vlx-shadow-1: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.08);
    --vlx-shadow-2: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
    --vlx-shadow-3: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    --vlx-shadow-4: 0 1rem 2rem rgba(0, 0, 0, 0.2);
    --vlx-font-weight-regular: 400;
    --vlx-font-weight-medium: 500;
    --vlx-font-weight-semibold: 600;
    --vlx-font-family-base: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --vlx-font-family-mono: Menlo, Monaco, Consolas, "Courier New", monospace;
    --vlx-font-feature-settings: "liga" 1, "kern" 1;
    --vlx-font-variation-settings: normal;
    /* =========================
     Flow & Text
     ========================= */
    --vlx-flow-space: 1em;
    --vlx-paragraph-margin-bottom: 1em;
    /* =========================
     Control
     ========================= */
    --vlx-control-font-size: var(--vlx-font-size-base);
    --vlx-control-line-height: 1.5;
    --vlx-control-padding-y: 0.5rem;
    --vlx-control-padding-x: 0.75rem;
    --vlx-control-border-width: 1px;
    --vlx-control-border-radius: var(--vlx-radius-1);
    /* =========================
     Brand
     ========================= */
    --vlx-color-primary: #2FAE8E;
    --vlx-color-primary-hover: color-mix(in srgb, var(--vlx-color-primary) 80%, var(--vlx-color-primary-contrast) 20%);
    --vlx-color-primary-100: #d5efe8;
    --vlx-color-primary-200: #acdfd2;
    --vlx-color-primary-300: #82cebb;
    --vlx-color-primary-400: #59bea5;
    --vlx-color-primary-500: #2FAE8E;
    --vlx-color-primary-600: #268b72;
    --vlx-color-primary-700: #1c6855;
    --vlx-color-primary-800: #134639;
    --vlx-color-primary-900: #09231c;
    --vlx-color-primary-contrast: #ffffff;
    /* =========================
     Color Roles
     ========================= */
    --vlx-color-text: #1a1a1a;
    --vlx-color-text-muted: #6b7280;
    --vlx-color-text-inverse: #ffffff;
    /* =========================
     Borders
     ========================= */
    --vlx-border-color: #ced4da;
    --vlx-border-color-soft: #e4e7ec;
    /* =========================
     Surfaces
     ========================= */
    --vlx-color-background: #ffffff;
    --vlx-color-surface: #ffffff;
    --vlx-color-surface-muted: #f7f8fa;
    /* =========================
     Links
     ========================= */
    --vlx-color-link: var(--vlx-color-primary);
    --vlx-color-link-hover: var(--vlx-color-primary-hover);
    /* =========================
     Highlight
     ========================= */
    --vlx-color-mark-text: #212529;
    --vlx-color-mark-background: #fff3b0;
    /* =========================
     Code
     ========================= */
    --vlx-color-code-text: #e83e8c;
    /* =========================
     Link styling
     ========================= */
    --vlx-link-text-decoration: underline;
    --vlx-link-text-decoration-hover: none;
    /* =========================
     Headings
     ========================= */
    --vlx-heading-font-family: var(--vlx-font-family-base);
    --vlx-heading-font-weight: 600;
    --vlx-heading-font-weight-strong: 700;
    --vlx-heading-font-weight-weak: 500;
    --vlx-heading-line-height: 1.25;
    --vlx-heading-margin-top: 1.5em;
    --vlx-heading-margin-bottom: 0.5em;
    --vlx-heading-color: var(--vlx-color-text);
    --vlx-h1-size: 2.25rem;
    --vlx-h2-size: 1.875rem;
    --vlx-h3-size: 1.5rem;
    --vlx-h4-size: 1.25rem;
    --vlx-h5-size: 1.125rem;
    --vlx-h6-size: 1rem;
    /* =========================
     Buttons
     ========================= */
    --vlx-button-padding-x: var(--vlx-control-padding-x);
    --vlx-button-padding-y: var(--vlx-control-padding-y);
    --vlx-button-border-radius: var(--vlx-control-border-radius);
    /* =========================
     Forms
     ========================= */
    --vlx-form-background-color: var(--vlx-color-surface);
    --vlx-form-background-color-disabled: #eef1f4;
    --vlx-form-border-color: var(--vlx-border-color);
    --vlx-form-padding-x: var(--vlx-control-padding-x);
    --vlx-form-padding-y: var(--vlx-control-padding-y);
    --vlx-form-border-radius: var(--vlx-control-border-radius);
    /* Select */
    --vlx-select-icon: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
    --vlx-select-icon-size: 0.35em;
    --vlx-select-icon-offset: 0.75rem;
    /* Check / Radio */
    --vlx-control-size: 1rem;
    --vlx-control-background-color-checked: var(--vlx-color-primary);
    --vlx-control-check-color: var(--vlx-color-primary-contrast);
    /* File */
    --vlx-file-button-background-color: var(--vlx-color-surface);
    --vlx-file-button-hover-background-color: color-mix(in srgb, var(--vlx-color-surface) 80%, var(--vlx-color-primary) 5%);
    --vlx-file-button-color: var(--vlx-color-text);
    /* =========================
     State
     ========================= */
    --vlx-state-focus: var(--vlx-color-primary);
    --vlx-state-focus-ring: color-mix(in srgb, var(--vlx-state-focus) 25%, transparent);
    --vlx-state-valid: #198754;
    --vlx-state-valid-background-color: color-mix(in srgb, var(--vlx-state-valid) 5%, transparent);
    --vlx-state-valid-ring: color-mix(in srgb, var(--vlx-state-valid) 25%, transparent);
    --vlx-state-invalid: #dc3545;
    --vlx-state-invalid-background-color: color-mix(in srgb, var(--vlx-state-invalid) 5%, transparent);
    --vlx-state-invalid-ring: color-mix(in srgb, var(--vlx-state-invalid) 25%, transparent);
    --vlx-state-hover-mix-color: #000000;
    --vlx-state-hover-mix: 8%;
    --vlx-state-active-mix-color: #000000;
    --vlx-state-active-mix: 12%;
    --vlx-state-disabled-opacity: 0.65;
    /* =========================
     Card
     ========================= */
    --vlx-card-background-color: var(--vlx-color-surface);
    --vlx-card-border-color: #dee2e6;
    --vlx-card-border-width: 1px;
    --vlx-card-border-radius: var(--vlx-control-border-radius);
    --vlx-card-padding: var(--vlx-space-4);
    /* =========================
     Nav
     ========================= */
    --vlx-nav-item-color: var(--vlx-color-text-muted);
    --vlx-nav-item-background-color: transparent;
    --vlx-nav-hover-color: var(--vlx-color-text);
    --vlx-nav-hover-background-color: color-mix(in srgb, var(--vlx-color-primary) 6%, transparent);
    --vlx-nav-active-color: var(--vlx-color-primary);
    --vlx-nav-active-background-color: color-mix(in srgb, var(--vlx-color-primary) 12%, transparent);
    /* =========================
     Transition
     ========================= */
    --vlx-duration-fast: 120ms;
    --vlx-duration-normal: 160ms;
    --vlx-duration-slow: 240ms;
    --vlx-ease-standard: ease;
    --vlx-ease-in: ease-in;
    --vlx-ease-out: ease-out;
    --vlx-ease-in-out: ease-in-out;
    --vlx-transition-transform: transform var(--vlx-duration-fast) var(--vlx-ease-standard);
    --vlx-transition-shadow: box-shadow var(--vlx-duration-fast) var(--vlx-ease-standard);
    /* =========================
     Motion
     ========================= */
    --vlx-motion-distance-xs: -1px;
    --vlx-motion-distance-s: -2px;
    --vlx-motion-distance-m: -4px;
    --vlx-motion-distance-l: -8px;
  }
  @media (prefers-color-scheme: dark) {
    :root:not([data-vlx-theme=light]) {
      /* =========================
     Shadow
     ========================= */
      --vlx-shadow-0: none;
      --vlx-shadow-1: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.4);
      --vlx-shadow-2: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.5);
      --vlx-shadow-3: 0 0.5rem 1rem rgba(0, 0, 0, 0.6);
      --vlx-shadow-4: 0 1rem 2rem rgba(0, 0, 0, 0.7);
      /* =========================
     Brand
     ========================= */
      --vlx-color-primary: #2FAE8E;
      --vlx-color-primary-hover: color-mix(in srgb, var(--vlx-color-primary) 80%, black 20%);
      --vlx-color-primary-100: #d5efe8;
      --vlx-color-primary-200: #acdfd2;
      --vlx-color-primary-300: #82cebb;
      --vlx-color-primary-400: #59bea5;
      --vlx-color-primary-500: #2FAE8E;
      --vlx-color-primary-600: #268b72;
      --vlx-color-primary-700: #1c6855;
      --vlx-color-primary-800: #134639;
      --vlx-color-primary-900: #09231c;
      --vlx-color-primary-contrast: #ffffff;
      /* =========================
     Color Roles
     ========================= */
      --vlx-color-text: #e5e7eb;
      --vlx-color-text-muted: #9ca3af;
      --vlx-color-text-inverse: #1a1a1a;
      /* =========================
     Borders
     ========================= */
      --vlx-border-color: #3f4754;
      --vlx-border-color-soft: #2a2f3a;
      /* =========================
     Surfaces
     ========================= */
      --vlx-color-background: #0f1115;
      --vlx-color-surface: #15181e;
      --vlx-color-surface-muted: #1c2028;
      /* =========================
     Links
     ========================= */
      --vlx-color-link: var(--vlx-color-primary);
      --vlx-color-link-hover: var(--vlx-color-primary-hover);
      /* =========================
     Highlight
     ========================= */
      --vlx-color-mark-text: #111827;
      --vlx-color-mark-background: #fde68a;
      /* =========================
     Code
     ========================= */
      --vlx-color-code-text: #f472b6;
      /* =========================
     Forms
     ========================= */
      --vlx-form-background-color: var(--vlx-color-surface);
      --vlx-form-background-color-disabled: #1f242c;
      --vlx-form-border-color: var(--vlx-border-color);
      /* Check / Radio */
      --vlx-control-size: 1rem;
      --vlx-control-background-color-checked: var(--vlx-color-primary);
      --vlx-control-check-color: var(--vlx-color-primary-contrast);
      /* File */
      --vlx-file-button-background-color: var(--vlx-color-surface);
      --vlx-file-button-hover-background-color: color-mix(in srgb, var(--vlx-color-surface) 80%, var(--vlx-color-primary) 5%);
      /* =========================
     State
     ========================= */
      --vlx-state-focus: var(--vlx-color-primary);
      --vlx-state-focus-ring: color-mix(in srgb, var(--vlx-state-focus) 25%, transparent);
      --vlx-state-valid: #198754;
      --vlx-state-valid-background-color: color-mix(in srgb, var(--vlx-state-valid) 5%, transparent);
      --vlx-state-valid-ring: color-mix(in srgb, var(--vlx-state-valid) 25%, transparent);
      --vlx-state-invalid: #dc3545;
      --vlx-state-invalid-background-color: color-mix(in srgb, var(--vlx-state-invalid) 5%, transparent);
      --vlx-state-invalid-ring: color-mix(in srgb, var(--vlx-state-invalid) 25%, transparent);
      --vlx-state-hover-mix-color: #ffffff;
      --vlx-state-hover-mix: 8%;
      --vlx-state-active-mix-color: #ffffff;
      --vlx-state-active-mix: 12%;
      --vlx-state-disabled-opacity: 0.55;
      /* =========================
     Card
     ========================= */
      --vlx-card-background-color: var(--vlx-color-surface);
      --vlx-card-border-color: var(--vlx-border-color-soft);
      /* =========================
     Nav
     ========================= */
      --vlx-nav-item-color: var(--vlx-color-text-muted);
      --vlx-nav-item-background-color: transparent;
      --vlx-nav-hover-color: var(--vlx-color-text);
      --vlx-nav-hover-background-color: color-mix(in srgb, var(--vlx-color-primary) 6%, transparent);
      --vlx-nav-active-color: var(--vlx-color-primary);
      --vlx-nav-active-background-color: color-mix(in srgb, var(--vlx-color-primary) 12%, transparent);
    }
  }
  :root[data-vlx-theme=dark] {
    /* =========================
     Shadow
     ========================= */
    --vlx-shadow-0: none;
    --vlx-shadow-1: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.4);
    --vlx-shadow-2: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.5);
    --vlx-shadow-3: 0 0.5rem 1rem rgba(0, 0, 0, 0.6);
    --vlx-shadow-4: 0 1rem 2rem rgba(0, 0, 0, 0.7);
    /* =========================
     Brand
     ========================= */
    --vlx-color-primary: #2FAE8E;
    --vlx-color-primary-hover: color-mix(in srgb, var(--vlx-color-primary) 80%, black 20%);
    --vlx-color-primary-100: #d5efe8;
    --vlx-color-primary-200: #acdfd2;
    --vlx-color-primary-300: #82cebb;
    --vlx-color-primary-400: #59bea5;
    --vlx-color-primary-500: #2FAE8E;
    --vlx-color-primary-600: #268b72;
    --vlx-color-primary-700: #1c6855;
    --vlx-color-primary-800: #134639;
    --vlx-color-primary-900: #09231c;
    --vlx-color-primary-contrast: #ffffff;
    /* =========================
     Color Roles
     ========================= */
    --vlx-color-text: #e5e7eb;
    --vlx-color-text-muted: #9ca3af;
    --vlx-color-text-inverse: #1a1a1a;
    /* =========================
     Borders
     ========================= */
    --vlx-border-color: #3f4754;
    --vlx-border-color-soft: #2a2f3a;
    /* =========================
     Surfaces
     ========================= */
    --vlx-color-background: #0f1115;
    --vlx-color-surface: #15181e;
    --vlx-color-surface-muted: #1c2028;
    /* =========================
     Links
     ========================= */
    --vlx-color-link: var(--vlx-color-primary);
    --vlx-color-link-hover: var(--vlx-color-primary-hover);
    /* =========================
     Highlight
     ========================= */
    --vlx-color-mark-text: #111827;
    --vlx-color-mark-background: #fde68a;
    /* =========================
     Code
     ========================= */
    --vlx-color-code-text: #f472b6;
    /* =========================
     Forms
     ========================= */
    --vlx-form-background-color: var(--vlx-color-surface);
    --vlx-form-background-color-disabled: #1f242c;
    --vlx-form-border-color: var(--vlx-border-color);
    /* Check / Radio */
    --vlx-control-size: 1rem;
    --vlx-control-background-color-checked: var(--vlx-color-primary);
    --vlx-control-check-color: var(--vlx-color-primary-contrast);
    /* File */
    --vlx-file-button-background-color: var(--vlx-color-surface);
    --vlx-file-button-hover-background-color: color-mix(in srgb, var(--vlx-color-surface) 80%, var(--vlx-color-primary) 5%);
    /* =========================
     State
     ========================= */
    --vlx-state-focus: var(--vlx-color-primary);
    --vlx-state-focus-ring: color-mix(in srgb, var(--vlx-state-focus) 25%, transparent);
    --vlx-state-valid: #198754;
    --vlx-state-valid-background-color: color-mix(in srgb, var(--vlx-state-valid) 5%, transparent);
    --vlx-state-valid-ring: color-mix(in srgb, var(--vlx-state-valid) 25%, transparent);
    --vlx-state-invalid: #dc3545;
    --vlx-state-invalid-background-color: color-mix(in srgb, var(--vlx-state-invalid) 5%, transparent);
    --vlx-state-invalid-ring: color-mix(in srgb, var(--vlx-state-invalid) 25%, transparent);
    --vlx-state-hover-mix-color: #ffffff;
    --vlx-state-hover-mix: 8%;
    --vlx-state-active-mix-color: #ffffff;
    --vlx-state-active-mix: 12%;
    --vlx-state-disabled-opacity: 0.55;
    /* =========================
     Card
     ========================= */
    --vlx-card-background-color: var(--vlx-color-surface);
    --vlx-card-border-color: var(--vlx-border-color-soft);
    /* =========================
     Nav
     ========================= */
    --vlx-nav-item-color: var(--vlx-color-text-muted);
    --vlx-nav-item-background-color: transparent;
    --vlx-nav-hover-color: var(--vlx-color-text);
    --vlx-nav-hover-background-color: color-mix(in srgb, var(--vlx-color-primary) 6%, transparent);
    --vlx-nav-active-color: var(--vlx-color-primary);
    --vlx-nav-active-background-color: color-mix(in srgb, var(--vlx-color-primary) 12%, transparent);
  }
  /* Box sizing */
  *,
  ::before,
  ::after,
  ::backdrop,
  ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  @media (prefers-reduced-motion: no-preference) {
    :root {
      scroll-behavior: smooth;
    }
  }
  /* Remove default margin */
  html,
  body,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  blockquote,
  pre,
  figure,
  dl,
  dd,
  ol,
  ul,
  fieldset,
  legend {
    margin: 0;
    padding: 0;
  }
  /* Body defaults */
  body {
    min-height: 100vh;
    text-rendering: optimizeSpeed;
  }
  /* Lists */
  ol,
  ul {
    list-style: none;
  }
  /* Media elements */
  img,
  picture,
  video,
  canvas,
  svg {
    display: block;
    max-width: 100%;
  }
  /* Forms: inherit fonts, neutralize browser styles */
  input,
  button,
  textarea,
  select {
    font: inherit;
    color: inherit;
    background-color: transparent;
    border: 0;
  }
  /* Buttons */
  button {
    cursor: pointer;
  }
  /* Remove default button styles */
  button,
  [type="button"],
  [type="reset"],
  [type="submit"] {
    appearance: none;
    -webkit-appearance: none;
    background: none;
  }
  /* Remove focus outlines (reintroduced via state styles) */
  :focus {
    outline: none;
  }
  /* Tables */
  table {
    border-collapse: collapse;
    border-spacing: 0;
  }
  /* Abbreviations */
  :where(abbr[title]) {
    text-decoration: none;
  }
  /* Address */
  address {
    font-style: normal;
  }
  /* Anchor reset (styling comes later) */
  a {
    color: inherit;
    text-decoration: none;
  }
  /* Hidden attribute */
  [hidden] {
    display: none !important;
  }
  /* Reduce motion */
  @media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.01ms !important;
      scroll-behavior: auto !important;
    }
  }
  hr {
    height: 0;
    color: inherit;
    border: 0;
    border-top: 1px solid;
  }
  html {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    tab-size: 4;
    font-feature-settings: var(--vlx-font-feature-settings, normal);
    font-variation-settings: var(--vlx-font-variation-settings, normal);
  }
  body {
    font-family: var(--vlx-font-family-base, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-size: var(--vlx-font-size-base, 1rem);
    font-weight: var(--vlx-font-weight-regular, 400);
    line-height: var(--vlx-line-height-base, 1.5);
    color: var(--vlx-color-text);
    background-color: var(--vlx-color-background);
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  p {
    margin-bottom: var(--vlx-paragraph-margin-bottom);
  }
  address {
    margin-bottom: var(--vlx-flow-space);
    font-style: normal;
    line-height: inherit;
  }
  blockquote {
    margin-bottom: var(--vlx-flow-space, 1em);
  }
  figure {
    margin-bottom: var(--vlx-flow-space, 1em);
  }
  h1,
  .h1,
  h2,
  .h2,
  h3,
  .h3,
  h4,
  .h4,
  h5,
  .h5,
  h6,
  .h6 {
    font-family: var(--vlx-heading-font-family);
    font-weight: var(--vlx-heading-font-weight);
    line-height: var(--vlx-heading-line-height);
    margin-top: var(--vlx-heading-margin-top);
    margin-bottom: var(--vlx-heading-margin-bottom);
    color: var(--vlx-heading-color);
  }
  h1,
  .h1 {
    font-size: var(--vlx-h1-size);
  }
  h2,
  .h2 {
    font-size: var(--vlx-h2-size);
  }
  h3,
  .h3 {
    font-size: var(--vlx-h3-size);
  }
  h4,
  .h4 {
    font-size: var(--vlx-h4-size);
  }
  h5,
  .h5 {
    font-size: var(--vlx-h5-size);
  }
  h6,
  .h6 {
    font-size: var(--vlx-h6-size);
  }
  :where(h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6):first-child {
    margin-top: 0;
  }
  p + h2,
  p + .h2,
  p + h3,
  p + .h3,
  p + h4,
  p + .h4 {
    margin-top: 2em;
  }
  ol,
  ul {
    padding-left: var(--vlx-list-padding-left, 1.25em);
  }
  ol {
    list-style: decimal;
  }
  ul {
    list-style: disc;
  }
  ol,
  ul,
  dl {
    margin-bottom: var(--vlx-flow-space, 1em);
  }
  ol ol,
  ul ul,
  ol ul,
  ul ol {
    margin-bottom: 0;
  }
  dt {
    font-weight: var(--vlx-dt-font-weight, bolder);
  }
  dt:not(:first-child) {
    margin-top: 0.75em;
  }
  dd {
    margin-bottom: 0.5em;
    margin-left: 0;
  }
  dd:last-child {
    margin-bottom: 0;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
    cursor: help;
    -webkit-text-decoration-skip-ink: none;
    text-decoration-skip-ink: none;
  }
  b,
  strong {
    font-weight: bolder;
  }
  small {
    font-size: 80%;
  }
  mark {
    padding: 0.1875em;
    color: var(--vlx-color-mark-text);
    background-color: var(--vlx-color-mark-background);
  }
  sub,
  sup {
    position: relative;
    font-size: 0.75em;
    line-height: 0;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  cite {
    font-style: normal;
    color: var(--vlx-color-text-muted);
  }
  a {
    color: var(--vlx-color-link);
    text-decoration: var(--vlx-link-text-decoration);
  }
  a:hover {
    color: var(--vlx-color-link-hover);
    text-decoration: var(--vlx-link-text-decoration-hover);
  }
  a:not([href]):not([class]),
  a:not([href]):not([class]):hover {
    color: inherit;
    text-decoration: none;
  }
  a:focus-visible {
    outline: 2px solid var(--vlx-state-focus);
    outline-offset: 2px;
  }
  button:focus-visible {
    outline: 2px solid var(--vlx-state-focus);
    outline-offset: 2px;
  }
  pre,
  code,
  kbd,
  samp {
    font-family: var(--vlx-font-family-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--vlx-font-feature-settings, normal);
    font-variation-settings: var(--vlx-font-variation-settings, normal);
    font-size: 1em;
  }
  pre {
    display: block;
    margin-bottom: var(--vlx-flow-space, 1em);
    overflow: auto;
  }
  pre code {
    font-size: inherit;
    color: inherit;
    word-break: normal;
  }
  code {
    color: var(--vlx-color-code-text);
    word-wrap: break-word;
  }
  a > code {
    color: inherit;
  }
  kbd {
    padding: 0.1875em 0.375em;
    color: var(--vlx-color-background);
    background-color: var(--vlx-color-text);
    border-radius: 0.25em;
  }
  kbd kbd {
    padding: 0;
  }
  img,
  svg,
  video,
  canvas,
  audio,
  iframe,
  embed,
  object {
    display: block;
    vertical-align: middle;
  }
  img,
  video {
    max-width: 100%;
    height: auto;
  }
  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring {
    outline: auto;
  }
  .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--vlx-space-1);
    font-family: inherit;
    font-size: var(--vlx-control-font-size);
    font-weight: 500;
    line-height: var(--vlx-control-line-height);
    padding: var(--vlx-button-padding-y) var(--vlx-button-padding-x);
    border-radius: var(--vlx-button-border-radius);
    border: var(--vlx-control-border-width) solid transparent;
    min-height: calc(var(--vlx-control-line-height) * 1em + (var(--vlx-button-padding-y) * 2));
    background: none;
    color: inherit;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    appearance: none;
    -webkit-appearance: none;
  }
  .btn:hover {
    text-decoration: none;
  }
  .btn:focus {
    outline: none;
  }
  .btn:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem var(--vlx-state-focus-ring);
    border-color: var(--vlx-state-focus);
  }
  .btn:disabled,
  .btn[aria-disabled="true"],
  .btn.is-disabled {
    opacity: var(--vlx-state-disabled-opacity);
    filter: grayscale(20%);
    pointer-events: none;
  }
  .btn--primary {
    color: var(--vlx-color-primary-contrast);
    background-color: var(--vlx-color-primary);
    border-color: var(--vlx-color-primary);
  }
  .btn--primary:hover {
    color: var(--vlx-color-primary-contrast);
    background-color: var(--vlx-color-primary-hover, var(--vlx-color-primary));
    border-color: var(--vlx-color-primary-hover, var(--vlx-color-primary));
  }
  .btn--primary:active {
    color: var(--vlx-color-primary-contrast);
    background-color: var(--vlx-color-primary-hover, var(--vlx-color-primary));
  }
  .btn--primary:focus {
    outline: none;
  }
  .btn--primary:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--vlx-color-primary), transparent 75%);
    border-color: var(--vlx-color-primary-hover, var(--vlx-color-primary));
  }
  .btn--secondary {
    color: var(--vlx-color-primary);
    background-color: transparent;
    border-color: currentColor;
  }
  .btn--secondary:hover {
    color: var(--vlx-color-primary);
    background-color: color-mix(in srgb, var(--vlx-color-primary), transparent 92%);
    border-color: currentColor;
  }
  .btn--secondary:active {
    color: var(--vlx-color-primary);
    background-color: rgba(0, 0, 0, 0.06);
  }
  .btn--secondary:focus {
    outline: none;
  }
  .btn--secondary:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--vlx-color-primary), transparent 75%);
    border-color: currentColor;
  }
  .btn--ghost {
    color: var(--vlx-color-text);
    background-color: transparent;
    border-color: transparent;
  }
  .btn--ghost:hover {
    color: var(--vlx-color-text);
    background-color: var(--vlx-color-surface-muted);
    border-color: transparent;
  }
  .btn--ghost:active {
    color: var(--vlx-color-text);
    background-color: color-mix(in srgb, var(--vlx-color-surface-muted), black var(--vlx-state-active-mix));
  }
  .btn--ghost:focus {
    outline: none;
  }
  .btn--ghost:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--vlx-color-text), transparent 80%);
  }
  .btn--link {
    padding: 0;
    background-color: transparent;
    border: 0;
    color: var(--vlx-color-link);
    text-decoration: var(--vlx-link-text-decoration);
  }
  .btn--link:hover {
    color: var(--vlx-color-link-hover);
    text-decoration: var(--vlx-link-text-decoration-hover);
  }
  .btn--link:focus {
    outline: none;
  }
  .btn--link:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--vlx-color-link), transparent 75%);
  }
  .btn--s {
    --vlx-button-padding-y: var(--vlx-space-1);
    --vlx-button-padding-x: var(--vlx-space-2);
    --vlx-control-font-size: var(--vlx-font-size-s);
  }
  .btn--l {
    --vlx-button-padding-y: var(--vlx-space-3);
    --vlx-button-padding-x: var(--vlx-space-4);
    --vlx-control-font-size: var(--vlx-font-size-l);
  }
  .card {
    display: block;
    background-color: var(--vlx-card-background-color);
    border: var(--vlx-card-border-width) solid var(--vlx-card-border-color);
    border-radius: var(--vlx-card-border-radius);
    padding: var(--vlx-card-padding);
  }
  .card__header {
    padding-bottom: var(--vlx-space-3);
  }
  .card__header {
    font-weight: 600;
  }
  .card__footer {
    padding-top: var(--vlx-space-3);
  }
  .card > .card__header + .card__body {
    padding-top: 0;
  }
  .card > .card__body + .card__footer {
    padding-top: 0;
  }
  .card__body {
    padding: 0;
  }
  label {
    display: inline-block;
    margin-bottom: var(--vlx-space-1);
    font-weight: 500;
  }
  input,
  select,
  textarea {
    display: block;
    width: 100%;
    font-family: inherit;
    font-size: var(--vlx-control-font-size);
    line-height: var(--vlx-control-line-height);
    color: var(--vlx-color-text);
    padding: var(--vlx-form-padding-y) var(--vlx-form-padding-x);
    background-color: var(--vlx-form-background-color);
    background-clip: padding-box;
    border: var(--vlx-control-border-width) solid var(--vlx-form-border-color);
    border-radius: var(--vlx-form-border-radius);
    appearance: none;
    -webkit-appearance: none;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  }
  textarea {
    resize: vertical;
    min-height: 6rem;
  }
  select {
    background-image: var(--vlx-select-icon);
    background-repeat: no-repeat;
    background-position: right calc(var(--vlx-select-icon-offset) + var(--vlx-select-icon-size)) center, right var(--vlx-select-icon-offset) center;
    background-size: var(--vlx-select-icon-size) var(--vlx-select-icon-size);
    color: var(--vlx-color-text);
  }
  input:focus,
  select:focus,
  textarea:focus {
    outline: none;
  }
  input:focus-visible,
  select:focus-visible,
  textarea:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem var(--vlx-state-focus-ring);
    border-color: var(--vlx-state-focus);
  }
  input:disabled,
  select:disabled,
  textarea:disabled,
  input[aria-disabled="true"],
  select[aria-disabled="true"],
  textarea[aria-disabled="true"],
  input.is-disabled,
  select.is-disabled,
  textarea.is-disabled {
    opacity: 1;
    color: var(--vlx-color-text-muted);
    background-color: var(--vlx-form-background-color-disabled);
    border-color: var(--vlx-border-color-soft);
  }
  ::placeholder {
    color: var(--vlx-color-text-muted);
    opacity: 1;
  }
  .form-field {
    margin-bottom: var(--vlx-flow-space);
  }
  .form-help {
    margin-top: var(--vlx-space-1);
    font-size: var(--vlx-font-size-s);
    color: var(--vlx-color-text-muted);
  }
  .form-check {
    display: block;
    padding-left: calc(var(--vlx-control-size) + var(--vlx-space-2));
    margin-bottom: var(--vlx-space-2);
  }
  .form-check > label {
    margin-bottom: 0;
  }
  input[type="checkbox"],
  input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    width: var(--vlx-control-size);
    height: var(--vlx-control-size);
    margin-left: calc((var(--vlx-control-size) + var(--vlx-space-2)) * -1);
    float: left;
    padding: 0;
    margin-top: 0.2em;
    border: var(--vlx-control-border-width) solid var(--vlx-form-border-color);
    background-color: var(--vlx-form-background-color);
    display: inline-grid;
    place-content: center;
    position: relative;
    cursor: pointer;
  }
  input[type="checkbox"]:focus,
  input[type="radio"]:focus {
    outline: none;
  }
  input[type="checkbox"]:focus-visible,
  input[type="radio"]:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem var(--vlx-state-focus-ring);
    border-color: var(--vlx-state-focus);
  }
  input[type="checkbox"]:disabled,
  input[type="radio"]:disabled,
  input[type="checkbox"][aria-disabled="true"],
  input[type="radio"][aria-disabled="true"],
  input[type="checkbox"].is-disabled,
  input[type="radio"].is-disabled {
    opacity: var(--vlx-state-disabled-opacity);
    filter: grayscale(20%);
    pointer-events: none;
  }
  input[type="checkbox"] ~ label,
  input[type="radio"] ~ label {
    cursor: pointer;
  }
  input[type="checkbox"]:disabled ~ label,
  input[type="radio"]:disabled ~ label {
    color: var(--vlx-color-text-muted);
    pointer-events: none;
  }
  input[type="checkbox"] {
    border-radius: 2px;
  }
  input[type="radio"] {
    border-radius: 50%;
  }
  input[type="checkbox"]:checked::before,
  input[type="radio"]:checked::before {
    content: "✓";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -55%);
    font-size: 0.75em;
    line-height: 1;
    color: var(--vlx-color-primary);
  }
  /* Radio dot */
  input[type="radio"]:checked::before {
    content: "";
    width: 0.45em;
    height: 0.45em;
    background-color: var(--vlx-color-primary);
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  input[type="file"] {
    display: block;
    width: 100%;
    font-family: inherit;
    font-size: var(--vlx-control-font-size);
    color: var(--vlx-color-text);
    padding: 0;
    border: var(--vlx-control-border-width) solid var(--vlx-form-border-color);
    border-radius: var(--vlx-form-border-radius);
    background-color: var(--vlx-form-background-color);
    cursor: pointer;
  }
  input[type="file"]::file-selector-button {
    font-family: inherit;
    font-size: inherit;
    padding: var(--vlx-form-padding-y) var(--vlx-form-padding-x);
    margin-right: var(--vlx-space-2);
    border: 0;
    border-right: var(--vlx-control-border-width) solid var(--vlx-form-border-color);
    border-radius: 0;
    background-color: var(--vlx-file-button-background-color);
    color: var(--vlx-file-button-color);
    cursor: pointer;
  }
  input[type="file"]::file-selector-button:focus {
    outline: none;
  }
  input[type="file"]::file-selector-button:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem var(--vlx-state-focus-ring);
    border-color: var(--vlx-state-focus);
  }
  input[type="file"]::file-selector-button:disabled,
  input[type="file"]::file-selector-button[aria-disabled="true"],
  input[type="file"]::file-selector-button.is-disabled {
    opacity: var(--vlx-state-disabled-opacity);
    filter: grayscale(20%);
    pointer-events: none;
  }
  input[type="file"]::file-selector-button:hover {
    background-color: var(--vlx-file-button-hover-background-color);
  }
  input[type="range"] {
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
    padding: 0;
    border: none;
    background: transparent;
  }
  /* Track */
  input[type="range"]::-webkit-slider-runnable-track {
    height: 0.4rem;
    background: var(--vlx-form-border-color);
    border-radius: 999px;
  }
  input[type="range"]::-moz-range-track {
    height: 0.4rem;
    background: var(--vlx-form-border-color);
    border-radius: 999px;
  }
  /* Thumb */
  input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 1rem;
    height: 1rem;
    background: var(--vlx-color-primary);
    border-radius: 50%;
    border: none;
    margin-top: -0.3rem;
  }
  input[type="range"]::-moz-range-thumb {
    width: 1rem;
    height: 1rem;
    background: var(--vlx-color-primary);
    border-radius: 50%;
    border: none;
  }
  .list-unstyled {
    list-style: none;
    padding-left: 0;
  }
  .list-inline {
    display: flex;
    gap: var(--vlx-space-2);
    list-style: none;
    padding-left: 0;
  }
  .nav {
    display: flex;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
  }
  .nav__link,
  .nav__button {
    display: block;
  }
  .nav-expand {
    flex-direction: row;
  }
  @media (min-width: 480px) {
    .nav-expand-s {
      flex-direction: row;
    }
  }
  @media (min-width: 768px) {
    .nav-expand-m {
      flex-direction: row;
    }
  }
  @media (min-width: 1024px) {
    .nav-expand-l {
      flex-direction: row;
    }
  }
  @media (min-width: 1280px) {
    .nav-expand-xl {
      flex-direction: row;
    }
  }
  table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    font-size: var(--vlx-font-size-base);
    line-height: var(--vlx-line-height-base);
  }
  caption {
    margin-bottom: var(--vlx-space-2);
    text-align: left;
    font-weight: var(--vlx-font-weight-medium);
  }
  th,
  td {
    padding: var(--vlx-space-2) var(--vlx-space-3);
    text-align: left;
    vertical-align: top;
  }
  th {
    font-weight: var(--vlx-font-weight-semibold);
  }
  thead th {
    border-bottom: 2px solid var(--vlx-border-color);
  }
  tbody tr + tr td {
    border-top: 1px solid var(--vlx-border-color-soft);
  }
  tfoot td {
    border-top: 2px solid var(--vlx-border-color);
    font-weight: var(--vlx-font-weight-medium);
  }
  td,
  th {
    word-wrap: break-word;
    hyphens: auto;
  }
  blockquote {
    margin: var(--vlx-space-4) 0;
    padding-left: var(--vlx-space-4);
    border-left: 3px solid var(--vlx-border-color-soft);
    font-style: italic;
  }
  blockquote > :last-child {
    margin-bottom: 0;
  }
  code,
  pre {
    font-family: var(--vlx-font-family-mono);
    font-size: 0.95em;
  }
  code {
    padding: 0.1em 0.3em;
    border-radius: var(--vlx-radius-1);
    background-color: var(--vlx-color-surface-muted);
  }
  pre {
    margin: var(--vlx-space-4) 0;
    padding: var(--vlx-space-3);
    overflow-x: auto;
    border-radius: var(--vlx-radius-1);
    background-color: var(--vlx-color-surface-muted);
  }
  pre code {
    padding: 0;
    background: none;
  }
  hr {
    margin: var(--vlx-space-5) 0;
    border: 0;
    border-top: 1px solid var(--vlx-border-color-soft);
  }
  .form-field.is-valid input,
  .form-field.is-valid select,
  .form-field.is-valid textarea {
    border-color: var(--vlx-state-valid);
    background-color: var(--vlx-state-valid-background-color);
  }
  .form-field.is-valid input:focus,
  .form-field.is-valid select:focus,
  .form-field.is-valid textarea:focus {
    outline: none;
  }
  .form-field.is-valid input:focus-visible,
  .form-field.is-valid select:focus-visible,
  .form-field.is-valid textarea:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem var(--vlx-state-valid-ring);
    border-color: var(--vlx-state-valid);
  }
  .form-field.is-valid .form-feedback,
  .form-field.is-valid .form-help,
  .form-field.is-valid label {
    color: var(--vlx-state-valid);
  }
  .form-field.is-invalid input,
  .form-field.is-invalid select,
  .form-field.is-invalid textarea {
    border-color: var(--vlx-state-invalid);
    background-color: var(--vlx-state-invalid-background-color);
  }
  .form-field.is-invalid input:focus,
  .form-field.is-invalid select:focus,
  .form-field.is-invalid textarea:focus {
    outline: none;
  }
  .form-field.is-invalid input:focus-visible,
  .form-field.is-invalid select:focus-visible,
  .form-field.is-invalid textarea:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem var(--vlx-state-invalid-ring);
    border-color: var(--vlx-state-invalid);
  }
  .form-field.is-invalid .form-feedback,
  .form-field.is-invalid .form-help,
  .form-field.is-invalid label {
    color: var(--vlx-state-invalid);
  }
  .form-check.is-valid .form-check-input {
    border-color: var(--vlx-state-valid);
  }
  .form-check.is-valid .form-check-input:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem var(--vlx-state-valid-ring);
  }
  .form-check.is-valid label,
  .form-check.is-valid .form-help {
    color: var(--vlx-state-valid);
  }
  .form-check.is-invalid .form-check-input {
    border-color: var(--vlx-state-invalid);
  }
  .form-check.is-invalid .form-check-input:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem var(--vlx-state-invalid-ring);
  }
  .form-check.is-invalid label,
  .form-check.is-invalid .form-help {
    color: var(--vlx-state-invalid);
  }
  .collapse:not(.open) {
    display: none;
  }
  .collapsing {
    height: 0;
    overflow: hidden;
    transition: height 0.4s ease-in-out;
  }
  @media (prefers-reduced-motion: reduce) {
    .collapsing {
      transition: none;
    }
  }
  .collapsing.collapse-horizontal {
    width: 0;
    height: auto;
    transition: width 0.4s ease-in-out;
  }
  @media (prefers-reduced-motion: reduce) {
    .collapsing.collapse-horizontal {
      transition: none;
    }
  }
}
@layer components {
  :root {
    --vlx-container-max-width: 72rem;
    --vlx-container-narrow-max-width: 48rem;
    --vlx-container-wide-max-width: 90rem;
    --vlx-container-padding-x: var(--vlx-space-4);
  }
  .container-fluid,
  .container {
    width: 100%;
    padding-inline: var(--vlx-container-padding-x);
  }
  .container {
    max-width: var(--vlx-container-max-width);
    margin-inline: auto;
  }
  .container.container--narrow {
    --vlx-container-max-width: var(--vlx-container-narrow-max-width);
  }
  .container.container--wide {
    --vlx-container-max-width: var(--vlx-container-wide-max-width);
  }
  .container.container--fluid {
    --vlx-container-max-width: 100%;
  }
  :root,
  [data-vlx-theme=light] {
    --vlx-dropdown-background-color: var(--vlx-card-background-color);
    --vlx-dropdown-border-width: var(--vlx-card-border-width);
    --vlx-dropdown-border-color: var(--vlx-card-border-color);
    --vlx-dropdown-border-radius: var(--vlx-card-border-radius);
    --vlx-dropdown-padding-y: var(--vlx-card-padding);
    --vlx-dropdown-link-background-color: var(--vlx-nav-item-background-color);
    --vlx-dropdown-link-color: var(--vlx-nav-item-color);
    --vlx-dropdown-link-hover-background-color: var(--vlx-nav-hover-background-color);
    --vlx-dropdown-link-hover-color: var(--vlx-nav-hover-color);
    --vlx-dropdown-link-active-background-color: var(--vlx-nav-active-background-color);
    --vlx-dropdown-link-active-color: var(--vlx-nav-active-color);
    --vlx-dropdown-item-padding-x: var(--vlx-card-padding);
    --vlx-dropdown-item-padding-y: var(--vlx-space-1);
  }
  @media (prefers-color-scheme: dark) {
    :root:not([data-vlx-theme=light]) {
      --vlx-dropdown-background-color: var(--vlx-card-background-color);
      --vlx-dropdown-border-color: var(--vlx-card-border-color);
      --vlx-dropdown-link-background-color: var(--vlx-nav-item-background-color);
      --vlx-dropdown-link-color: var(--vlx-nav-item-color);
      --vlx-dropdown-link-hover-background-color: var(--vlx-nav-hover-background-color);
      --vlx-dropdown-link-hover-color: var(--vlx-nav-hover-color);
      --vlx-dropdown-link-active-background-color: var(--vlx-nav-active-background-color);
      --vlx-dropdown-link-active-color: var(--vlx-nav-active-color);
    }
  }
  :root[data-vlx-theme=dark] {
    --vlx-dropdown-background-color: var(--vlx-card-background-color);
    --vlx-dropdown-border-color: var(--vlx-card-border-color);
    --vlx-dropdown-link-background-color: var(--vlx-nav-item-background-color);
    --vlx-dropdown-link-color: var(--vlx-nav-item-color);
    --vlx-dropdown-link-hover-background-color: var(--vlx-nav-hover-background-color);
    --vlx-dropdown-link-hover-color: var(--vlx-nav-hover-color);
    --vlx-dropdown-link-active-background-color: var(--vlx-nav-active-background-color);
    --vlx-dropdown-link-active-color: var(--vlx-nav-active-color);
  }
  .dropdown {
    position: relative;
    display: inline-block;
  }
  .dropdown > button::after {
    content: "▾";
    margin-left: 0.2rem;
    transition: transform 0.15s ease;
  }
  .dropdown__menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1020;
    list-style: none;
    margin: 0;
    min-width: 16rem;
    padding: var(--vlx-dropdown-padding-y) 0;
    background: var(--vlx-dropdown-background-color);
    border: var(--vlx-dropdown-border-width) solid var(--vlx-dropdown-border-color);
    border-radius: var(--vlx-dropdown-border-radius);
  }
  .dropdown--right .dropdown__menu {
    left: auto;
    right: 0;
  }
  .dropdown__item {
    display: block;
    width: 100%;
    padding: var(--vlx-dropdown-item-padding-y) var(--vlx-dropdown-item-padding-x);
    border: 0;
    background: var(--vlx-dropdown-link-background-color);
    color: var(--vlx-dropdown-link-color);
    text-align: left;
    text-decoration: none;
    cursor: pointer;
  }
  .dropdown__item:hover,
  .dropdown__item:focus-visible {
    background: var(--vlx-dropdown-link-hover-background-color);
    color: var(--vlx-dropdown-link-hover-color);
  }
  .dropdown__item.is-active,
  .dropdown__item.is-selected {
    background: var(--vlx-dropdown-link-active-background-color);
    color: var(--vlx-dropdown-link-active-color);
  }
  .is-open .dropdown__menu {
    display: block;
  }
  :root,
  [data-vlx-theme="light"] {
    --vlx-navbar-z-index: 1000;
    --vlx-navbar-padding-y: 0.5rem;
    --vlx-navbar-background-color: var(--vlx-color-surface);
    --vlx-navbar-shadow: rgba(0, 0, 0, 0.175);
    --vlx-navbar-font-size: 1rem;
    --vlx-navbar-color: var(--vlx-color-text-muted);
    --vlx-navbar-hover-color: var(--vlx-color-text);
    --vlx-navbar-brand-height: 2rem;
    --vlx-navbar-brand-padding-y: 0.25rem;
    --vlx-navbar-brand-font-size: 1.25rem;
    --vlx-navbar-brand-color: var(--vlx-color-primary);
    --vlx-navbar-brand-hover-color: var(--vlx-color-primary-hover);
    --vlx-navbar-link-color: var(--vlx-navbar-color);
    --vlx-navbar-link-hover-color: var(--vlx-navbar-hover-color);
    --vlx-navbar-link-active-color: var(--vlx-navbar-hover-color);
    --vlx-navbar-link-padding-y: 0.5rem;
    --vlx-navbar-link-padding-x: 0;
    --vlx-navbar-link-expanded-padding-y: 0;
    --vlx-navbar-link-expanded-padding-x: 0.5rem;
    --vlx-navbar-seperator-height: 1.5rem;
  }
  @media (prefers-color-scheme: dark) {
    :root:not([data-vlx-theme=light]) {
      --vlx-navbar-background-color: var(--vlx-color-surface);
      --vlx-navbar-shadow: rgba(255, 255, 255, 0.175);
      --vlx-navbar-color: var(--vlx-color-text-muted);
      --vlx-navbar-hover-color: var(--vlx-color-text);
      --vlx-navbar-brand-color: var(--vlx-color-primary);
      --vlx-navbar-brand-hover-color: var(--vlx-color-primary-hover);
      --vlx-navbar-link-color: var(--vlx-navbar-color);
      --vlx-navbar-link-hover-color: var(--vlx-navbar-hover-color);
      --vlx-navbar-link-active-color: var(--vlx-navbar-hover-color);
    }
  }
  :root[data-vlx-theme=dark] {
    --vlx-navbar-background-color: var(--vlx-color-surface);
    --vlx-navbar-shadow: rgba(255, 255, 255, 0.175);
    --vlx-navbar-color: var(--vlx-color-text-muted);
    --vlx-navbar-hover-color: var(--vlx-color-text);
    --vlx-navbar-brand-color: var(--vlx-color-primary);
    --vlx-navbar-brand-hover-color: var(--vlx-color-primary-hover);
    --vlx-navbar-link-color: var(--vlx-navbar-color);
    --vlx-navbar-link-hover-color: var(--vlx-navbar-hover-color);
    --vlx-navbar-link-active-color: var(--vlx-navbar-hover-color);
  }
  .navbar {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding: var(--vlx-navbar-padding-y, 0) 0;
    background-color: var(--vlx-navbar-background-color);
    box-shadow: 0 0.375rem 0.75rem var(--vlx-navbar-shadow);
    font-size: var(--vlx-navbar-font-size);
    color: var(--vlx-navbar-color);
  }
  .navbar > .container,
  .navbar > .container-fluid {
    display: flex;
    flex-wrap: inherit;
    align-items: center;
    justify-content: space-between;
  }
  .navbar.sticky-bottom {
    position: sticky;
    bottom: 0;
    z-index: var(--vlx-navbar-z-index);
  }
  .navbar.sticky-top {
    position: sticky;
    top: 0;
    z-index: var(--vlx-navbar-z-index);
  }
  .navbar .seperator,
  .navbar .seperator-line {
    display: block;
    background-color: var(--vlx-navbar-color);
    height: 1px;
    margin: 0.5rem 0;
  }
  .navbar .seperator {
    visibility: hidden;
  }
  .navbar .dropdown__menu {
    position: relative;
  }
  .navbar__brand {
    color: var(--vlx-navbar-brand-color);
    padding-top: var(--vlx-navbar-brand-padding-y);
    padding-bottom: var(--vlx-navbar-brand-padding-y);
    text-decoration: none;
    font-size: var(--vlx-navbar-brand-font-size);
    line-height: 1;
    white-space: nowrap;
  }
  .navbar__brand:hover {
    color: var(--vlx-navbar-brand-hover-color);
    text-decoration: none;
    line-height: 1;
  }
  .navbar__brand svg,
  .navbar__brand img {
    height: var(--vlx-navbar-brand-height);
    width: auto;
  }
  .navbar__toggle {
    background: transparent;
    position: relative;
    padding: 0.5625rem 0.625rem;
  }
  .navbar__toggle .navbar__toggle-bar {
    display: block;
    width: 22px;
    height: 2px;
    background-color: var(--vlx-color-text);
    margin: 4px 0;
    transition: all 0.2s;
  }
  .navbar__toggle .navbar__toggle-bar {
    -webkit-transition: all 0.2s ease-in-out 0s;
    transition: all 0.2s ease-in-out 0s;
  }
  .navbar__toggle:not(.collapsed) .navbar-toggle-bar:nth-child(1) {
    -webkit-transform: translateY(0.375rem) rotate(45deg);
    transform: translateY(0.375rem) rotate(45deg);
  }
  .navbar__toggle:not(.collapsed) .navbar-toggle-bar:nth-child(2) {
    opacity: 0;
  }
  .navbar__toggle:not(.collapsed) .navbar-toggle-bar:nth-child(3) {
    -webkit-transform: translateY(-0.375rem) rotate(-45deg);
    transform: translateY(-0.375rem) rotate(-45deg);
  }
  .navbar__collapse {
    flex-grow: 1;
    flex-basis: 100%;
    align-items: center;
    flex-wrap: wrap;
  }
  .collapse:not(.open) {
    display: none;
  }
  .navbar__nav .nav__link,
  .navbar__nav .nav__button {
    position: relative;
    padding: var(--vlx-navbar-link-padding-y) var(--vlx-navbar-link-padding-x);
    line-height: 1.5rem;
    font-size: var(--vlx-navbar-font-size);
    color: var(--vlx-navbar-link-color);
    text-decoration: none;
    transition: color 0.15s ease-in-out;
    border: 0;
  }
  .navbar__nav .nav__link:hover,
  .navbar__nav .nav__button:hover,
  .navbar__nav .nav__link:focus,
  .navbar__nav .nav__button:focus {
    color: var(--vlx-navbar-link-hover-color);
    text-decoration: none;
  }
  .navbar__nav .nav__item.is-active > .nav__link,
  .navbar__nav .nav__item.is-open > .nav__link,
  .navbar__nav .nav__item.is-active > .nav__button,
  .navbar__nav .nav__item.is-open > .nav__button {
    text-decoration: none;
    color: var(--vlx-navbar-link-active-color);
  }
  .navbar__meta {
    padding-top: var(--vlx-navbar-padding-y);
  }
  @media (min-width: 480px) {
    .navbar-expand-s .navbar__collapse {
      display: flex !important;
      flex-basis: auto;
    }
    .navbar-expand-s .navbar__toggle {
      display: none;
    }
    .navbar-expand-s .navbar__collapse {
      display: flex;
      flex-basis: auto;
    }
    .navbar-expand-s .navbar__meta {
      display: flex;
      width: 100%;
      padding-top: 0;
    }
    .navbar-expand-s .nav {
      flex-direction: row;
    }
    .navbar-expand-s .navbar__nav .nav__link,
    .navbar-expand-s .navbar__nav .nav__button {
      padding: var(--vlx-navbar-link-expanded-padding-y) var(--vlx-navbar-link-expanded-padding-x);
      line-height: 1rem;
    }
    .navbar-expand-s .dropdown__menu {
      position: absolute;
      top: calc(100% + (var(--vlx-navbar-padding-y) / 2));
      z-index: calc(var(--vlx-navbar-z-index) + 10);
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    }
    .navbar-expand-s .seperator,
    .navbar-expand-s .seperator-line {
      width: 1px;
      height: var(--vlx-navbar-seperator-height);
      margin: 0 0.5rem;
    }
  }
  @media (min-width: 768px) {
    .navbar-expand-m .navbar__collapse {
      display: flex !important;
      flex-basis: auto;
    }
    .navbar-expand-m .navbar__toggle {
      display: none;
    }
    .navbar-expand-m .navbar__collapse {
      display: flex;
      flex-basis: auto;
    }
    .navbar-expand-m .navbar__meta {
      display: flex;
      width: 100%;
      padding-top: 0;
    }
    .navbar-expand-m .nav {
      flex-direction: row;
    }
    .navbar-expand-m .navbar__nav .nav__link,
    .navbar-expand-m .navbar__nav .nav__button {
      padding: var(--vlx-navbar-link-expanded-padding-y) var(--vlx-navbar-link-expanded-padding-x);
      line-height: 1rem;
    }
    .navbar-expand-m .dropdown__menu {
      position: absolute;
      top: calc(100% + (var(--vlx-navbar-padding-y) / 2));
      z-index: calc(var(--vlx-navbar-z-index) + 10);
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    }
    .navbar-expand-m .seperator,
    .navbar-expand-m .seperator-line {
      width: 1px;
      height: 1.5rem;
      margin: 0 0.5rem;
    }
  }
  @media (min-width: 1024px) {
    .navbar-expand-l .navbar__collapse {
      display: flex !important;
      flex-basis: auto;
    }
    .navbar-expand-l .navbar__toggle {
      display: none;
    }
    .navbar-expand-l .navbar__collapse {
      display: flex;
      flex-basis: auto;
    }
    .navbar-expand-l .navbar__meta {
      display: flex;
      width: 100%;
      padding-top: 0;
    }
    .navbar-expand-l .nav {
      flex-direction: row;
    }
    .navbar-expand-l .navbar__nav .nav__link,
    .navbar-expand-l .navbar__nav .nav__button {
      padding: var(--vlx-navbar-link-expanded-padding-y) var(--vlx-navbar-link-expanded-padding-x);
      line-height: 1rem;
    }
    .navbar-expand-l .dropdown__menu {
      position: absolute;
      top: calc(100% + var(--vlx-navbar-padding-y));
      z-index: calc(var(--vlx-navbar-z-index) + 10);
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    }
    .navbar-expand-l .seperator,
    .navbar-expand-l .seperator-line {
      width: 1px;
      height: var(--vlx-navbar-seperator-height);
      margin: 0 0.5rem;
    }
  }
  @media (min-width: 1280px) {
    .navbar-expand-xl .navbar__collapse {
      display: flex !important;
      flex-basis: auto;
    }
    .navbar-expand-xl .navbar__toggle {
      display: none;
    }
    .navbar-expand-xl .navbar__collapse {
      display: flex;
      flex-basis: auto;
    }
    .navbar-expand-xl .navbar__meta {
      display: flex;
      width: 100%;
      padding-top: 0;
    }
    .navbar-expand-xl .nav {
      flex-direction: row;
    }
    .navbar-expand-xl .navbar__nav .nav__link,
    .navbar-expand-xl .navbar__nav .nav__button {
      padding: var(--vlx-navbar-link-expanded-padding-y) var(--vlx-navbar-link-expanded-padding-x);
      line-height: 1rem;
    }
    .navbar-expand-xl .dropdown__menu {
      position: absolute;
      top: calc(100% + (var(--vlx-navbar-padding-y) / 2));
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    }
    .navbar-expand-xl .seperator,
    .navbar-expand-xl .seperator-line {
      width: 1px;
      height: var(--vlx-navbar-seperator-height);
      margin: 0 0.5rem;
    }
  }
  :root {
    --vlx-grid-gutter-width: calc(var(--vlx-container-padding-x) * 2);
  }
  .cluster {
    display: flex;
    flex-wrap: wrap;
    margin-inline: calc(-0.5 * var(--vlx-grid-gutter-width));
  }
  .cluster > * {
    flex: 0 0 100%;
    max-width: 100%;
    padding-inline: calc(0.5 * var(--vlx-grid-gutter-width));
  }
  .direction-row {
    flex-direction: row;
  }
  .direction-reverse {
    flex-direction: row-reverse;
  }
  .direction-column {
    flex-direction: column;
  }
  .direction-column-reverse {
    flex-direction: column-reverse;
  }
  .align-items-top {
    align-items: flex-start !important;
  }
  .align-items-center {
    align-items: center !important;
  }
  .align-items-bottom {
    align-items: flex-end !important;
  }
  .justify-items-left {
    justify-content: flex-start;
  }
  .justify-items-right {
    justify-content: flex-end;
  }
  .justify-items-center {
    justify-content: center;
  }
  .justify-items-between {
    justify-content: space-between;
  }
  .justify-items-around {
    justify-content: space-around;
  }
  .align-self-top {
    align-self: flex-start !important;
  }
  .align-self-center {
    align-self: center !important;
  }
  .align-self-bottom {
    align-self: flex-end !important;
  }
  .col-1 {
    flex: 0 0 8.33333333%;
    max-width: 8.33333333%;
  }
  .col-2 {
    flex: 0 0 16.66666667%;
    max-width: 16.66666667%;
  }
  .col-3 {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-4 {
    flex: 0 0 33.33333333%;
    max-width: 33.33333333%;
  }
  .col-5 {
    flex: 0 0 41.66666667%;
    max-width: 41.66666667%;
  }
  .col-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-7 {
    flex: 0 0 58.33333333%;
    max-width: 58.33333333%;
  }
  .col-8 {
    flex: 0 0 66.66666667%;
    max-width: 66.66666667%;
  }
  .col-9 {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-10 {
    flex: 0 0 83.33333333%;
    max-width: 83.33333333%;
  }
  .col-11 {
    flex: 0 0 91.66666667%;
    max-width: 91.66666667%;
  }
  .col-12 {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .col-auto {
    flex: 1 1 0;
    width: auto;
  }
  .col-content {
    flex: 0 0 auto;
    width: auto;
  }
  .col-order-first {
    order: -1;
  }
  .col-order-1 {
    order: 1;
  }
  .col-order-2 {
    order: 2;
  }
  .col-order-3 {
    order: 3;
  }
  .col-order-4 {
    order: 4;
  }
  .col-order-5 {
    order: 5;
  }
  .col-order-6 {
    order: 6;
  }
  .col-order-7 {
    order: 7;
  }
  .col-order-8 {
    order: 8;
  }
  .col-order-9 {
    order: 9;
  }
  .col-order-10 {
    order: 10;
  }
  .col-order-11 {
    order: 11;
  }
  .col-order-12 {
    order: 12;
  }
  .col-order-last {
    order: 13;
  }
  @media (min-width: 480px) {
    .direction-row-s {
      flex-direction: row;
    }
    .direction-reverse-s {
      flex-direction: row-reverse;
    }
    .direction-column-s {
      flex-direction: column;
    }
    .direction-column-reverse-s {
      flex-direction: column-reverse;
    }
    .align-items-top-s {
      align-items: flex-start !important;
    }
    .align-items-center-s {
      align-items: center !important;
    }
    .align-items-bottom-s {
      align-items: flex-end !important;
    }
    .justify-items-left-s {
      justify-content: flex-start;
    }
    .justify-items-right-s {
      justify-content: flex-end;
    }
    .justify-items-center-s {
      justify-content: center;
    }
    .justify-items-between-s {
      justify-content: space-between;
    }
    .justify-items-around-s {
      justify-content: space-around;
    }
    .align-self-top-s {
      align-self: flex-start !important;
    }
    .align-self-center-s {
      align-self: center !important;
    }
    .align-self-bottom-s {
      align-self: flex-end !important;
    }
    .col-1-s {
      flex: 0 0 8.33333333%;
      max-width: 8.33333333%;
    }
    .col-2-s {
      flex: 0 0 16.66666667%;
      max-width: 16.66666667%;
    }
    .col-3-s {
      flex: 0 0 25%;
      max-width: 25%;
    }
    .col-4-s {
      flex: 0 0 33.33333333%;
      max-width: 33.33333333%;
    }
    .col-5-s {
      flex: 0 0 41.66666667%;
      max-width: 41.66666667%;
    }
    .col-6-s {
      flex: 0 0 50%;
      max-width: 50%;
    }
    .col-7-s {
      flex: 0 0 58.33333333%;
      max-width: 58.33333333%;
    }
    .col-8-s {
      flex: 0 0 66.66666667%;
      max-width: 66.66666667%;
    }
    .col-9-s {
      flex: 0 0 75%;
      max-width: 75%;
    }
    .col-10-s {
      flex: 0 0 83.33333333%;
      max-width: 83.33333333%;
    }
    .col-11-s {
      flex: 0 0 91.66666667%;
      max-width: 91.66666667%;
    }
    .col-12-s {
      flex: 0 0 100%;
      max-width: 100%;
    }
    .col-auto-s {
      flex: 1 1 0;
      width: auto;
    }
    .col-content-s {
      flex: 0 0 auto;
      width: auto;
    }
    .col-order-first-s {
      order: -1;
    }
    .col-order-1-s {
      order: 1;
    }
    .col-order-2-s {
      order: 2;
    }
    .col-order-3-s {
      order: 3;
    }
    .col-order-4-s {
      order: 4;
    }
    .col-order-5-s {
      order: 5;
    }
    .col-order-6-s {
      order: 6;
    }
    .col-order-7-s {
      order: 7;
    }
    .col-order-8-s {
      order: 8;
    }
    .col-order-9-s {
      order: 9;
    }
    .col-order-10-s {
      order: 10;
    }
    .col-order-11-s {
      order: 11;
    }
    .col-order-12-s {
      order: 12;
    }
    .col-order-last-s {
      order: 13;
    }
  }
  @media (min-width: 768px) {
    .direction-row-m {
      flex-direction: row;
    }
    .direction-reverse-m {
      flex-direction: row-reverse;
    }
    .direction-column-m {
      flex-direction: column;
    }
    .direction-column-reverse-m {
      flex-direction: column-reverse;
    }
    .align-items-top-m {
      align-items: flex-start !important;
    }
    .align-items-center-m {
      align-items: center !important;
    }
    .align-items-bottom-m {
      align-items: flex-end !important;
    }
    .justify-items-left-m {
      justify-content: flex-start;
    }
    .justify-items-right-m {
      justify-content: flex-end;
    }
    .justify-items-center-m {
      justify-content: center;
    }
    .justify-items-between-m {
      justify-content: space-between;
    }
    .justify-items-around-m {
      justify-content: space-around;
    }
    .align-self-top-m {
      align-self: flex-start !important;
    }
    .align-self-center-m {
      align-self: center !important;
    }
    .align-self-bottom-m {
      align-self: flex-end !important;
    }
    .col-1-m {
      flex: 0 0 8.33333333%;
      max-width: 8.33333333%;
    }
    .col-2-m {
      flex: 0 0 16.66666667%;
      max-width: 16.66666667%;
    }
    .col-3-m {
      flex: 0 0 25%;
      max-width: 25%;
    }
    .col-4-m {
      flex: 0 0 33.33333333%;
      max-width: 33.33333333%;
    }
    .col-5-m {
      flex: 0 0 41.66666667%;
      max-width: 41.66666667%;
    }
    .col-6-m {
      flex: 0 0 50%;
      max-width: 50%;
    }
    .col-7-m {
      flex: 0 0 58.33333333%;
      max-width: 58.33333333%;
    }
    .col-8-m {
      flex: 0 0 66.66666667%;
      max-width: 66.66666667%;
    }
    .col-9-m {
      flex: 0 0 75%;
      max-width: 75%;
    }
    .col-10-m {
      flex: 0 0 83.33333333%;
      max-width: 83.33333333%;
    }
    .col-11-m {
      flex: 0 0 91.66666667%;
      max-width: 91.66666667%;
    }
    .col-12-m {
      flex: 0 0 100%;
      max-width: 100%;
    }
    .col-auto-m {
      flex: 1 1 0;
      width: auto;
    }
    .col-content-m {
      flex: 0 0 auto;
      width: auto;
    }
    .col-order-first-m {
      order: -1;
    }
    .col-order-1-m {
      order: 1;
    }
    .col-order-2-m {
      order: 2;
    }
    .col-order-3-m {
      order: 3;
    }
    .col-order-4-m {
      order: 4;
    }
    .col-order-5-m {
      order: 5;
    }
    .col-order-6-m {
      order: 6;
    }
    .col-order-7-m {
      order: 7;
    }
    .col-order-8-m {
      order: 8;
    }
    .col-order-9-m {
      order: 9;
    }
    .col-order-10-m {
      order: 10;
    }
    .col-order-11-m {
      order: 11;
    }
    .col-order-12-m {
      order: 12;
    }
    .col-order-last-m {
      order: 13;
    }
  }
  @media (min-width: 1024px) {
    .direction-row-l {
      flex-direction: row;
    }
    .direction-reverse-l {
      flex-direction: row-reverse;
    }
    .direction-column-l {
      flex-direction: column;
    }
    .direction-column-reverse-l {
      flex-direction: column-reverse;
    }
    .align-items-top-l {
      align-items: flex-start !important;
    }
    .align-items-center-l {
      align-items: center !important;
    }
    .align-items-bottom-l {
      align-items: flex-end !important;
    }
    .justify-items-left-l {
      justify-content: flex-start;
    }
    .justify-items-right-l {
      justify-content: flex-end;
    }
    .justify-items-center-l {
      justify-content: center;
    }
    .justify-items-between-l {
      justify-content: space-between;
    }
    .justify-items-around-l {
      justify-content: space-around;
    }
    .align-self-top-l {
      align-self: flex-start !important;
    }
    .align-self-center-l {
      align-self: center !important;
    }
    .align-self-bottom-l {
      align-self: flex-end !important;
    }
    .col-1-l {
      flex: 0 0 8.33333333%;
      max-width: 8.33333333%;
    }
    .col-2-l {
      flex: 0 0 16.66666667%;
      max-width: 16.66666667%;
    }
    .col-3-l {
      flex: 0 0 25%;
      max-width: 25%;
    }
    .col-4-l {
      flex: 0 0 33.33333333%;
      max-width: 33.33333333%;
    }
    .col-5-l {
      flex: 0 0 41.66666667%;
      max-width: 41.66666667%;
    }
    .col-6-l {
      flex: 0 0 50%;
      max-width: 50%;
    }
    .col-7-l {
      flex: 0 0 58.33333333%;
      max-width: 58.33333333%;
    }
    .col-8-l {
      flex: 0 0 66.66666667%;
      max-width: 66.66666667%;
    }
    .col-9-l {
      flex: 0 0 75%;
      max-width: 75%;
    }
    .col-10-l {
      flex: 0 0 83.33333333%;
      max-width: 83.33333333%;
    }
    .col-11-l {
      flex: 0 0 91.66666667%;
      max-width: 91.66666667%;
    }
    .col-12-l {
      flex: 0 0 100%;
      max-width: 100%;
    }
    .col-auto-l {
      flex: 1 1 0;
      width: auto;
    }
    .col-content-l {
      flex: 0 0 auto;
      width: auto;
    }
    .col-order-first-l {
      order: -1;
    }
    .col-order-1-l {
      order: 1;
    }
    .col-order-2-l {
      order: 2;
    }
    .col-order-3-l {
      order: 3;
    }
    .col-order-4-l {
      order: 4;
    }
    .col-order-5-l {
      order: 5;
    }
    .col-order-6-l {
      order: 6;
    }
    .col-order-7-l {
      order: 7;
    }
    .col-order-8-l {
      order: 8;
    }
    .col-order-9-l {
      order: 9;
    }
    .col-order-10-l {
      order: 10;
    }
    .col-order-11-l {
      order: 11;
    }
    .col-order-12-l {
      order: 12;
    }
    .col-order-last-l {
      order: 13;
    }
  }
  @media (min-width: 1280px) {
    .direction-row-xl {
      flex-direction: row;
    }
    .direction-reverse-xl {
      flex-direction: row-reverse;
    }
    .direction-column-xl {
      flex-direction: column;
    }
    .direction-column-reverse-xl {
      flex-direction: column-reverse;
    }
    .align-items-top-xl {
      align-items: flex-start !important;
    }
    .align-items-center-xl {
      align-items: center !important;
    }
    .align-items-bottom-xl {
      align-items: flex-end !important;
    }
    .justify-items-left-xl {
      justify-content: flex-start;
    }
    .justify-items-right-xl {
      justify-content: flex-end;
    }
    .justify-items-center-xl {
      justify-content: center;
    }
    .justify-items-between-xl {
      justify-content: space-between;
    }
    .justify-items-around-xl {
      justify-content: space-around;
    }
    .align-self-top-xl {
      align-self: flex-start !important;
    }
    .align-self-center-xl {
      align-self: center !important;
    }
    .align-self-bottom-xl {
      align-self: flex-end !important;
    }
    .col-1-xl {
      flex: 0 0 8.33333333%;
      max-width: 8.33333333%;
    }
    .col-2-xl {
      flex: 0 0 16.66666667%;
      max-width: 16.66666667%;
    }
    .col-3-xl {
      flex: 0 0 25%;
      max-width: 25%;
    }
    .col-4-xl {
      flex: 0 0 33.33333333%;
      max-width: 33.33333333%;
    }
    .col-5-xl {
      flex: 0 0 41.66666667%;
      max-width: 41.66666667%;
    }
    .col-6-xl {
      flex: 0 0 50%;
      max-width: 50%;
    }
    .col-7-xl {
      flex: 0 0 58.33333333%;
      max-width: 58.33333333%;
    }
    .col-8-xl {
      flex: 0 0 66.66666667%;
      max-width: 66.66666667%;
    }
    .col-9-xl {
      flex: 0 0 75%;
      max-width: 75%;
    }
    .col-10-xl {
      flex: 0 0 83.33333333%;
      max-width: 83.33333333%;
    }
    .col-11-xl {
      flex: 0 0 91.66666667%;
      max-width: 91.66666667%;
    }
    .col-12-xl {
      flex: 0 0 100%;
      max-width: 100%;
    }
    .col-auto-xl {
      flex: 1 1 0;
      width: auto;
    }
    .col-content-xl {
      flex: 0 0 auto;
      width: auto;
    }
    .col-order-first-xl {
      order: -1;
    }
    .col-order-1-xl {
      order: 1;
    }
    .col-order-2-xl {
      order: 2;
    }
    .col-order-3-xl {
      order: 3;
    }
    .col-order-4-xl {
      order: 4;
    }
    .col-order-5-xl {
      order: 5;
    }
    .col-order-6-xl {
      order: 6;
    }
    .col-order-7-xl {
      order: 7;
    }
    .col-order-8-xl {
      order: 8;
    }
    .col-order-9-xl {
      order: 9;
    }
    .col-order-10-xl {
      order: 10;
    }
    .col-order-11-xl {
      order: 11;
    }
    .col-order-12-xl {
      order: 12;
    }
    .col-order-last-xl {
      order: 13;
    }
  }
  :root {
    --vlx-icon-alert: url("../icons/circle-alert.svg");
    --vlx-icon-api: url("../icons/webhook.svg");
    --vlx-icon-arrow-down: url("../icons/arrow-down.svg");
    --vlx-icon-arrow-left: url("../icons/arrow-left.svg");
    --vlx-icon-arrow-right: url("../icons/arrow-right.svg");
    --vlx-icon-arrow-up: url("../icons/arrow-up.svg");
    --vlx-icon-article: url("../icons/newspaper.svg");
    --vlx-icon-at: url("../icons/at-sign.svg");
    --vlx-icon-at-sign: url("../icons/at-sign.svg");
    --vlx-icon-attachment: url("../icons/paperclip.svg");
    --vlx-icon-bell: url("../icons/bell.svg");
    --vlx-icon-bell-off: url("../icons/bell-off.svg");
    --vlx-icon-bookmark: url("../icons/bookmark.svg");
    --vlx-icon-bookmark-check: url("../icons/bookmark-check.svg");
    --vlx-icon-bug: url("../icons/bug.svg");
    --vlx-icon-calendar: url("../icons/calendar.svg");
    --vlx-icon-camera: url("../icons/camera.svg");
    --vlx-icon-cart: url("../icons/shopping-cart.svg");
    --vlx-icon-chat: url("../icons/message-circle.svg");
    --vlx-icon-chat-check: url("../icons/message-circle-check.svg");
    --vlx-icon-chat-dots: url("../icons/message-circle-more.svg");
    --vlx-icon-check: url("../icons/check.svg");
    --vlx-icon-check-circle: url("../icons/circle-check.svg");
    --vlx-icon-chevron-down: url("../icons/chevron-down.svg");
    --vlx-icon-chevron-left: url("../icons/chevron-left.svg");
    --vlx-icon-chevron-right: url("../icons/chevron-right.svg");
    --vlx-icon-chevron-up: url("../icons/chevron-up.svg");
    --vlx-icon-circle-alert: url("../icons/circle-alert.svg");
    --vlx-icon-circle-check: url("../icons/circle-check.svg");
    --vlx-icon-circle-help: url("../icons/circle-help.svg");
    --vlx-icon-circle-x: url("../icons/circle-x.svg");
    --vlx-icon-clipboard: url("../icons/clipboard.svg");
    --vlx-icon-clipboard-paste: url("../icons/clipboard-paste.svg");
    --vlx-icon-clock: url("../icons/clock.svg");
    --vlx-icon-close: url("../icons/x.svg");
    --vlx-icon-cloud: url("../icons/cloud.svg");
    --vlx-icon-cloud-download: url("../icons/cloud-download.svg");
    --vlx-icon-cloud-upload: url("../icons/cloud-upload.svg");
    --vlx-icon-code: url("../icons/code.svg");
    --vlx-icon-columns: url("../icons/columns-3.svg");
    --vlx-icon-columns-3: url("../icons/columns-3.svg");
    --vlx-icon-compass: url("../icons/compass.svg");
    --vlx-icon-component: url("../icons/component.svg");
    --vlx-icon-copy: url("../icons/copy.svg");
    --vlx-icon-credit-card: url("../icons/credit-card.svg");
    --vlx-icon-dashboard: url("../icons/layout-dashboard.svg");
    --vlx-icon-database: url("../icons/database.svg");
    --vlx-icon-document: url("../icons/file-text.svg");
    --vlx-icon-download: url("../icons/download.svg");
    --vlx-icon-drag: url("../icons/grip-vertical.svg");
    --vlx-icon-edit: url("../icons/pencil.svg");
    --vlx-icon-edit-square: url("../icons/square-pen.svg");
    --vlx-icon-ellipsis: url("../icons/ellipsis.svg");
    --vlx-icon-ellipsis-vertical: url("../icons/ellipsis-vertical.svg");
    --vlx-icon-error: url("../icons/circle-x.svg");
    --vlx-icon-external-link: url("../icons/external-link.svg");
    --vlx-icon-eye: url("../icons/eye.svg");
    --vlx-icon-eye-off: url("../icons/eye-off.svg");
    --vlx-icon-file: url("../icons/file.svg");
    --vlx-icon-file-archive: url("../icons/file-archive.svg");
    --vlx-icon-file-audio: url("../icons/file-audio.svg");
    --vlx-icon-file-code: url("../icons/file-code.svg");
    --vlx-icon-file-image: url("../icons/file-image.svg");
    --vlx-icon-file-pdf: url("../icons/file-text.svg");
    --vlx-icon-file-text: url("../icons/file-text.svg");
    --vlx-icon-file-video: url("../icons/file-video.svg");
    --vlx-icon-file-volume: url("../icons/file-volume.svg");
    --vlx-icon-filter: url("../icons/funnel.svg");
    --vlx-icon-folder: url("../icons/folder.svg");
    --vlx-icon-folder-minus: url("../icons/folder-minus.svg");
    --vlx-icon-folder-open: url("../icons/folder-open.svg");
    --vlx-icon-folder-plus: url("../icons/folder-plus.svg");
    --vlx-icon-fullscreen: url("../icons/maximize.svg");
    --vlx-icon-fullscreen-exit: url("../icons/minimize.svg");
    --vlx-icon-funnel: url("../icons/funnel.svg");
    --vlx-icon-gift: url("../icons/gift.svg");
    --vlx-icon-git-branch: url("../icons/git-branch.svg");
    --vlx-icon-git-commit: url("../icons/git-commit-horizontal.svg");
    --vlx-icon-git-commit-horizontal: url("../icons/git-commit-horizontal.svg");
    --vlx-icon-git-merge: url("../icons/git-merge.svg");
    --vlx-icon-globe: url("../icons/globe.svg");
    --vlx-icon-grid: url("../icons/layout-grid.svg");
    --vlx-icon-grip-vertical: url("../icons/grip-vertical.svg");
    --vlx-icon-hash: url("../icons/hash.svg");
    --vlx-icon-heading: url("../icons/heading.svg");
    --vlx-icon-help: url("../icons/circle-help.svg");
    --vlx-icon-home: url("../icons/home.svg");
    --vlx-icon-image: url("../icons/image.svg");
    --vlx-icon-info: url("../icons/info.svg");
    --vlx-icon-key: url("../icons/key.svg");
    --vlx-icon-layer: url("../icons/layers-2.svg");
    --vlx-icon-layers: url("../icons/layers.svg");
    --vlx-icon-layers-2: url("../icons/layers-2.svg");
    --vlx-icon-layout: url("../icons/layout-template.svg");
    --vlx-icon-layout-dashboard: url("../icons/layout-dashboard.svg");
    --vlx-icon-layout-grid: url("../icons/layout-grid.svg");
    --vlx-icon-layout-template: url("../icons/layout-template.svg");
    --vlx-icon-lightning: url("../icons/zap.svg");
    --vlx-icon-link: url("../icons/link-2.svg");
    --vlx-icon-link-2: url("../icons/link-2.svg");
    --vlx-icon-link-2-off: url("../icons/link-2-off.svg");
    --vlx-icon-list: url("../icons/list.svg");
    --vlx-icon-list-bullets: url("../icons/list.svg");
    --vlx-icon-list-numbers: url("../icons/list-ordered.svg");
    --vlx-icon-list-ordered: url("../icons/list-ordered.svg");
    --vlx-icon-loader-circle: url("../icons/loader-circle.svg");
    --vlx-icon-loading: url("../icons/loader-circle.svg");
    --vlx-icon-location: url("../icons/map-pin.svg");
    --vlx-icon-lock: url("../icons/lock.svg");
    --vlx-icon-lock-open: url("../icons/lock-open.svg");
    --vlx-icon-log-in: url("../icons/log-in.svg");
    --vlx-icon-log-out: url("../icons/log-out.svg");
    --vlx-icon-login: url("../icons/log-in.svg");
    --vlx-icon-logout: url("../icons/log-out.svg");
    --vlx-icon-mail: url("../icons/mail.svg");
    --vlx-icon-mail-open: url("../icons/mail-open.svg");
    --vlx-icon-map: url("../icons/map.svg");
    --vlx-icon-map-pin: url("../icons/map-pin.svg");
    --vlx-icon-maximize: url("../icons/maximize.svg");
    --vlx-icon-menu: url("../icons/menu.svg");
    --vlx-icon-menu-open: url("../icons/ellipsis-vertical.svg");
    --vlx-icon-message-circle: url("../icons/message-circle.svg");
    --vlx-icon-message-circle-check: url("../icons/message-circle-check.svg");
    --vlx-icon-message-circle-more: url("../icons/message-circle-more.svg");
    --vlx-icon-message-circle-question-mark: url("../icons/message-circle-question-mark.svg");
    --vlx-icon-mic: url("../icons/mic.svg");
    --vlx-icon-microphone: url("../icons/mic.svg");
    --vlx-icon-minimize: url("../icons/minimize.svg");
    --vlx-icon-minus: url("../icons/minus.svg");
    --vlx-icon-moon: url("../icons/moon.svg");
    --vlx-icon-more-horizontal: url("../icons/more-horizontal.svg");
    --vlx-icon-more-vertical: url("../icons/more-vertical.svg");
    --vlx-icon-move: url("../icons/move.svg");
    --vlx-icon-newspaper: url("../icons/newspaper.svg");
    --vlx-icon-notification: url("../icons/bell.svg");
    --vlx-icon-notification-off: url("../icons/bell-off.svg");
    --vlx-icon-package: url("../icons/package.svg");
    --vlx-icon-palette: url("../icons/palette.svg");
    --vlx-icon-panel: url("../icons/panel-top.svg");
    --vlx-icon-panel-right: url("../icons/panel-right.svg");
    --vlx-icon-panel-top: url("../icons/panel-top.svg");
    --vlx-icon-paperclip: url("../icons/paperclip.svg");
    --vlx-icon-paragraph: url("../icons/pilcrow.svg");
    --vlx-icon-paste: url("../icons/clipboard-paste.svg");
    --vlx-icon-pause: url("../icons/pause.svg");
    --vlx-icon-pencil: url("../icons/pencil.svg");
    --vlx-icon-phone: url("../icons/phone.svg");
    --vlx-icon-phone-call: url("../icons/phone-call.svg");
    --vlx-icon-pilcrow: url("../icons/pilcrow.svg");
    --vlx-icon-play: url("../icons/play.svg");
    --vlx-icon-plus: url("../icons/plus.svg");
    --vlx-icon-power: url("../icons/power.svg");
    --vlx-icon-printer: url("../icons/printer.svg");
    --vlx-icon-qr-code: url("../icons/qr-code.svg");
    --vlx-icon-question: url("../icons/circle-help.svg");
    --vlx-icon-quote: url("../icons/quote.svg");
    --vlx-icon-receipt: url("../icons/receipt.svg");
    --vlx-icon-redo: url("../icons/redo-2.svg");
    --vlx-icon-redo-2: url("../icons/redo-2.svg");
    --vlx-icon-refresh: url("../icons/rotate-cw.svg");
    --vlx-icon-refresh-ccw: url("../icons/refresh-ccw.svg");
    --vlx-icon-rocket: url("../icons/rocket.svg");
    --vlx-icon-rotate-cw: url("../icons/rotate-cw.svg");
    --vlx-icon-save: url("../icons/save.svg");
    --vlx-icon-search: url("../icons/search.svg");
    --vlx-icon-send: url("../icons/send.svg");
    --vlx-icon-server: url("../icons/server.svg");
    --vlx-icon-settings: url("../icons/settings.svg");
    --vlx-icon-share: url("../icons/share-2.svg");
    --vlx-icon-share-2: url("../icons/share-2.svg");
    --vlx-icon-shield: url("../icons/shield.svg");
    --vlx-icon-shield-check: url("../icons/shield-check.svg");
    --vlx-icon-shopping-cart: url("../icons/shopping-cart.svg");
    --vlx-icon-sidebar: url("../icons/panel-right.svg");
    --vlx-icon-skip-back: url("../icons/skip-back.svg");
    --vlx-icon-skip-forward: url("../icons/skip-forward.svg");
    --vlx-icon-sliders: url("../icons/sliders-horizontal.svg");
    --vlx-icon-sliders-horizontal: url("../icons/sliders-horizontal.svg");
    --vlx-icon-sliders-v: url("../icons/sliders-vertical.svg");
    --vlx-icon-sliders-vertical: url("../icons/sliders-vertical.svg");
    --vlx-icon-sort-asc: url("../icons/sort-asc.svg");
    --vlx-icon-sort-ascending: url("../icons/sort-asc.svg");
    --vlx-icon-sort-desc: url("../icons/sort-desc.svg");
    --vlx-icon-sort-descending: url("../icons/sort-desc.svg");
    --vlx-icon-spark: url("../icons/sparkle.svg");
    --vlx-icon-sparkle: url("../icons/sparkle.svg");
    --vlx-icon-square: url("../icons/square.svg");
    --vlx-icon-square-pen: url("../icons/square-pen.svg");
    --vlx-icon-star: url("../icons/star.svg");
    --vlx-icon-stop: url("../icons/square.svg");
    --vlx-icon-success: url("../icons/circle-check.svg");
    --vlx-icon-sun: url("../icons/sun.svg");
    --vlx-icon-sync: url("../icons/refresh-ccw.svg");
    --vlx-icon-table: url("../icons/table.svg");
    --vlx-icon-tag: url("../icons/tag.svg");
    --vlx-icon-tags: url("../icons/tags.svg");
    --vlx-icon-terminal: url("../icons/terminal.svg");
    --vlx-icon-theme: url("../icons/palette.svg");
    --vlx-icon-trash: url("../icons/trash-2.svg");
    --vlx-icon-trash-2: url("../icons/trash-2.svg");
    --vlx-icon-triangle-alert: url("../icons/triangle-alert.svg");
    --vlx-icon-truck: url("../icons/truck.svg");
    --vlx-icon-undo: url("../icons/undo-2.svg");
    --vlx-icon-undo-2: url("../icons/undo-2.svg");
    --vlx-icon-unlink: url("../icons/link-2-off.svg");
    --vlx-icon-unlock: url("../icons/lock-open.svg");
    --vlx-icon-upload: url("../icons/upload.svg");
    --vlx-icon-user: url("../icons/user.svg");
    --vlx-icon-user-add: url("../icons/user-plus.svg");
    --vlx-icon-user-check: url("../icons/user-check.svg");
    --vlx-icon-user-cog: url("../icons/user-cog.svg");
    --vlx-icon-user-minus: url("../icons/user-minus.svg");
    --vlx-icon-user-plus: url("../icons/user-plus.svg");
    --vlx-icon-user-remove: url("../icons/user-minus.svg");
    --vlx-icon-user-settings: url("../icons/user-cog.svg");
    --vlx-icon-users: url("../icons/users.svg");
    --vlx-icon-velocity: url("../icons/velocity.svg");
    --vlx-icon-video: url("../icons/video.svg");
    --vlx-icon-visibility: url("../icons/eye.svg");
    --vlx-icon-visibility-off: url("../icons/eye-off.svg");
    --vlx-icon-volume: url("../icons/volume.svg");
    --vlx-icon-volume-muted: url("../icons/volume-off.svg");
    --vlx-icon-volume-off: url("../icons/volume-off.svg");
    --vlx-icon-wallet: url("../icons/wallet.svg");
    --vlx-icon-warning: url("../icons/triangle-alert.svg");
    --vlx-icon-webhook: url("../icons/webhook.svg");
    --vlx-icon-wifi: url("../icons/wifi.svg");
    --vlx-icon-wifi-off: url("../icons/wifi-off.svg");
    --vlx-icon-x: url("../icons/x.svg");
    --vlx-icon-x-circle: url("../icons/circle-x.svg");
    --vlx-icon-zap: url("../icons/zap.svg");
  }
  .icon {
    width: 1em;
    height: 1em;
    display: inline-block;
    background-color: currentColor;
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
  }
  .icon-alert {
    mask-image: var(--vlx-icon-alert);
  }
  .icon-api {
    mask-image: var(--vlx-icon-api);
  }
  .icon-arrow-down {
    mask-image: var(--vlx-icon-arrow-down);
  }
  .icon-arrow-left {
    mask-image: var(--vlx-icon-arrow-left);
  }
  .icon-arrow-right {
    mask-image: var(--vlx-icon-arrow-right);
  }
  .icon-arrow-up {
    mask-image: var(--vlx-icon-arrow-up);
  }
  .icon-article {
    mask-image: var(--vlx-icon-article);
  }
  .icon-at {
    mask-image: var(--vlx-icon-at);
  }
  .icon-at-sign {
    mask-image: var(--vlx-icon-at-sign);
  }
  .icon-attachment {
    mask-image: var(--vlx-icon-attachment);
  }
  .icon-bell {
    mask-image: var(--vlx-icon-bell);
  }
  .icon-bell-off {
    mask-image: var(--vlx-icon-bell-off);
  }
  .icon-bookmark {
    mask-image: var(--vlx-icon-bookmark);
  }
  .icon-bookmark-check {
    mask-image: var(--vlx-icon-bookmark-check);
  }
  .icon-bug {
    mask-image: var(--vlx-icon-bug);
  }
  .icon-calendar {
    mask-image: var(--vlx-icon-calendar);
  }
  .icon-camera {
    mask-image: var(--vlx-icon-camera);
  }
  .icon-cart {
    mask-image: var(--vlx-icon-cart);
  }
  .icon-chat {
    mask-image: var(--vlx-icon-chat);
  }
  .icon-chat-check {
    mask-image: var(--vlx-icon-chat-check);
  }
  .icon-chat-dots {
    mask-image: var(--vlx-icon-chat-dots);
  }
  .icon-check {
    mask-image: var(--vlx-icon-check);
  }
  .icon-check-circle {
    mask-image: var(--vlx-icon-check-circle);
  }
  .icon-chevron-down {
    mask-image: var(--vlx-icon-chevron-down);
  }
  .icon-chevron-left {
    mask-image: var(--vlx-icon-chevron-left);
  }
  .icon-chevron-right {
    mask-image: var(--vlx-icon-chevron-right);
  }
  .icon-chevron-up {
    mask-image: var(--vlx-icon-chevron-up);
  }
  .icon-circle-alert {
    mask-image: var(--vlx-icon-circle-alert);
  }
  .icon-circle-check {
    mask-image: var(--vlx-icon-circle-check);
  }
  .icon-circle-help {
    mask-image: var(--vlx-icon-circle-help);
  }
  .icon-circle-x {
    mask-image: var(--vlx-icon-circle-x);
  }
  .icon-clipboard {
    mask-image: var(--vlx-icon-clipboard);
  }
  .icon-clipboard-paste {
    mask-image: var(--vlx-icon-clipboard-paste);
  }
  .icon-clock {
    mask-image: var(--vlx-icon-clock);
  }
  .icon-close {
    mask-image: var(--vlx-icon-close);
  }
  .icon-cloud {
    mask-image: var(--vlx-icon-cloud);
  }
  .icon-cloud-download {
    mask-image: var(--vlx-icon-cloud-download);
  }
  .icon-cloud-upload {
    mask-image: var(--vlx-icon-cloud-upload);
  }
  .icon-code {
    mask-image: var(--vlx-icon-code);
  }
  .icon-columns {
    mask-image: var(--vlx-icon-columns);
  }
  .icon-columns-3 {
    mask-image: var(--vlx-icon-columns-3);
  }
  .icon-compass {
    mask-image: var(--vlx-icon-compass);
  }
  .icon-component {
    mask-image: var(--vlx-icon-component);
  }
  .icon-copy {
    mask-image: var(--vlx-icon-copy);
  }
  .icon-credit-card {
    mask-image: var(--vlx-icon-credit-card);
  }
  .icon-dashboard {
    mask-image: var(--vlx-icon-dashboard);
  }
  .icon-database {
    mask-image: var(--vlx-icon-database);
  }
  .icon-document {
    mask-image: var(--vlx-icon-document);
  }
  .icon-download {
    mask-image: var(--vlx-icon-download);
  }
  .icon-drag {
    mask-image: var(--vlx-icon-drag);
  }
  .icon-edit {
    mask-image: var(--vlx-icon-edit);
  }
  .icon-edit-square {
    mask-image: var(--vlx-icon-edit-square);
  }
  .icon-ellipsis {
    mask-image: var(--vlx-icon-ellipsis);
  }
  .icon-ellipsis-vertical {
    mask-image: var(--vlx-icon-ellipsis-vertical);
  }
  .icon-error {
    mask-image: var(--vlx-icon-error);
  }
  .icon-external-link {
    mask-image: var(--vlx-icon-external-link);
  }
  .icon-eye {
    mask-image: var(--vlx-icon-eye);
  }
  .icon-eye-off {
    mask-image: var(--vlx-icon-eye-off);
  }
  .icon-file {
    mask-image: var(--vlx-icon-file);
  }
  .icon-file-archive {
    mask-image: var(--vlx-icon-file-archive);
  }
  .icon-file-audio {
    mask-image: var(--vlx-icon-file-audio);
  }
  .icon-file-code {
    mask-image: var(--vlx-icon-file-code);
  }
  .icon-file-image {
    mask-image: var(--vlx-icon-file-image);
  }
  .icon-file-pdf {
    mask-image: var(--vlx-icon-file-pdf);
  }
  .icon-file-text {
    mask-image: var(--vlx-icon-file-text);
  }
  .icon-file-video {
    mask-image: var(--vlx-icon-file-video);
  }
  .icon-file-volume {
    mask-image: var(--vlx-icon-file-volume);
  }
  .icon-filter {
    mask-image: var(--vlx-icon-filter);
  }
  .icon-folder {
    mask-image: var(--vlx-icon-folder);
  }
  .icon-folder-minus {
    mask-image: var(--vlx-icon-folder-minus);
  }
  .icon-folder-open {
    mask-image: var(--vlx-icon-folder-open);
  }
  .icon-folder-plus {
    mask-image: var(--vlx-icon-folder-plus);
  }
  .icon-fullscreen {
    mask-image: var(--vlx-icon-fullscreen);
  }
  .icon-fullscreen-exit {
    mask-image: var(--vlx-icon-fullscreen-exit);
  }
  .icon-funnel {
    mask-image: var(--vlx-icon-funnel);
  }
  .icon-gift {
    mask-image: var(--vlx-icon-gift);
  }
  .icon-git-branch {
    mask-image: var(--vlx-icon-git-branch);
  }
  .icon-git-commit {
    mask-image: var(--vlx-icon-git-commit);
  }
  .icon-git-commit-horizontal {
    mask-image: var(--vlx-icon-git-commit-horizontal);
  }
  .icon-git-merge {
    mask-image: var(--vlx-icon-git-merge);
  }
  .icon-globe {
    mask-image: var(--vlx-icon-globe);
  }
  .icon-grid {
    mask-image: var(--vlx-icon-grid);
  }
  .icon-grip-vertical {
    mask-image: var(--vlx-icon-grip-vertical);
  }
  .icon-hash {
    mask-image: var(--vlx-icon-hash);
  }
  .icon-heading {
    mask-image: var(--vlx-icon-heading);
  }
  .icon-help {
    mask-image: var(--vlx-icon-help);
  }
  .icon-home {
    mask-image: var(--vlx-icon-home);
  }
  .icon-image {
    mask-image: var(--vlx-icon-image);
  }
  .icon-info {
    mask-image: var(--vlx-icon-info);
  }
  .icon-key {
    mask-image: var(--vlx-icon-key);
  }
  .icon-layer {
    mask-image: var(--vlx-icon-layer);
  }
  .icon-layers {
    mask-image: var(--vlx-icon-layers);
  }
  .icon-layers-2 {
    mask-image: var(--vlx-icon-layers-2);
  }
  .icon-layout {
    mask-image: var(--vlx-icon-layout);
  }
  .icon-layout-dashboard {
    mask-image: var(--vlx-icon-layout-dashboard);
  }
  .icon-layout-grid {
    mask-image: var(--vlx-icon-layout-grid);
  }
  .icon-layout-template {
    mask-image: var(--vlx-icon-layout-template);
  }
  .icon-lightning {
    mask-image: var(--vlx-icon-lightning);
  }
  .icon-link {
    mask-image: var(--vlx-icon-link);
  }
  .icon-link-2 {
    mask-image: var(--vlx-icon-link-2);
  }
  .icon-link-2-off {
    mask-image: var(--vlx-icon-link-2-off);
  }
  .icon-list {
    mask-image: var(--vlx-icon-list);
  }
  .icon-list-bullets {
    mask-image: var(--vlx-icon-list-bullets);
  }
  .icon-list-numbers {
    mask-image: var(--vlx-icon-list-numbers);
  }
  .icon-list-ordered {
    mask-image: var(--vlx-icon-list-ordered);
  }
  .icon-loader-circle {
    mask-image: var(--vlx-icon-loader-circle);
  }
  .icon-loading {
    mask-image: var(--vlx-icon-loading);
  }
  .icon-location {
    mask-image: var(--vlx-icon-location);
  }
  .icon-lock {
    mask-image: var(--vlx-icon-lock);
  }
  .icon-lock-open {
    mask-image: var(--vlx-icon-lock-open);
  }
  .icon-log-in {
    mask-image: var(--vlx-icon-log-in);
  }
  .icon-log-out {
    mask-image: var(--vlx-icon-log-out);
  }
  .icon-login {
    mask-image: var(--vlx-icon-login);
  }
  .icon-logout {
    mask-image: var(--vlx-icon-logout);
  }
  .icon-mail {
    mask-image: var(--vlx-icon-mail);
  }
  .icon-mail-open {
    mask-image: var(--vlx-icon-mail-open);
  }
  .icon-map {
    mask-image: var(--vlx-icon-map);
  }
  .icon-map-pin {
    mask-image: var(--vlx-icon-map-pin);
  }
  .icon-maximize {
    mask-image: var(--vlx-icon-maximize);
  }
  .icon-menu {
    mask-image: var(--vlx-icon-menu);
  }
  .icon-menu-open {
    mask-image: var(--vlx-icon-menu-open);
  }
  .icon-message-circle {
    mask-image: var(--vlx-icon-message-circle);
  }
  .icon-message-circle-check {
    mask-image: var(--vlx-icon-message-circle-check);
  }
  .icon-message-circle-more {
    mask-image: var(--vlx-icon-message-circle-more);
  }
  .icon-message-circle-question-mark {
    mask-image: var(--vlx-icon-message-circle-question-mark);
  }
  .icon-mic {
    mask-image: var(--vlx-icon-mic);
  }
  .icon-microphone {
    mask-image: var(--vlx-icon-microphone);
  }
  .icon-minimize {
    mask-image: var(--vlx-icon-minimize);
  }
  .icon-minus {
    mask-image: var(--vlx-icon-minus);
  }
  .icon-moon {
    mask-image: var(--vlx-icon-moon);
  }
  .icon-more-horizontal {
    mask-image: var(--vlx-icon-more-horizontal);
  }
  .icon-more-vertical {
    mask-image: var(--vlx-icon-more-vertical);
  }
  .icon-move {
    mask-image: var(--vlx-icon-move);
  }
  .icon-newspaper {
    mask-image: var(--vlx-icon-newspaper);
  }
  .icon-notification {
    mask-image: var(--vlx-icon-notification);
  }
  .icon-notification-off {
    mask-image: var(--vlx-icon-notification-off);
  }
  .icon-package {
    mask-image: var(--vlx-icon-package);
  }
  .icon-palette {
    mask-image: var(--vlx-icon-palette);
  }
  .icon-panel {
    mask-image: var(--vlx-icon-panel);
  }
  .icon-panel-right {
    mask-image: var(--vlx-icon-panel-right);
  }
  .icon-panel-top {
    mask-image: var(--vlx-icon-panel-top);
  }
  .icon-paperclip {
    mask-image: var(--vlx-icon-paperclip);
  }
  .icon-paragraph {
    mask-image: var(--vlx-icon-paragraph);
  }
  .icon-paste {
    mask-image: var(--vlx-icon-paste);
  }
  .icon-pause {
    mask-image: var(--vlx-icon-pause);
  }
  .icon-pencil {
    mask-image: var(--vlx-icon-pencil);
  }
  .icon-phone {
    mask-image: var(--vlx-icon-phone);
  }
  .icon-phone-call {
    mask-image: var(--vlx-icon-phone-call);
  }
  .icon-pilcrow {
    mask-image: var(--vlx-icon-pilcrow);
  }
  .icon-play {
    mask-image: var(--vlx-icon-play);
  }
  .icon-plus {
    mask-image: var(--vlx-icon-plus);
  }
  .icon-power {
    mask-image: var(--vlx-icon-power);
  }
  .icon-printer {
    mask-image: var(--vlx-icon-printer);
  }
  .icon-qr-code {
    mask-image: var(--vlx-icon-qr-code);
  }
  .icon-question {
    mask-image: var(--vlx-icon-question);
  }
  .icon-quote {
    mask-image: var(--vlx-icon-quote);
  }
  .icon-receipt {
    mask-image: var(--vlx-icon-receipt);
  }
  .icon-redo {
    mask-image: var(--vlx-icon-redo);
  }
  .icon-redo-2 {
    mask-image: var(--vlx-icon-redo-2);
  }
  .icon-refresh {
    mask-image: var(--vlx-icon-refresh);
  }
  .icon-refresh-ccw {
    mask-image: var(--vlx-icon-refresh-ccw);
  }
  .icon-rocket {
    mask-image: var(--vlx-icon-rocket);
  }
  .icon-rotate-cw {
    mask-image: var(--vlx-icon-rotate-cw);
  }
  .icon-save {
    mask-image: var(--vlx-icon-save);
  }
  .icon-search {
    mask-image: var(--vlx-icon-search);
  }
  .icon-send {
    mask-image: var(--vlx-icon-send);
  }
  .icon-server {
    mask-image: var(--vlx-icon-server);
  }
  .icon-settings {
    mask-image: var(--vlx-icon-settings);
  }
  .icon-share {
    mask-image: var(--vlx-icon-share);
  }
  .icon-share-2 {
    mask-image: var(--vlx-icon-share-2);
  }
  .icon-shield {
    mask-image: var(--vlx-icon-shield);
  }
  .icon-shield-check {
    mask-image: var(--vlx-icon-shield-check);
  }
  .icon-shopping-cart {
    mask-image: var(--vlx-icon-shopping-cart);
  }
  .icon-sidebar {
    mask-image: var(--vlx-icon-sidebar);
  }
  .icon-skip-back {
    mask-image: var(--vlx-icon-skip-back);
  }
  .icon-skip-forward {
    mask-image: var(--vlx-icon-skip-forward);
  }
  .icon-sliders {
    mask-image: var(--vlx-icon-sliders);
  }
  .icon-sliders-horizontal {
    mask-image: var(--vlx-icon-sliders-horizontal);
  }
  .icon-sliders-v {
    mask-image: var(--vlx-icon-sliders-v);
  }
  .icon-sliders-vertical {
    mask-image: var(--vlx-icon-sliders-vertical);
  }
  .icon-sort-asc {
    mask-image: var(--vlx-icon-sort-asc);
  }
  .icon-sort-ascending {
    mask-image: var(--vlx-icon-sort-ascending);
  }
  .icon-sort-desc {
    mask-image: var(--vlx-icon-sort-desc);
  }
  .icon-sort-descending {
    mask-image: var(--vlx-icon-sort-descending);
  }
  .icon-spark {
    mask-image: var(--vlx-icon-spark);
  }
  .icon-sparkle {
    mask-image: var(--vlx-icon-sparkle);
  }
  .icon-square {
    mask-image: var(--vlx-icon-square);
  }
  .icon-square-pen {
    mask-image: var(--vlx-icon-square-pen);
  }
  .icon-star {
    mask-image: var(--vlx-icon-star);
  }
  .icon-stop {
    mask-image: var(--vlx-icon-stop);
  }
  .icon-success {
    mask-image: var(--vlx-icon-success);
  }
  .icon-sun {
    mask-image: var(--vlx-icon-sun);
  }
  .icon-sync {
    mask-image: var(--vlx-icon-sync);
  }
  .icon-table {
    mask-image: var(--vlx-icon-table);
  }
  .icon-tag {
    mask-image: var(--vlx-icon-tag);
  }
  .icon-tags {
    mask-image: var(--vlx-icon-tags);
  }
  .icon-terminal {
    mask-image: var(--vlx-icon-terminal);
  }
  .icon-theme {
    mask-image: var(--vlx-icon-theme);
  }
  .icon-trash {
    mask-image: var(--vlx-icon-trash);
  }
  .icon-trash-2 {
    mask-image: var(--vlx-icon-trash-2);
  }
  .icon-triangle-alert {
    mask-image: var(--vlx-icon-triangle-alert);
  }
  .icon-truck {
    mask-image: var(--vlx-icon-truck);
  }
  .icon-undo {
    mask-image: var(--vlx-icon-undo);
  }
  .icon-undo-2 {
    mask-image: var(--vlx-icon-undo-2);
  }
  .icon-unlink {
    mask-image: var(--vlx-icon-unlink);
  }
  .icon-unlock {
    mask-image: var(--vlx-icon-unlock);
  }
  .icon-upload {
    mask-image: var(--vlx-icon-upload);
  }
  .icon-user {
    mask-image: var(--vlx-icon-user);
  }
  .icon-user-add {
    mask-image: var(--vlx-icon-user-add);
  }
  .icon-user-check {
    mask-image: var(--vlx-icon-user-check);
  }
  .icon-user-cog {
    mask-image: var(--vlx-icon-user-cog);
  }
  .icon-user-minus {
    mask-image: var(--vlx-icon-user-minus);
  }
  .icon-user-plus {
    mask-image: var(--vlx-icon-user-plus);
  }
  .icon-user-remove {
    mask-image: var(--vlx-icon-user-remove);
  }
  .icon-user-settings {
    mask-image: var(--vlx-icon-user-settings);
  }
  .icon-users {
    mask-image: var(--vlx-icon-users);
  }
  .icon-velocity {
    mask-image: var(--vlx-icon-velocity);
  }
  .icon-video {
    mask-image: var(--vlx-icon-video);
  }
  .icon-visibility {
    mask-image: var(--vlx-icon-visibility);
  }
  .icon-visibility-off {
    mask-image: var(--vlx-icon-visibility-off);
  }
  .icon-volume {
    mask-image: var(--vlx-icon-volume);
  }
  .icon-volume-muted {
    mask-image: var(--vlx-icon-volume-muted);
  }
  .icon-volume-off {
    mask-image: var(--vlx-icon-volume-off);
  }
  .icon-wallet {
    mask-image: var(--vlx-icon-wallet);
  }
  .icon-warning {
    mask-image: var(--vlx-icon-warning);
  }
  .icon-webhook {
    mask-image: var(--vlx-icon-webhook);
  }
  .icon-wifi {
    mask-image: var(--vlx-icon-wifi);
  }
  .icon-wifi-off {
    mask-image: var(--vlx-icon-wifi-off);
  }
  .icon-x {
    mask-image: var(--vlx-icon-x);
  }
  .icon-x-circle {
    mask-image: var(--vlx-icon-x-circle);
  }
  .icon-zap {
    mask-image: var(--vlx-icon-zap);
  }
  :root,
  [data-vlx-theme="light"] {
    --vlx-tab-gap: var(--vlx-space-1);
    --vlx-tab-padding: 0;
    --vlx-tab-background-color: transparent;
    --vlx-tab-border-color: var(--vlx-border-color-soft);
    --vlx-tab-border-radius: var(--vlx-radius-2);
    --vlx-tab-color: var(--vlx-nav-item-color);
    --vlx-tab-hover-color: var(--vlx-nav-hover-color);
    --vlx-tab-hover-background-color: var(--vlx-nav-hover-background-color);
    --vlx-tab-active-color: var(--vlx-nav-active-color);
    --vlx-tab-active-background-color: transparent;
    --vlx-tab-pill-active-background-color: var(--vlx-nav-active-background-color);
    --vlx-tab-indicator-color: var(--vlx-nav-active-color);
  }
  .nav-tabs {
    flex-direction: row;
    flex-wrap: wrap;
    gap: var(--vlx-tab-gap);
    padding: var(--vlx-tab-padding);
    background: var(--vlx-tab-background-color);
    border-bottom: 1px solid var(--vlx-tab-border-color);
    margin-bottom: var(--vlx-flow-space);
  }
  .nav-tabs > .nav-item {
    position: relative;
  }
  .nav-tabs > .nav-item > .nav-link,
  .nav-tabs > .nav-item > .nav-button {
    display: block;
    text-decoration: none;
    padding: var(--vlx-space-3) var(--vlx-space-4);
    border: 0;
    background: transparent;
    color: var(--vlx-tab-color);
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s;
    border-radius: calc(var(--vlx-tab-border-radius) - 1px - var(--vlx-tab-padding));
  }
  .nav-tabs > .nav-item > .nav-link:hover,
  .nav-tabs > .nav-item > .nav-button:hover {
    background-color: var(--vlx-tab-hover-background-color);
    color: var(--vlx-tab-hover-color);
  }
  .nav-tabs > .nav-item.active > .nav-link,
  .nav-tabs > .nav-item.active > .nav-button {
    background-color: var(--vlx-tab-active-background-color);
    color: var(--vlx-tab-active-color);
  }
  .nav-tabs > .nav-item.active > .nav-link::after,
  .nav-tabs > .nav-item.active > .nav-button::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 0.2rem;
    border-radius: 999px;
    background: var(--vlx-tab-indicator-color);
  }
  .nav-tabs--pills {
    --vlx-tab-gap: var(--vlx-space-3);
    --vlx-tab-padding: var(--vlx-space-2);
    --vlx-tab-background-color: var(--vlx-color-surface);
    --vlx-tab-active-background-color: var(--vlx-tab-pill-active-background-color);
    border: 1px solid var(--vlx-tab-border-color);
    border-radius: var(--vlx-radius-5);
  }
  .nav-tabs--pills > .nav-item > .nav-link,
  .nav-tabs--pills > .nav-item > .nav-button {
    border-radius: calc(var(--vlx-radius-5) - 1px - var(--vlx-tab-padding));
  }
  .nav-tabs--pills > .nav-item.active > .nav-link::after,
  .nav-tabs--pills > .nav-item.active > .nav-button::after {
    content: none;
  }
  :root,
  [data-vlx-theme="light"] {
    --vlx-accordion-background-color: var(--vlx-card-background-color);
    --vlx-accordion-border-color: var(--vlx-card-border-color);
    --vlx-accordion-border-width: var(--vlx-card-border-width);
    --vlx-accordion-border-radius: var(--vlx-card-border-radius);
    --vlx-accordion-padding: var(--vlx-card-padding);
  }
  .accordion {
    border: var(--vlx-accordion-border-width) solid var(--vlx-accordion-border-color);
    border-radius: var(--vlx-accordion-border-radius);
    overflow: hidden;
  }
  .accordion__item + .accordion__item {
    border-top: var(--vlx-accordion-border-width) solid var(--vlx-accordion-border-color);
  }
  .accordion__heading {
    margin: 0;
  }
  .accordion__trigger {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--vlx-space-2);
    padding: var(--vlx-accordion-padding);
    font-size: 1rem;
    background: transparent;
    border: 0;
    cursor: pointer;
    text-align: left;
    color: var(--vlx-color-text);
    transition: background 0.2s ease;
  }
  .accordion__icon {
    width: 1em;
    height: 1em;
    position: relative;
  }
  .accordion__icon::before,
  .accordion__icon::after {
    content: '';
    position: absolute;
    background: currentColor;
    transition: transform 0.2s ease;
  }
  .accordion__icon::before {
    width: 100%;
    height: 2px;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
  }
  .accordion__icon::after {
    width: 2px;
    height: 100%;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
  }
  .accordion__trigger[aria-expanded="true"] .accordion__icon::after {
    transform: translateX(-50%) scaleY(0);
  }
  .accordion__body {
    padding: var(--vlx-accordion-padding);
  }
  .vlx-accordion {
    border: 1px solid var(--vlx-border-color-soft);
    border-radius: var(--vlx-radius-3);
    overflow: hidden;
  }
  .vlx-accordion-item + .vlx-accordion-item {
    border-top: 1px solid var(--vlx-border-color-soft);
  }
  /* Trigger */
  .vlx-accordion-trigger {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--vlx-space-2);
    padding: var(--vlx-control-padding-y) var(--vlx-control-padding-x);
    font-size: var(--vlx-control-font-size);
    font-weight: 500;
    background: transparent;
    border: 0;
    cursor: pointer;
    text-align: left;
    color: var(--vlx-color-text);
    transition: background 0.2s ease;
  }
  .vlx-accordion-trigger:hover {
    background: var(--vlx-color-surface-muted);
  }
  /* Icon */
  .vlx-accordion-icon {
    width: 1em;
    height: 1em;
    position: relative;
  }
  .vlx-accordion-icon::before,
  .vlx-accordion-icon::after {
    content: '';
    position: absolute;
    background: currentColor;
    transition: transform 0.2s ease;
  }
  /* Horizontal */
  .vlx-accordion-icon::before {
    width: 100%;
    height: 2px;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
  }
  /* Vertical */
  .vlx-accordion-icon::after {
    width: 2px;
    height: 100%;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
  }
  /* Open State */
  .vlx-accordion-trigger[aria-expanded="true"] .vlx-accordion-icon::after {
    transform: translateX(-50%) scaleY(0);
  }
  /* Content */
  .vlx-accordion-content {
    padding: 0 var(--vlx-control-padding-x);
  }
  .vlx-accordion-inner {
    padding: var(--vlx-space-3) 0;
  }
  .combobox {
    position: relative;
    overflow: hidden;
  }
  .combobox.open,
  .combobox.is-open {
    overflow: inherit;
  }
  .combobox__control {
    position: relative;
  }
  .combobox--multiple .combobox__control {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--vlx-space-1);
    width: 100%;
    padding: var(--vlx-space-1);
    background-color: var(--vlx-form-background-color);
    border: var(--vlx-control-border-width) solid var(--vlx-form-border-color);
    border-radius: var(--vlx-form-border-radius);
  }
  .combobox--multiple .combobox__control:focus-within {
    border-color: var(--vlx-color-primary);
  }
  .combobox--multiple input {
    flex: 1 1 10rem;
    min-width: 8rem;
    width: auto;
    padding: calc(var(--vlx-form-padding-y) - var(--vlx-space-1)) var(--vlx-form-padding-x);
    border: 0;
    background: transparent;
    box-shadow: none;
    outline: 0;
  }
  .combobox__selections {
    display: contents;
  }
  .combobox__tag {
    display: inline-flex;
    align-items: center;
    gap: var(--vlx-space-1);
    padding: var(--vlx-space-1) var(--vlx-space-2);
    border-radius: var(--vlx-radius-pill);
    background: var(--vlx-color-surface-muted);
    color: var(--vlx-color-text);
    font-size: var(--vlx-font-size-s);
    line-height: 1.4;
  }
  .combobox__tag-remove {
    display: inline-grid;
    place-items: center;
    width: 1.25rem;
    height: 1.25rem;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: inherit;
    font: inherit;
    line-height: 1;
    cursor: pointer;
  }
  .combobox__tag-remove:hover,
  .combobox__tag-remove:focus-visible {
    background: var(--vlx-dropdown-link-hover-background-color);
    color: var(--vlx-dropdown-link-hover-color);
  }
  .combobox__dropdown {
    position: absolute;
    top: calc(100% + 0.5rem);
    left: 0;
    width: 100%;
    z-index: 1000;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  }
  .combobox__empty,
  .combobox__loading {
    padding: var(--vlx-dropdown-item-padding-y) var(--vlx-dropdown-item-padding-x);
    color: var(--vlx-dropdown-link-color);
  }
  .combobox__item.is-selected::after {
    content: "✓";
    float: right;
  }
}
@layer utilities {
  .m-0 {
    margin: var(--vlx-space-0);
  }
  .mt-0 {
    margin-top: var(--vlx-space-0);
  }
  .mr-0 {
    margin-right: var(--vlx-space-0);
  }
  .mb-0 {
    margin-bottom: var(--vlx-space-0);
  }
  .ml-0 {
    margin-left: var(--vlx-space-0);
  }
  .mx-0 {
    margin-left: var(--vlx-space-0);
    margin-right: var(--vlx-space-0);
  }
  .my-0 {
    margin-top: var(--vlx-space-0);
    margin-bottom: var(--vlx-space-0);
  }
  .p-0 {
    padding: var(--vlx-space-0);
  }
  .pt-0 {
    padding-top: var(--vlx-space-0);
  }
  .pr-0 {
    padding-right: var(--vlx-space-0);
  }
  .pb-0 {
    padding-bottom: var(--vlx-space-0);
  }
  .pl-0 {
    padding-left: var(--vlx-space-0);
  }
  .px-0 {
    padding-left: var(--vlx-space-0);
    padding-right: var(--vlx-space-0);
  }
  .py-0 {
    padding-top: var(--vlx-space-0);
    padding-bottom: var(--vlx-space-0);
  }
  .m-1 {
    margin: var(--vlx-space-1);
  }
  .mt-1 {
    margin-top: var(--vlx-space-1);
  }
  .mr-1 {
    margin-right: var(--vlx-space-1);
  }
  .mb-1 {
    margin-bottom: var(--vlx-space-1);
  }
  .ml-1 {
    margin-left: var(--vlx-space-1);
  }
  .mx-1 {
    margin-left: var(--vlx-space-1);
    margin-right: var(--vlx-space-1);
  }
  .my-1 {
    margin-top: var(--vlx-space-1);
    margin-bottom: var(--vlx-space-1);
  }
  .p-1 {
    padding: var(--vlx-space-1);
  }
  .pt-1 {
    padding-top: var(--vlx-space-1);
  }
  .pr-1 {
    padding-right: var(--vlx-space-1);
  }
  .pb-1 {
    padding-bottom: var(--vlx-space-1);
  }
  .pl-1 {
    padding-left: var(--vlx-space-1);
  }
  .px-1 {
    padding-left: var(--vlx-space-1);
    padding-right: var(--vlx-space-1);
  }
  .py-1 {
    padding-top: var(--vlx-space-1);
    padding-bottom: var(--vlx-space-1);
  }
  .m-2 {
    margin: var(--vlx-space-2);
  }
  .mt-2 {
    margin-top: var(--vlx-space-2);
  }
  .mr-2 {
    margin-right: var(--vlx-space-2);
  }
  .mb-2 {
    margin-bottom: var(--vlx-space-2);
  }
  .ml-2 {
    margin-left: var(--vlx-space-2);
  }
  .mx-2 {
    margin-left: var(--vlx-space-2);
    margin-right: var(--vlx-space-2);
  }
  .my-2 {
    margin-top: var(--vlx-space-2);
    margin-bottom: var(--vlx-space-2);
  }
  .p-2 {
    padding: var(--vlx-space-2);
  }
  .pt-2 {
    padding-top: var(--vlx-space-2);
  }
  .pr-2 {
    padding-right: var(--vlx-space-2);
  }
  .pb-2 {
    padding-bottom: var(--vlx-space-2);
  }
  .pl-2 {
    padding-left: var(--vlx-space-2);
  }
  .px-2 {
    padding-left: var(--vlx-space-2);
    padding-right: var(--vlx-space-2);
  }
  .py-2 {
    padding-top: var(--vlx-space-2);
    padding-bottom: var(--vlx-space-2);
  }
  .m-3 {
    margin: var(--vlx-space-3);
  }
  .mt-3 {
    margin-top: var(--vlx-space-3);
  }
  .mr-3 {
    margin-right: var(--vlx-space-3);
  }
  .mb-3 {
    margin-bottom: var(--vlx-space-3);
  }
  .ml-3 {
    margin-left: var(--vlx-space-3);
  }
  .mx-3 {
    margin-left: var(--vlx-space-3);
    margin-right: var(--vlx-space-3);
  }
  .my-3 {
    margin-top: var(--vlx-space-3);
    margin-bottom: var(--vlx-space-3);
  }
  .p-3 {
    padding: var(--vlx-space-3);
  }
  .pt-3 {
    padding-top: var(--vlx-space-3);
  }
  .pr-3 {
    padding-right: var(--vlx-space-3);
  }
  .pb-3 {
    padding-bottom: var(--vlx-space-3);
  }
  .pl-3 {
    padding-left: var(--vlx-space-3);
  }
  .px-3 {
    padding-left: var(--vlx-space-3);
    padding-right: var(--vlx-space-3);
  }
  .py-3 {
    padding-top: var(--vlx-space-3);
    padding-bottom: var(--vlx-space-3);
  }
  .m-4 {
    margin: var(--vlx-space-4);
  }
  .mt-4 {
    margin-top: var(--vlx-space-4);
  }
  .mr-4 {
    margin-right: var(--vlx-space-4);
  }
  .mb-4 {
    margin-bottom: var(--vlx-space-4);
  }
  .ml-4 {
    margin-left: var(--vlx-space-4);
  }
  .mx-4 {
    margin-left: var(--vlx-space-4);
    margin-right: var(--vlx-space-4);
  }
  .my-4 {
    margin-top: var(--vlx-space-4);
    margin-bottom: var(--vlx-space-4);
  }
  .p-4 {
    padding: var(--vlx-space-4);
  }
  .pt-4 {
    padding-top: var(--vlx-space-4);
  }
  .pr-4 {
    padding-right: var(--vlx-space-4);
  }
  .pb-4 {
    padding-bottom: var(--vlx-space-4);
  }
  .pl-4 {
    padding-left: var(--vlx-space-4);
  }
  .px-4 {
    padding-left: var(--vlx-space-4);
    padding-right: var(--vlx-space-4);
  }
  .py-4 {
    padding-top: var(--vlx-space-4);
    padding-bottom: var(--vlx-space-4);
  }
  .m-5 {
    margin: var(--vlx-space-5);
  }
  .mt-5 {
    margin-top: var(--vlx-space-5);
  }
  .mr-5 {
    margin-right: var(--vlx-space-5);
  }
  .mb-5 {
    margin-bottom: var(--vlx-space-5);
  }
  .ml-5 {
    margin-left: var(--vlx-space-5);
  }
  .mx-5 {
    margin-left: var(--vlx-space-5);
    margin-right: var(--vlx-space-5);
  }
  .my-5 {
    margin-top: var(--vlx-space-5);
    margin-bottom: var(--vlx-space-5);
  }
  .p-5 {
    padding: var(--vlx-space-5);
  }
  .pt-5 {
    padding-top: var(--vlx-space-5);
  }
  .pr-5 {
    padding-right: var(--vlx-space-5);
  }
  .pb-5 {
    padding-bottom: var(--vlx-space-5);
  }
  .pl-5 {
    padding-left: var(--vlx-space-5);
  }
  .px-5 {
    padding-left: var(--vlx-space-5);
    padding-right: var(--vlx-space-5);
  }
  .py-5 {
    padding-top: var(--vlx-space-5);
    padding-bottom: var(--vlx-space-5);
  }
  .m-6 {
    margin: var(--vlx-space-6);
  }
  .mt-6 {
    margin-top: var(--vlx-space-6);
  }
  .mr-6 {
    margin-right: var(--vlx-space-6);
  }
  .mb-6 {
    margin-bottom: var(--vlx-space-6);
  }
  .ml-6 {
    margin-left: var(--vlx-space-6);
  }
  .mx-6 {
    margin-left: var(--vlx-space-6);
    margin-right: var(--vlx-space-6);
  }
  .my-6 {
    margin-top: var(--vlx-space-6);
    margin-bottom: var(--vlx-space-6);
  }
  .p-6 {
    padding: var(--vlx-space-6);
  }
  .pt-6 {
    padding-top: var(--vlx-space-6);
  }
  .pr-6 {
    padding-right: var(--vlx-space-6);
  }
  .pb-6 {
    padding-bottom: var(--vlx-space-6);
  }
  .pl-6 {
    padding-left: var(--vlx-space-6);
  }
  .px-6 {
    padding-left: var(--vlx-space-6);
    padding-right: var(--vlx-space-6);
  }
  .py-6 {
    padding-top: var(--vlx-space-6);
    padding-bottom: var(--vlx-space-6);
  }
  .m-7 {
    margin: var(--vlx-space-7);
  }
  .mt-7 {
    margin-top: var(--vlx-space-7);
  }
  .mr-7 {
    margin-right: var(--vlx-space-7);
  }
  .mb-7 {
    margin-bottom: var(--vlx-space-7);
  }
  .ml-7 {
    margin-left: var(--vlx-space-7);
  }
  .mx-7 {
    margin-left: var(--vlx-space-7);
    margin-right: var(--vlx-space-7);
  }
  .my-7 {
    margin-top: var(--vlx-space-7);
    margin-bottom: var(--vlx-space-7);
  }
  .p-7 {
    padding: var(--vlx-space-7);
  }
  .pt-7 {
    padding-top: var(--vlx-space-7);
  }
  .pr-7 {
    padding-right: var(--vlx-space-7);
  }
  .pb-7 {
    padding-bottom: var(--vlx-space-7);
  }
  .pl-7 {
    padding-left: var(--vlx-space-7);
  }
  .px-7 {
    padding-left: var(--vlx-space-7);
    padding-right: var(--vlx-space-7);
  }
  .py-7 {
    padding-top: var(--vlx-space-7);
    padding-bottom: var(--vlx-space-7);
  }
  .m-auto {
    margin: var(--vlx-space-auto);
  }
  .mt-auto {
    margin-top: var(--vlx-space-auto);
  }
  .mr-auto {
    margin-right: var(--vlx-space-auto);
  }
  .mb-auto {
    margin-bottom: var(--vlx-space-auto);
  }
  .ml-auto {
    margin-left: var(--vlx-space-auto);
  }
  .mx-auto {
    margin-left: var(--vlx-space-auto);
    margin-right: var(--vlx-space-auto);
  }
  .my-auto {
    margin-top: var(--vlx-space-auto);
    margin-bottom: var(--vlx-space-auto);
  }
  .p-auto {
    padding: var(--vlx-space-auto);
  }
  .pt-auto {
    padding-top: var(--vlx-space-auto);
  }
  .pr-auto {
    padding-right: var(--vlx-space-auto);
  }
  .pb-auto {
    padding-bottom: var(--vlx-space-auto);
  }
  .pl-auto {
    padding-left: var(--vlx-space-auto);
  }
  .px-auto {
    padding-left: var(--vlx-space-auto);
    padding-right: var(--vlx-space-auto);
  }
  .py-auto {
    padding-top: var(--vlx-space-auto);
    padding-bottom: var(--vlx-space-auto);
  }
  .flex {
    display: flex;
  }
  .flex-row {
    flex-direction: row;
  }
  .flex-row-reverse {
    flex-direction: row-reverse;
  }
  .flex-column {
    flex-direction: column;
  }
  .flex-column-reverse {
    flex-direction: column-reverse;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .flex-nowrap {
    flex-wrap: nowrap;
  }
  .flex-wrap-reverse {
    flex-wrap: wrap-reverse;
  }
  .grow {
    flex-grow: 1;
  }
  .grow-0 {
    flex-grow: 0;
  }
  .grow-1 {
    flex-grow: 1;
  }
  .grow-2 {
    flex-grow: 2;
  }
  .grow-3 {
    flex-grow: 3;
  }
  .shrink {
    flex-shrink: 1;
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .shrink-1 {
    flex-shrink: 1;
  }
  .shrink-2 {
    flex-shrink: 2;
  }
  .shrink-3 {
    flex-shrink: 3;
  }
  .gap-0 {
    gap: var(--vlx-space-0);
  }
  .gap-1 {
    gap: var(--vlx-space-1);
  }
  .gap-2 {
    gap: var(--vlx-space-2);
  }
  .gap-3 {
    gap: var(--vlx-space-3);
  }
  .gap-4 {
    gap: var(--vlx-space-4);
  }
  .gap-5 {
    gap: var(--vlx-space-5);
  }
  .gap-6 {
    gap: var(--vlx-space-6);
  }
  .gap-7 {
    gap: var(--vlx-space-7);
  }
  .gap-auto {
    gap: var(--vlx-space-auto);
  }
  .items-center {
    align-items: center;
  }
  .items-center-safe {
    align-items: safe center;
  }
  .items-end {
    align-items: flex-end;
  }
  .items-end-safe {
    align-items: safe flex-end;
  }
  .items-start {
    align-items: flex-start;
  }
  .items-stretch {
    align-items: stretch;
  }
  .justify-around {
    justify-content: space-around;
  }
  .justify-baseline {
    justify-content: baseline;
  }
  .justify-between {
    justify-content: space-between;
  }
  .justify-center {
    justify-content: center;
  }
  .justify-center-safe {
    justify-content: safe center;
  }
  .justify-end {
    justify-content: flex-end;
  }
  .justify-end-safe {
    justify-content: safe flex-end;
  }
  .justify-evenly {
    justify-content: space-evenly;
  }
  .justify-normal {
    justify-content: normal;
  }
  .justify-start {
    justify-content: flex-start;
  }
  .justify-stretch {
    justify-content: stretch;
  }
  .justify-items-center {
    justify-items: center;
  }
  .justify-items-center-safe {
    justify-items: safe center;
  }
  .justify-items-end {
    justify-items: end;
  }
  .justify-items-end-safe {
    justify-items: safe end;
  }
  .justify-items-normal {
    justify-items: normal;
  }
  .justify-items-start {
    justify-items: start;
  }
  .justify-items-stretch {
    justify-items: stretch;
  }
  .text-left {
    text-align: left;
  }
  .text-center {
    text-align: center;
  }
  .text-right {
    text-align: right;
  }
  .text-justify {
    text-align: justify;
  }
  .text-start {
    text-align: start;
  }
  .text-end {
    text-align: end;
  }
  .text-nowrap {
    white-space: nowrap;
  }
  .text-break {
    word-break: break-all;
  }
  .text-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .text-truncate-2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .text-truncate-3 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }
  .text-truncate-4 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
  }
  .text-primary {
    color: var(--vlx-color-primary);
  }
  .text-muted {
    color: var(--vlx-color-text-muted);
  }
  .text-xs {
    font-size: var(--vlx-font-size-xs, 0.75rem);
    line-height: var(--vlx-line-height-xs, 1.4);
  }
  .text-s {
    font-size: var(--vlx-font-size-s, 0.875rem);
    line-height: var(--vlx-line-height-s, 1.45);
  }
  .text-base {
    font-size: var(--vlx-font-size-base, 1rem);
    line-height: var(--vlx-line-height-base, 1.5);
  }
  .text-l {
    font-size: var(--vlx-font-size-l, 1.125rem);
    line-height: var(--vlx-line-height-l, 1.55);
  }
  .text-xl {
    font-size: var(--vlx-font-size-xl, 1.25rem);
    line-height: var(--vlx-line-height-xl, 1.6);
  }
  .text-2xl {
    font-size: var(--vlx-font-size-2xl, 1.5rem);
    line-height: var(--vlx-line-height-2xl, 1.35);
  }
  .text-3xl {
    font-size: var(--vlx-font-size-3xl, 2rem);
    line-height: var(--vlx-line-height-3xl, 1.25);
  }
  .text-w-s {
    max-width: var(--vlx-text-width-s, 45ch);
  }
  .text-w-m {
    max-width: var(--vlx-text-width-m, 60ch);
  }
  .text-w-l {
    max-width: var(--vlx-text-width-l, 70ch);
  }
  .text-w-xl {
    max-width: var(--vlx-text-width-xl, 80ch);
  }
  .radius-0 {
    border-radius: var(--vlx-radius-0);
  }
  .radius-xs {
    border-radius: var(--vlx-radius-xs);
  }
  .radius-1 {
    border-radius: var(--vlx-radius-1);
  }
  .radius-2 {
    border-radius: var(--vlx-radius-2);
  }
  .radius-3 {
    border-radius: var(--vlx-radius-3);
  }
  .radius-4 {
    border-radius: var(--vlx-radius-4);
  }
  .radius-5 {
    border-radius: var(--vlx-radius-5);
  }
  .radius-pill {
    border-radius: var(--vlx-radius-pill);
  }
  .hover-lift {
    transition: var(--vlx-transition-transform), var(--vlx-transition-shadow);
  }
  .hover-lift:hover {
    transform: translateY(var(--vlx-motion-distance-s, -2px));
    box-shadow: var(--vlx-shadow-3, 0 0.5rem 1rem rgba(0, 0, 0, 0.15));
  }
  @media (prefers-reduced-motion: reduce) {
    .hover-lift:hover {
      transform: none;
    }
  }
}
/*# sourceMappingURL=theme.css.map */