/* Design tokens: Website. Made by @vikalp-one/design-tokens; don't edit by hand. */

:root {
  color-scheme: light dark;
  --vo-color-background: #f1f1f2;
  --vo-color-surface: #ffffff;
  --vo-color-surface-muted: #f7f7f8;
  --vo-color-surface-hover: #f3f3f4;
  --vo-color-surface-selected: #eceef1;
  --vo-color-navigation: #ebebec;
  --vo-color-control: #ffffff;
  --vo-color-border: #e1e2e4;
  --vo-color-border-strong: #7b7e85;
  --vo-color-text: #1d1e21;
  --vo-color-text-muted: #5e6167;
  --vo-color-placeholder: #6f7278;
  --vo-color-link: #5b3fd6;
  --vo-color-focus: #5b3fd6;
  --vo-color-primary: #5b3fd6;
  --vo-color-primary-hover: #4a2fc0;
  --vo-color-on-primary: #ffffff;
  --vo-color-danger: #c4281d;
  --vo-color-danger-hover: #a31f16;
  --vo-color-on-danger: #ffffff;
  --vo-color-success-text: #11663a;
  --vo-color-success-surface: #ddf4e4;
  --vo-color-warning-text: #7a4800;
  --vo-color-warning-surface: #fdecca;
  --vo-color-danger-text: #a31f16;
  --vo-color-danger-surface: #fde5e2;
  --vo-color-info-text: #1a4ea3;
  --vo-color-info-surface: #e1ecfd;
  --vo-color-top-bar: #1a1a1c;
  --vo-color-on-top-bar: #f4f4f5;
  --vo-color-on-top-bar-muted: #b3b5ba;
  --vo-color-top-bar-control: #313236;
  --vo-color-backdrop: #0f1013;
  --vo-color-code-ink: #0f1013;
  --vo-color-code-paper: #ffffff;
  --vo-shadow-sm: 0 1px 2px 0 rgb(15 16 19 / 0.08);
  --vo-shadow-md: 0 2px 6px -1px rgb(15 16 19 / 0.1), 0 1px 3px 0 rgb(15 16 19 / 0.06);
  --vo-shadow-lg: 0 10px 24px -4px rgb(15 16 19 / 0.14), 0 4px 8px -2px rgb(15 16 19 / 0.06);
  --vo-font-body: system-ui, "Segoe UI", "Roboto", "Noto Sans", "Helvetica Neue", "Arial", sans-serif;
  --vo-font-mono: ui-monospace, "SFMono-Regular", "Menlo", "Consolas", "Liberation Mono", monospace;
  --vo-font-size-xs: 0.75rem;
  --vo-font-size-sm: 0.875rem;
  --vo-font-size-md: 1rem;
  --vo-font-size-lg: 1.125rem;
  --vo-font-size-xl: 1.25rem;
  --vo-font-size-2xl: 1.5rem;
  --vo-font-size-3xl: 1.875rem;
  --vo-font-size-4xl: 2.25rem;
  --vo-font-size-5xl: 3rem;
  --vo-line-height-tight: 1.25;
  --vo-line-height-normal: 1.5;
  --vo-line-height-relaxed: 1.75;
  --vo-font-weight-regular: 400;
  --vo-font-weight-medium: 500;
  --vo-font-weight-semibold: 600;
  --vo-font-weight-bold: 700;
  --vo-space-0: 0;
  --vo-space-1: 0.25rem;
  --vo-space-2: 0.5rem;
  --vo-space-3: 0.75rem;
  --vo-space-4: 1rem;
  --vo-space-5: 1.25rem;
  --vo-space-6: 1.5rem;
  --vo-space-7: 2rem;
  --vo-space-8: 2.5rem;
  --vo-space-9: 3rem;
  --vo-space-10: 4rem;
  --vo-space-11: 5rem;
  --vo-space-12: 6rem;
  --vo-radius-none: 0;
  --vo-radius-sm: 4px;
  --vo-radius-md: 8px;
  --vo-radius-lg: 12px;
  --vo-radius-xl: 16px;
  --vo-radius-full: 9999px;
  --vo-duration-fast: 100ms;
  --vo-duration-normal: 200ms;
  --vo-duration-slow: 300ms;
  --vo-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --vo-easing-enter: cubic-bezier(0, 0, 0, 1);
  --vo-easing-exit: cubic-bezier(0.3, 0, 1, 1);
  --vo-breakpoint-tablet: 640px;
  --vo-breakpoint-desktop: 1024px;
  --vo-size-icon-small: 1rem;
  --vo-size-icon: 1.25rem;
  --vo-size-thumbnail-small: 2rem;
  --vo-size-thumbnail: 2.5rem;
  --vo-size-thumbnail-large: 4rem;
  --vo-size-control-small: 1.75rem;
  --vo-size-control: 2.25rem;
  --vo-size-touch: 2.75rem;
  --vo-size-top-bar: 3.5rem;
  --vo-size-sidebar: 15rem;
  --vo-size-popover: 18rem;
  --vo-size-dialog: 38.75rem;
  --vo-size-page-narrow: 40rem;
  --vo-size-page: 62.375rem;
  --vo-size-page-wide: 80rem;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    color-scheme: dark;
    --vo-color-background: #131416;
    --vo-color-surface: #1b1c1f;
    --vo-color-surface-muted: #212226;
    --vo-color-surface-hover: #26282c;
    --vo-color-surface-selected: #2b2e34;
    --vo-color-navigation: #0f1012;
    --vo-color-control: #232428;
    --vo-color-border: #2d2f34;
    --vo-color-border-strong: #7c818a;
    --vo-color-text: #ecedef;
    --vo-color-text-muted: #a4a8b0;
    --vo-color-placeholder: #8a8e96;
    --vo-color-link: #b3a5ff;
    --vo-color-focus: #b3a5ff;
    --vo-color-primary: #b3a5ff;
    --vo-color-primary-hover: #cbc1ff;
    --vo-color-on-primary: #14102b;
    --vo-color-danger: #f2786f;
    --vo-color-danger-hover: #f59a92;
    --vo-color-on-danger: #0f1013;
    --vo-color-success-text: #7fd59c;
    --vo-color-success-surface: #13281b;
    --vo-color-warning-text: #f0c46e;
    --vo-color-warning-surface: #2c2210;
    --vo-color-danger-text: #ff9d95;
    --vo-color-danger-surface: #351716;
    --vo-color-info-text: #9fc2ff;
    --vo-color-info-surface: #14223d;
    --vo-color-top-bar: #0a0a0b;
    --vo-color-on-top-bar: #f2f2f3;
    --vo-color-on-top-bar-muted: #a9adb4;
    --vo-color-top-bar-control: #25272b;
    --vo-color-backdrop: #000000;
    --vo-color-code-ink: #0f1013;
    --vo-color-code-paper: #ffffff;
    --vo-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.4);
    --vo-shadow-md: 0 2px 6px -1px rgb(0 0 0 / 0.45), 0 1px 3px 0 rgb(0 0 0 / 0.3);
    --vo-shadow-lg: 0 10px 24px -4px rgb(0 0 0 / 0.55), 0 4px 8px -2px rgb(0 0 0 / 0.35);
  }
}

:root[data-theme='dark'] {
  color-scheme: dark;
  --vo-color-background: #131416;
  --vo-color-surface: #1b1c1f;
  --vo-color-surface-muted: #212226;
  --vo-color-surface-hover: #26282c;
  --vo-color-surface-selected: #2b2e34;
  --vo-color-navigation: #0f1012;
  --vo-color-control: #232428;
  --vo-color-border: #2d2f34;
  --vo-color-border-strong: #7c818a;
  --vo-color-text: #ecedef;
  --vo-color-text-muted: #a4a8b0;
  --vo-color-placeholder: #8a8e96;
  --vo-color-link: #b3a5ff;
  --vo-color-focus: #b3a5ff;
  --vo-color-primary: #b3a5ff;
  --vo-color-primary-hover: #cbc1ff;
  --vo-color-on-primary: #14102b;
  --vo-color-danger: #f2786f;
  --vo-color-danger-hover: #f59a92;
  --vo-color-on-danger: #0f1013;
  --vo-color-success-text: #7fd59c;
  --vo-color-success-surface: #13281b;
  --vo-color-warning-text: #f0c46e;
  --vo-color-warning-surface: #2c2210;
  --vo-color-danger-text: #ff9d95;
  --vo-color-danger-surface: #351716;
  --vo-color-info-text: #9fc2ff;
  --vo-color-info-surface: #14223d;
  --vo-color-top-bar: #0a0a0b;
  --vo-color-on-top-bar: #f2f2f3;
  --vo-color-on-top-bar-muted: #a9adb4;
  --vo-color-top-bar-control: #25272b;
  --vo-color-backdrop: #000000;
  --vo-color-code-ink: #0f1013;
  --vo-color-code-paper: #ffffff;
  --vo-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.4);
  --vo-shadow-md: 0 2px 6px -1px rgb(0 0 0 / 0.45), 0 1px 3px 0 rgb(0 0 0 / 0.3);
  --vo-shadow-lg: 0 10px 24px -4px rgb(0 0 0 / 0.55), 0 4px 8px -2px rgb(0 0 0 / 0.35);
}

:root[data-theme='light'] {
  color-scheme: light;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --vo-duration-fast: 0.01ms;
    --vo-duration-normal: 0.01ms;
    --vo-duration-slow: 0.01ms;
  }
}