@layer reset{*{scrollbar-width:thin}}@layer reset, base, tokens, recipes, utilities;

@layer base{
  :root {
    --made-with-panda: '🐼';
}

  * {
    font-feature-settings: "cv11";
}

  html {
    background: var(--colors-bg);
    color: var(--colors-fg);
    line-height: 1.5;
    --colors-color-palette-500: var(--colors-gray-500);
    --colors-color-palette-contrast: var(--colors-gray-contrast);
    --colors-color-palette-fg: var(--colors-gray-fg);
    --colors-color-palette-subtle: var(--colors-gray-subtle);
    --colors-color-palette-muted: var(--colors-gray-muted);
    --colors-color-palette-emphasized: var(--colors-gray-emphasized);
    --colors-color-palette-solid: var(--colors-gray-solid);
    --colors-color-palette-focus-ring: var(--colors-gray-focus-ring);
}

  *::placeholder,*[data-placeholder] {
    --mix-color: color-mix(in srgb, var(--colors-fg-muted) 80%, transparent);
    color: var(--mix-color, var(--colors-fg-muted));
}

  *::selection {
    --mix-background: color-mix(in srgb, var(--colors-color-palette-emphasized) 80%, transparent);
    background: var(--mix-background, var(--colors-color-palette-emphasized));
}

  html,body,#root {
    overflow: hidden;
    height: 100%;
    max-height: 100vh;
}
}

@layer tokens{
  :where(:root, :host) {
    --aspect-ratios-square: 1 / 1;
    --animations-spin: spin 1s linear infinite;
    --animations-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
    --borders-xs: 0.5px solid;
    --colors-transparent: transparent;
    --colors-black: #09090B;
    --colors-white: #FFFFFF;
    --colors-black-alpha-500: rgba(0, 0, 0, 0.36);
    --colors-gray-50: #fafafa;
    --colors-gray-100: #f4f4f5;
    --colors-gray-200: #e4e4e7;
    --colors-gray-300: #d4d4d8;
    --colors-gray-400: #a1a1aa;
    --colors-gray-500: #71717a;
    --colors-gray-600: #52525b;
    --colors-gray-700: #3f3f46;
    --colors-gray-800: #27272a;
    --colors-gray-900: #18181b;
    --colors-gray-950: #111111;
    --colors-red-50: #fef2f2;
    --colors-red-100: #fee2e2;
    --colors-red-200: #fecaca;
    --colors-red-300: #fca5a5;
    --colors-red-400: #f87171;
    --colors-red-500: #ef4444;
    --colors-red-600: #dc2626;
    --colors-red-700: #991919;
    --colors-red-800: #511111;
    --colors-red-900: #300c0c;
    --colors-orange-50: #fff7ed;
    --colors-orange-200: #fed7aa;
    --colors-orange-500: #f97316;
    --colors-orange-600: #ea580c;
    --colors-orange-700: #92310a;
    --colors-orange-800: #6c2710;
    --colors-orange-900: #3b1106;
    --colors-yellow-200: #fef08a;
    --colors-yellow-800: #713f12;
    --colors-green-50: #f0fdf4;
    --colors-green-100: #dcfce7;
    --colors-green-200: #bbf7d0;
    --colors-green-300: #86efac;
    --colors-green-500: #22c55e;
    --colors-green-600: #16a34a;
    --colors-green-700: #116932;
    --colors-green-800: #124a28;
    --colors-green-900: #042713;
    --colors-blue-50: #eff6ff;
    --colors-blue-100: #dbeafe;
    --colors-blue-200: #bfdbfe;
    --colors-blue-400: #60a5fa;
    --colors-blue-500: #3b82f6;
    --colors-blue-600: #2563eb;
    --colors-blue-700: #173da6;
    --colors-blue-800: #1a3478;
    --colors-blue-900: #14204a;
    --colors-purple-50: #faf5ff;
    --colors-purple-100: #f3e8ff;
    --colors-purple-200: #e9d5ff;
    --colors-purple-400: #c084fc;
    --colors-purple-500: #a855f7;
    --colors-purple-600: #9333ea;
    --colors-purple-800: #4a1772;
    --colors-purple-900: #2f0553;
    --durations-faster: 100ms;
    --durations-fast: 150ms;
    --durations-moderate: 200ms;
    --durations-slow: 300ms;
    --durations-slower: 400ms;
    --durations-slowest: 500ms;
    --easings-ease-in-smooth: cubic-bezier(0.32, 0.72, 0, 1);
    --fonts-heading: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    --fonts-mono: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
    --font-sizes-2xs: 0.625rem;
    --font-sizes-xs: 0.75rem;
    --font-sizes-sm: 0.875rem;
    --font-sizes-md: 1rem;
    --font-sizes-lg: 1.125rem;
    --font-sizes-xl: 1.25rem;
    --font-sizes-2xl: 1.5rem;
    --font-sizes-4xl: 2.25rem;
    --font-weights-medium: 500;
    --font-weights-semibold: 600;
    --font-weights-bold: 700;
    --radii-xs: 0.125rem;
    --radii-sm: 0.25rem;
    --radii-md: 0.375rem;
    --radii-lg: 0.5rem;
    --radii-xl: 0.75rem;
    --radii-full: 9999px;
    --spacing-1: 0.25rem;
    --spacing-2: 0.5rem;
    --spacing-3: 0.75rem;
    --spacing-4: 1rem;
    --spacing-5: 1.25rem;
    --spacing-6: 1.5rem;
    --spacing-8: 2rem;
    --spacing-12: 3rem;
    --spacing-16: 4rem;
    --spacing-32: 8rem;
    --spacing-0\.5: 0.125rem;
    --spacing-1\.5: 0.375rem;
    --spacing-2\.5: 0.625rem;
    --spacing-3\.5: 0.875rem;
    --sizes-1: 0.25rem;
    --sizes-4: 1rem;
    --sizes-5: 1.25rem;
    --sizes-6: 1.5rem;
    --sizes-7: 1.75rem;
    --sizes-8: 2rem;
    --sizes-9: 2.25rem;
    --sizes-10: 2.5rem;
    --sizes-12: 3rem;
    --sizes-96: 24rem;
    --sizes-2xs: 16rem;
    --sizes-xs: 20rem;
    --sizes-md: 28rem;
    --sizes-7xl: 80rem;
    --sizes-8xl: 90rem;
    --sizes-3\.5: 0.875rem;
    --sizes-4\.5: 1.125rem;
    --sizes-full: 100%;
    --sizes-breakpoint-lg: 1024px;
    --sizes-breakpoint-xl: 1280px;
    --z-index-docked: 10;
    --z-index-dropdown: 1000;
    --z-index-overlay: 1300;
    --z-index-modal: 1400;
    --z-index-popover: 1500;
    --z-index-tooltip: 1800;
    --cursor-button: pointer;
    --cursor-checkbox: default;
    --cursor-disabled: not-allowed;
    --cursor-option: default;
    --radii-l1: var(--radii-xs);
    --radii-l2: var(--radii-sm);
    --radii-l3: var(--radii-md);
}

  .light {
    --colors-bg: var(--colors-white);
    --colors-bg-subtle: var(--colors-gray-50);
    --colors-bg-muted: var(--colors-gray-100);
    --colors-bg-emphasized: var(--colors-gray-200);
    --colors-bg-inverted: var(--colors-black);
    --colors-bg-panel: var(--colors-white);
    --colors-fg: var(--colors-black);
    --colors-fg-muted: var(--colors-gray-600);
    --colors-fg-subtle: var(--colors-gray-400);
    --colors-fg-inverted: var(--colors-gray-50);
    --colors-fg-error: var(--colors-red-500);
    --colors-border: var(--colors-gray-200);
    --colors-border-muted: var(--colors-gray-100);
    --colors-border-subtle: var(--colors-gray-50);
    --colors-border-error: var(--colors-red-500);
    --colors-gray-contrast: var(--colors-white);
    --colors-gray-fg: var(--colors-gray-800);
    --colors-gray-subtle: var(--colors-gray-100);
    --colors-gray-muted: var(--colors-gray-200);
    --colors-gray-emphasized: var(--colors-gray-300);
    --colors-gray-solid: var(--colors-gray-900);
    --colors-gray-focus-ring: var(--colors-gray-400);
    --colors-red-contrast: white;
    --colors-red-fg: var(--colors-red-700);
    --colors-red-subtle: var(--colors-red-100);
    --colors-red-muted: var(--colors-red-200);
    --colors-red-emphasized: var(--colors-red-300);
    --colors-red-solid: var(--colors-red-600);
    --colors-red-focus-ring: var(--colors-red-500);
    --colors-orange-contrast: white;
    --colors-orange-muted: var(--colors-orange-200);
    --colors-orange-solid: var(--colors-orange-600);
    --colors-green-contrast: white;
    --colors-green-fg: var(--colors-green-700);
    --colors-green-subtle: var(--colors-green-100);
    --colors-green-muted: var(--colors-green-200);
    --colors-green-solid: var(--colors-green-600);
    --colors-green-focus-ring: var(--colors-green-500);
    --colors-blue-muted: var(--colors-blue-200);
    --colors-blue-solid: var(--colors-blue-600);
    --colors-blue-focus-ring: var(--colors-blue-500);
    --colors-yellow-muted: var(--colors-yellow-200);
    --colors-purple-muted: var(--colors-purple-200);
    --shadows-xs: 0px 1px 2px color-mix(in srgb, var(--colors-gray-900) 10%, transparent), 0px 0px 1px color-mix(in srgb, var(--colors-gray-900) 20%, transparent);
    --shadows-sm: 0px 2px 4px color-mix(in srgb, var(--colors-gray-900) 10%, transparent), 0px 0px 1px color-mix(in srgb, var(--colors-gray-900) 30%, transparent);
    --shadows-md: 0px 4px 8px color-mix(in srgb, var(--colors-gray-900) 10%, transparent), 0px 0px 1px color-mix(in srgb, var(--colors-gray-900) 30%, transparent);
    --shadows-lg: 0px 8px 16px color-mix(in srgb, var(--colors-gray-900) 10%, transparent), 0px 0px 1px color-mix(in srgb, var(--colors-gray-900) 30%, transparent);
    --shadows-xl: 0px 16px 24px color-mix(in srgb, var(--colors-gray-900) 10%, transparent), 0px 0px 1px color-mix(in srgb, var(--colors-gray-900) 30%, transparent)}

  .dark {
    --colors-bg: var(--colors-black);
    --colors-bg-subtle: var(--colors-gray-950);
    --colors-bg-muted: var(--colors-gray-900);
    --colors-bg-emphasized: var(--colors-gray-800);
    --colors-bg-inverted: var(--colors-white);
    --colors-bg-panel: var(--colors-gray-950);
    --colors-fg: var(--colors-gray-50);
    --colors-fg-muted: var(--colors-gray-400);
    --colors-fg-subtle: var(--colors-gray-500);
    --colors-fg-inverted: var(--colors-black);
    --colors-fg-error: var(--colors-red-400);
    --colors-border: var(--colors-gray-800);
    --colors-border-muted: var(--colors-gray-900);
    --colors-border-subtle: var(--colors-gray-950);
    --colors-border-error: var(--colors-red-400);
    --colors-gray-contrast: var(--colors-black);
    --colors-gray-fg: var(--colors-gray-200);
    --colors-gray-subtle: var(--colors-gray-900);
    --colors-gray-muted: var(--colors-gray-800);
    --colors-gray-emphasized: var(--colors-gray-700);
    --colors-gray-solid: var(--colors-white);
    --colors-gray-focus-ring: var(--colors-gray-400);
    --colors-red-contrast: white;
    --colors-red-fg: var(--colors-red-300);
    --colors-red-subtle: var(--colors-red-900);
    --colors-red-muted: var(--colors-red-800);
    --colors-red-emphasized: var(--colors-red-700);
    --colors-red-solid: var(--colors-red-600);
    --colors-red-focus-ring: var(--colors-red-500);
    --colors-orange-contrast: black;
    --colors-orange-muted: var(--colors-orange-800);
    --colors-orange-solid: var(--colors-orange-500);
    --colors-green-contrast: white;
    --colors-green-fg: var(--colors-green-300);
    --colors-green-subtle: var(--colors-green-900);
    --colors-green-muted: var(--colors-green-800);
    --colors-green-solid: var(--colors-green-600);
    --colors-green-focus-ring: var(--colors-green-500);
    --colors-blue-muted: var(--colors-blue-800);
    --colors-blue-solid: var(--colors-blue-600);
    --colors-blue-focus-ring: var(--colors-blue-500);
    --colors-yellow-muted: var(--colors-yellow-800);
    --colors-purple-muted: var(--colors-purple-800);
    --shadows-xs: 0px 1px 1px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, var(--colors-gray-300) 20%, transparent);
    --shadows-sm: 0px 2px 4px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, var(--colors-gray-300) 30%, transparent);
    --shadows-md: 0px 4px 8px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, var(--colors-gray-300) 30%, transparent);
    --shadows-lg: 0px 8px 16px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, var(--colors-gray-300) 30%, transparent);
    --shadows-xl: 0px 16px 24px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, var(--colors-gray-300) 30%, transparent)}

  @keyframes fade-in {
    from {
      opacity: 0;
}

    to {
      opacity: 1;
}
}

  @keyframes fade-out {
    from {
      opacity: 1;
}

    to {
      opacity: 0;
}
}
}

@layer recipes{
  @layer _base{

    .button {
      border-radius: var(--radii-l2);
      border-width: 1px;
      border-color: var(--colors-transparent);
      outline: 0;
      display: inline-flex;
      appearance: none;
      -webkit-appearance: none;
      align-items: center;
      justify-content: center;
      -webkit-user-select: none;
      user-select: none;
      position: relative;
      white-space: nowrap;
      vertical-align: middle;
      cursor: var(--cursor-button);
      flex-shrink: 0;
      line-height: 1.2;
      isolation: isolate;
      font-weight: var(--font-weights-medium);
      --transition-prop: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
      transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
      --transition-duration: var(--durations-moderate);
      transition-duration: var(--durations-moderate);
      --focus-ring-color: undefined;
}

    .button:is(:focus-visible, [data-focus-visible]) {
      outline-width: var(--focus-ring-width, 2px);
      outline-offset: 2px;
      outline-style: var(--focus-ring-style, solid);
      outline-color: var(--focus-ring-color);
}

    .button:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
      opacity: 0.5;
      cursor: not-allowed;
}

    .button :where(svg) {
      flex-shrink: 0;
}

    .spinner {
      --spinner-track-color: transparent;
      animation: var(--animations-spin);
      border-color: currentColor;
      border-style: solid;
      border-width: 2px;
      border-radius: var(--radii-full);
      display: inline-block;
      animation-duration: var(--durations-slowest);
      border-inline-start-color: var(--spinner-track-color);
      width: var(--spinner-size);
      height: var(--spinner-size);
      border-bottom-color: var(--spinner-track-color);
}

    .input {
      --focus-color: var(--colors-color-palette-focus-ring);
      --error-color: var(--colors-border-error);
      outline: 0;
      border-radius: var(--radii-l2);
      position: relative;
      appearance: none;
      -webkit-appearance: none;
      text-align: start;
      width: 100%;
      min-width: var(--input-height);
      height: var(--input-height);
}

    .input:is(:invalid, [data-invalid], [aria-invalid=true]) {
      border-color: var(--error-color);
      --focus-ring-color: var(--error-color);
}

    .input:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
      opacity: 0.5;
      cursor: not-allowed;
}

    .heading {
      font-family: var(--fonts-heading);
      font-weight: var(--font-weights-semibold);
}

    .icon {
      display: inline-block;
      line-height: 1em;
      flex-shrink: 0;
      color: currentcolor;
      vertical-align: middle;
}

    .separator {
      border-color: var(--colors-border);
      display: block;
}

    .badge {
      border-radius: var(--radii-l2);
      gap: var(--spacing-1);
      font-weight: var(--font-weights-medium);
      font-variant-numeric: tabular-nums;
      white-space: nowrap;
      -webkit-user-select: none;
      user-select: none;
}

    .badge,.link {
      display: inline-flex;
      align-items: center;
}

    .link {
      outline: 2px solid transparent;
      outline-offset: 2px;
      gap: var(--spacing-1\.5);
      border-radius: var(--radii-l1);
      cursor: pointer;
      --focus-ring-color: undefined;
}

    .link:is(:focus, [data-focus]) {
      outline-width: var(--focus-ring-width, 2px);
      outline-offset: 2px;
      outline-style: var(--focus-ring-style, solid);
      outline-color: var(--focus-ring-color);
}

    .code {
      font-family: var(--fonts-mono);
      display: inline-flex;
}

    .code,.input-addon {
      border-radius: var(--radii-l2);
      align-items: center;
}

    .input-addon {
      flex: 0 0 auto;
      display: flex;
      white-space: nowrap;
      align-self: stretch;
      width: auto;
}

    .textarea {
      --focus-color: var(--colors-color-palette-focus-ring);
      --error-color: var(--colors-border-error);
      outline: 0;
      border-radius: var(--radii-l2);
      position: relative;
      appearance: none;
      -webkit-appearance: none;
      text-align: start;
      width: 100%;
      min-width: 0;
}

    .textarea:is(:invalid, [data-invalid], [aria-invalid=true]) {
      border-color: var(--error-color);
      --focus-ring-color: var(--error-color);
}

    .textarea:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
      opacity: 0.5;
      cursor: not-allowed;
}
}

  .button--size_md {
    padding-inline: var(--spacing-4);
    gap: var(--spacing-2);
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
    height: var(--sizes-10);
    min-width: var(--sizes-10);
}

  .button--size_md :where(svg) {
    width: var(--sizes-5);
    height: var(--sizes-5);
}

  .button--variant_solid {
    background: var(--colors-color-palette-solid);
    border-color: var(--colors-transparent);
    color: var(--colors-color-palette-contrast);
}

  .button--variant_solid:is([aria-expanded=true], [data-expanded], [data-state="expanded"]) {
    --mix-background: color-mix(in srgb, var(--colors-color-palette-solid) 90%, transparent);
    background: var(--mix-background, var(--colors-color-palette-solid));
}

  .button--variant_solid:is(:hover, [data-hover]) {
    --mix-background: color-mix(in srgb, var(--colors-color-palette-solid) 90%, transparent);
    background: var(--mix-background, var(--colors-color-palette-solid));
}

  .button--variant_ghost {
    background: var(--colors-transparent);
    color: var(--colors-color-palette-fg);
}

  .button--variant_ghost:is([aria-expanded=true], [data-expanded], [data-state="expanded"]) {
    background: var(--colors-color-palette-subtle);
}

  .button--variant_ghost:is(:hover, [data-hover]) {
    background: var(--colors-color-palette-subtle);
}

  .button--variant_outline {
    border-width: 1px;
    border-color: var(--colors-color-palette-muted);
    color: var(--colors-color-palette-fg);
}

  .button--variant_outline:is([aria-expanded=true], [data-expanded], [data-state="expanded"]) {
    background: var(--colors-color-palette-subtle);
}

  .button--variant_outline:is(:hover, [data-hover]) {
    background: var(--colors-color-palette-subtle);
}

  .button--variant_plain,.button--variant_subtle {
    color: var(--colors-color-palette-fg);
}

  .button--variant_subtle {
    background: var(--colors-color-palette-subtle);
    border-color: var(--colors-transparent);
}

  .button--variant_subtle:is([aria-expanded=true], [data-expanded], [data-state="expanded"]) {
    background: var(--colors-color-palette-muted);
}

  .button--variant_subtle:is(:hover, [data-hover]) {
    background: var(--colors-color-palette-muted);
}

  .button--size_xs {
    padding-inline: var(--spacing-2\.5);
    gap: var(--spacing-1);
    font-size: var(--font-sizes-xs);
    line-height: 1rem;
    height: var(--sizes-8);
    min-width: var(--sizes-8);
}

  .button--size_xs :where(svg) {
    width: var(--sizes-4);
    height: var(--sizes-4);
}

  .button--size_sm {
    padding-inline: var(--spacing-3\.5);
    gap: var(--spacing-2);
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
    height: var(--sizes-9);
    min-width: var(--sizes-9);
}

  .button--size_sm :where(svg) {
    width: var(--sizes-4);
    height: var(--sizes-4);
}

  .button--size_2xs {
    padding-inline: var(--spacing-2);
    gap: var(--spacing-1);
    font-size: var(--font-sizes-xs);
    line-height: 1rem;
    height: var(--sizes-6);
    min-width: var(--sizes-6);
}

  .button--size_2xs :where(svg) {
    width: var(--sizes-3\.5);
    height: var(--sizes-3\.5);
}

  .button--variant_surface {
    background: var(--colors-color-palette-subtle);
    color: var(--colors-color-palette-fg);
    box-shadow: 0 0 0px 1px var(--shadow-color);
    --shadow-color: var(--colors-color-palette-muted);
}

  .button--variant_surface:is([aria-expanded=true], [data-expanded], [data-state="expanded"]) {
    background: var(--colors-color-palette-muted);
}

  .button--variant_surface:is(:hover, [data-hover]) {
    background: var(--colors-color-palette-muted);
}

  .spinner--size_sm {
    --spinner-size: var(--sizes-4);
}

  .spinner--size_md {
    --spinner-size: var(--sizes-5);
}

  .spinner--size_lg {
    --spinner-size: var(--sizes-8);
}

  .spinner--size_xs {
    --spinner-size: var(--sizes-3);
}

  .input--size_md {
    --input-height: var(--sizes-10);
    padding-inline: var(--spacing-3);
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
}

  .input--variant_outline {
    background: var(--colors-transparent);
    border-width: 1px;
    border-color: var(--colors-border);
    --focus-ring-color: var(--focus-color);
}

  .input--variant_outline:is(:focus-visible, [data-focus-visible]) {
    outline-offset: 0px;
    outline-width: var(--focus-ring-width, 1px);
    outline-color: var(--focus-ring-color);
    outline-style: var(--focus-ring-style, solid);
    border-color: var(--focus-ring-color);
}

  .input--variant_subtle {
    background: var(--colors-bg-muted);
    border-width: 1px;
    border-color: var(--colors-transparent);
    --focus-ring-color: var(--focus-color);
}

  .input--variant_subtle:is(:focus-visible, [data-focus-visible]) {
    outline-offset: 0px;
    outline-width: var(--focus-ring-width, 1px);
    outline-color: var(--focus-ring-color);
    outline-style: var(--focus-ring-style, solid);
    border-color: var(--focus-ring-color);
}

  .skeleton--variant_pulse {
    background: var(--colors-bg-emphasized);
    animation: var(--animations-pulse);
    animation-duration: var(--duration, 1.2s);
}

  .skeleton--loading_true {
    border-radius: var(--radii-l2);
    box-shadow: none;
    background-clip: padding-box;
    -webkit-background-clip: padding-box;
    cursor: default;
    color: var(--colors-transparent);
    pointer-events: none;
    -webkit-user-select: none;
    user-select: none;
    flex-shrink: 0;
}

  .skeleton--loading_true::before,.skeleton--loading_true::after,.skeleton--loading_true * {
    visibility: hidden;
}

  .heading--size_2xl {
    font-size: var(--font-sizes-2xl);
    line-height: 2rem;
}

  .heading--size_lg {
    font-size: var(--font-sizes-lg);
    line-height: 1.75rem;
}

  .heading--size_sm {
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
}

  .heading--size_md {
    font-size: var(--font-sizes-md);
    line-height: 1.5rem;
}

  .heading--size_xl {
    font-size: var(--font-sizes-xl);
    line-height: 1.875rem;
}

  .separator--size_sm {
    --separator-thickness: 1px;
}

  .separator--variant_solid {
    border-style: solid;
}

  .separator--orientation_horizontal {
    border-top-width: var(--separator-thickness);
}

  .separator--orientation_vertical {
    border-inline-start-width: var(--separator-thickness);
}

  .badge--variant_solid {
    background: var(--colors-color-palette-solid);
    color: var(--colors-color-palette-contrast);
}

  .badge--size_sm {
    padding-inline: var(--spacing-1\.5);
    font-size: var(--font-sizes-xs);
    line-height: 1rem;
    min-height: var(--sizes-5);
}

  .badge--variant_subtle {
    background: var(--colors-color-palette-subtle);
    color: var(--colors-color-palette-fg);
}

  .badge--size_xs {
    padding-inline: var(--spacing-1);
    font-size: var(--font-sizes-2xs);
    line-height: 0.75rem;
    min-height: var(--sizes-4);
}

  .badge--variant_outline {
    color: var(--colors-color-palette-fg);
    box-shadow: inset 0 0 0px 1px var(--shadow-color);
    --shadow-color: var(--colors-color-palette-muted);
}

  .badge--size_md {
    padding-inline: var(--spacing-2);
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
    min-height: var(--sizes-6);
}

  .badge--variant_surface {
    background: var(--colors-color-palette-subtle);
    color: var(--colors-color-palette-fg);
    box-shadow: inset 0 0 0px 1px var(--shadow-color);
    --shadow-color: var(--colors-color-palette-muted);
}

  .badge--size_lg {
    padding-inline: var(--spacing-2\.5);
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
    min-height: var(--sizes-7);
}

  .link--variant_plain {
    color: var(--colors-color-palette-fg);
}

  .link--variant_plain:is(:hover, [data-hover]) {
    text-decoration: underline;
    text-underline-offset: 3px;
    --mix-textDecorationColor: color-mix(in srgb, currentColor 20%, transparent);
    text-decoration-color: var(--mix-textDecorationColor, currentColor);
}

  .code--variant_surface {
    background: var(--colors-color-palette-subtle);
    color: var(--colors-color-palette-fg);
    box-shadow: inset 0 0 0px 1px var(--shadow-color);
    --shadow-color: var(--colors-color-palette-muted);
}

  .code--size_sm {
    padding-inline: var(--spacing-1\.5);
    font-size: var(--font-sizes-xs);
    line-height: 1rem;
    min-height: var(--sizes-5);
}

  .input-addon--size_md {
    --input-height: var(--sizes-10);
    padding-inline: var(--spacing-3);
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
}

  .input-addon--variant_outline {
    background: var(--colors-bg-muted);
    border-width: 1px;
    border-color: var(--colors-border);
}

  .textarea--size_md {
    padding-inline: var(--spacing-3);
    padding-block: var(--spacing-2);
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
    scroll-padding-bottom: var(--spacing-2);
}

  .textarea--variant_outline {
    background: var(--colors-transparent);
    border-width: 1px;
    border-color: var(--colors-border);
    --focus-ring-color: undefined;
}

  .textarea--variant_outline:is(:focus-visible, [data-focus-visible]) {
    outline-offset: 0px;
    outline-width: var(--focus-ring-width, 1px);
    outline-color: var(--focus-ring-color);
    outline-style: var(--focus-ring-style, solid);
    border-color: var(--focus-ring-color);
}
}

@layer recipes.slots{
  @layer _base{

    .card__root {
      border-radius: var(--radii-l3);
      position: relative;
      word-wrap: break-word;
      color: var(--colors-fg);
      text-align: start;
      min-width: 0;
}

    .card__root,.card__header {
      display: flex;
      flex-direction: column;
}

    .card__header {
      padding-inline: var(--card-padding);
      gap: var(--spacing-1\.5);
      padding-top: var(--card-padding);
}

    .card__body {
      padding: var(--card-padding);
      flex: 1 1 0%;
      display: flex;
      flex-direction: column;
}

    .card__footer {
      gap: var(--spacing-2);
      padding-inline: var(--card-padding);
      display: flex;
      align-items: center;
      padding-bottom: var(--card-padding);
}

    .card__title {
      font-weight: var(--font-weights-semibold);
}

    .card__description {
      color: var(--colors-fg-muted);
      font-size: var(--font-sizes-sm);
}

    .empty-state__root {
      width: var(--sizes-full);
}

    .empty-state__content {
      flex-direction: column;
}

    .empty-state__content,.empty-state__indicator {
      display: flex;
      align-items: center;
      justify-content: center;
}

    .empty-state__indicator {
      color: var(--colors-fg-subtle);
}

    .empty-state__indicator :where(svg) {
      width: 1em;
      height: 1em;
}

    .empty-state__title {
      font-weight: var(--font-weights-semibold);
}

    .empty-state__description {
      font-size: var(--font-sizes-sm);
      line-height: 1.25rem;
      color: var(--colors-fg-muted);
}

    .toast__root {
      --toast-trigger-bg: var(--colors-bg-muted);
      background: var(--colors-bg-panel);
      gap: var(--spacing-3);
      padding-block: var(--spacing-4);
      border-radius: var(--radii-l2);
      transition: translate 400ms, scale 400ms, opacity 400ms, height 400ms, box-shadow 200ms;
      display: flex;
      align-items: flex-start;
      position: relative;
      padding-inline-start: var(--spacing-4);
      padding-inline-end: var(--spacing-6);
      translate: var(--x) var(--y);
      scale: var(--scale);
      z-index: var(--z-index);
      opacity: var(--opacity);
      will-change: translate, opacity, scale;
      --transition-easing: cubic-bezier(0.21, 1.02, 0.73, 1);
      transition-timing-function: cubic-bezier(0.21, 1.02, 0.73, 1);
      color: var(--colors-fg);
      box-shadow: var(--shadows-xl);
      width: var(--sizes-full);
      height: var(--height);
}

    .toast__root[data-type=warning] {
      background: var(--colors-orange-solid);
      color: var(--colors-orange-contrast);
}

    .toast__root[data-type=warning],.toast__root[data-type=success] {
      --toast-trigger-bg: color-mix(in srgb, white 10%, transparent);
      --toast-border-color: color-mix(in srgb, white 40%, transparent);
}

    .toast__root[data-type=success] {
      background: var(--colors-green-solid);
      color: var(--colors-green-contrast);
}

    .toast__root[data-type=error] {
      --toast-trigger-bg: color-mix(in srgb, white 10%, transparent);
      --toast-border-color: color-mix(in srgb, white 40%, transparent);
      background: var(--colors-red-solid);
      color: var(--colors-red-contrast);
}

    .toast__root:is([closed], [data-closed], [data-state="closed"]) {
      transition: translate 400ms, scale 400ms, opacity 200ms;
      --transition-easing: cubic-bezier(0.06, 0.71, 0.55, 1);
      transition-timing-function: cubic-bezier(0.06, 0.71, 0.55, 1);
}

    .toast__title {
      font-weight: var(--font-weights-medium);
      margin-inline-end: var(--spacing-2);
}

    .toast__title,.toast__description {
      font-size: var(--font-sizes-sm);
      line-height: 1.25rem;
}

    .toast__description {
      display: inline;
      opacity: 0.8;
}

    .toast__indicator {
      flex-shrink: 0;
      width: var(--sizes-5);
      height: var(--sizes-5);
}

    .toast__closeTrigger {
      padding: var(--spacing-1);
      border-radius: var(--radii-l2);
      transition: background 200ms;
      position: absolute;
      inset-inline-end: var(--spacing-1);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: color-mix(in srgb, currentColor 60%, transparent);
      font-size: var(--font-sizes-md);
      line-height: 1.5rem;
      top: var(--spacing-1);
}

    .toast__closeTrigger :where(svg) {
      width: 1em;
      height: 1em;
}

    .toast__actionTrigger {
      padding-inline: var(--spacing-3);
      border-radius: var(--radii-l2);
      border-width: 1px;
      border-color: var(--toast-border-color, inherit);
      transition: background 200ms;
      font-size: var(--font-sizes-sm);
      line-height: 1.25rem;
      font-weight: var(--font-weights-medium);
      align-self: center;
      height: var(--sizes-8);
}

    .toast__actionTrigger:is(:hover, [data-hover]) {
      background: var(--toast-trigger-bg);
}

    .field__root {
      gap: var(--spacing-1\.5);
      display: flex;
      position: relative;
      width: 100%;
}

    .field__errorText {
      gap: var(--spacing-1);
      display: inline-flex;
      align-items: center;
      font-weight: var(--font-weights-medium);
      color: var(--colors-fg-error);
}

    .field__errorText,.field__helperText {
      font-size: var(--font-sizes-xs);
      line-height: 1rem;
}

    .field__helperText {
      color: var(--colors-fg-muted);
}

    .field__label {
      gap: var(--spacing-1);
      display: flex;
      align-items: center;
      text-align: start;
      font-size: var(--font-sizes-sm);
      line-height: 1.25rem;
      font-weight: var(--font-weights-medium);
      -webkit-user-select: none;
      user-select: none;
}

    .field__label:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
      opacity: 0.5;
}

    .field__requiredIndicator {
      color: var(--colors-fg-error);
      line-height: 1;
}

    .alert__title {
      font-weight: var(--font-weights-medium);
}

    .alert__description {
      display: inline;
}

    .alert__root {
      border-radius: var(--radii-l3);
      display: flex;
      align-items: flex-start;
      position: relative;
      width: var(--sizes-full);
}

    .alert__indicator {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      width: 1em;
      height: 1em;
}

    .alert__indicator :where(svg) {
      width: var(--sizes-full);
      height: var(--sizes-full);
}

    .alert__content {
      flex: 1 1 0%;
      gap: var(--spacing-1);
      display: flex;
}

    .checkbox__root {
      gap: var(--spacing-2);
      display: inline-flex;
      align-items: center;
      vertical-align: top;
      position: relative;
}

    .checkbox__label {
      font-weight: var(--font-weights-medium);
      -webkit-user-select: none;
      user-select: none;
}

    .checkbox__label:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
      opacity: 0.5;
}

    .checkbox__control {
      border-width: 1px;
      border-color: var(--colors-transparent);
      border-radius: var(--radii-l1);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      color: var(--colors-white);
      cursor: var(--cursor-checkbox);
      --focus-ring-color: undefined;
}

    .checkbox__control:is(:focus-visible, [data-focus-visible]) {
      outline-width: var(--focus-ring-width, 2px);
      outline-offset: 2px;
      outline-style: var(--focus-ring-style, solid);
      outline-color: var(--focus-ring-color);
}

    .checkbox__control:is(:invalid, [data-invalid], [aria-invalid=true]) {
      border-color: var(--colors-border-error);
      --colors-color-palette-500: var(--colors-red-500);
      --colors-color-palette-contrast: var(--colors-red-contrast);
      --colors-color-palette-fg: var(--colors-red-fg);
      --colors-color-palette-subtle: var(--colors-red-subtle);
      --colors-color-palette-muted: var(--colors-red-muted);
      --colors-color-palette-emphasized: var(--colors-red-emphasized);
      --colors-color-palette-solid: var(--colors-red-solid);
      --colors-color-palette-focus-ring: var(--colors-red-focus-ring);
}

    .checkbox__control :where(svg) {
      width: var(--sizes-full);
      height: var(--sizes-full);
}

    .checkbox__control:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
      opacity: 0.5;
      cursor: var(--cursor-disabled);
}

    .tooltip__arrowTip {
      border-color: var(--tooltip-bg);
      border-inline-start-width: 1px;
      border-top-width: 1px;
}

    .tooltip__content {
      --tooltip-bg: var(--colors-bg-inverted);
      background: var(--tooltip-bg);
      padding-inline: var(--spacing-2\.5);
      padding-block: var(--spacing-1);
      border-radius: var(--radii-l2);
      color: var(--colors-fg-inverted);
      font-weight: var(--font-weights-medium);
      font-size: var(--font-sizes-xs);
      line-height: 1rem;
      box-shadow: var(--shadows-md);
      z-index: var(--z-index-tooltip);
      transform-origin: var(--transform-origin);
      max-width: var(--sizes-xs);
}

    .tooltip__content:is([open], [data-open], [data-state="open"], :popover-open) {
      transform-origin: var(--transform-origin);
      animation-name: scale-in, fade-in;
      animation-duration: var(--durations-fast);
}

    .tooltip__content:is([closed], [data-closed], [data-state="closed"]) {
      transform-origin: var(--transform-origin);
      animation-name: scale-out, fade-out;
      animation-duration: var(--durations-fast);
}

    .accordion__root {
      --accordion-radius: var(--radii-l2);
      width: var(--sizes-full);
}

    .accordion__item {
      overflow-anchor: none;
}

    .accordion__itemTrigger {
      outline: 0;
      gap: var(--spacing-3);
      border-radius: var(--accordion-radius);
      display: flex;
      align-items: center;
      text-align: start;
      font-weight: var(--font-weights-medium);
      width: var(--sizes-full);
}

    .accordion__itemTrigger:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
      opacity: 0.5;
      cursor: not-allowed;
}

    .accordion__itemTrigger:is(:focus-visible, [data-focus-visible]) {
      outline: 2px solid;
      outline-color: var(--colors-color-palette-focus-ring);
}

    .accordion__itemContent {
      overflow: hidden;
      border-radius: var(--accordion-radius);
}

    .accordion__itemContent:is([open], [data-open], [data-state="open"], :popover-open) {
      animation-name: expand-height, fade-in;
      animation-duration: var(--durations-moderate);
}

    .accordion__itemContent:is([closed], [data-closed], [data-state="closed"]) {
      animation-name: collapse-height, fade-out;
      animation-duration: var(--durations-moderate);
}

    .accordion__itemIndicator {
      transition: rotate 0.2s;
      transform-origin: center;
      color: var(--colors-fg-subtle);
}

    .accordion__itemIndicator:is([open], [data-open], [data-state="open"], :popover-open) {
      rotate: 180deg;
}

    .accordion__itemIndicator :where(svg) {
      width: 1.2em;
      height: 1.2em;
}

    .accordion__itemBody {
      padding-top: var(--accordion-padding-y);
      padding-bottom: calc(var(--accordion-padding-y) * 2);
}

    .breadcrumb__link {
      outline: 0;
      text-decoration: none;
      border-radius: var(--radii-l1);
      gap: var(--spacing-2);
      --focus-ring-color: undefined;
}

    .breadcrumb__link:is(:focus, [data-focus]) {
      outline-width: var(--focus-ring-width, 2px);
      outline-offset: 2px;
      outline-style: var(--focus-ring-style, solid);
      outline-color: var(--focus-ring-color);
}

    .breadcrumb__link,.breadcrumb__item {
      display: inline-flex;
      align-items: center;
}

    .breadcrumb__list {
      list-style: none;
      display: flex;
      align-items: center;
      word-break: break-word;
      color: var(--colors-fg-muted);
}

    .breadcrumb__ellipsis {
      display: inline-flex;
      align-items: center;
      justify-content: center;
}

    .breadcrumb__ellipsis :where(svg) {
      width: 1em;
      height: 1em;
}

    .breadcrumb__separator {
      color: var(--colors-fg-muted);
      opacity: 0.8;
}

    .breadcrumb__separator :where(svg) {
      width: 1em;
      height: 1em;
}

    :where([dir=rtl], :dir(rtl)) .breadcrumb__separator {
      rotate: 180deg;
}

    .tabs__root {
      --tabs-trigger-radius: var(--radii-l2);
      position: relative;
}

    .tabs__root[data-orientation=horizontal] {
      display: block;
}

    .tabs__root[data-orientation=vertical],.tabs__trigger {
      display: flex;
}

    .tabs__trigger {
      outline: 0;
      gap: var(--spacing-2);
      align-items: center;
      font-weight: var(--font-weights-medium);
      position: relative;
      cursor: var(--cursor-button);
      min-width: var(--tabs-height);
      height: var(--tabs-height);
}

    .tabs__trigger:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
      cursor: not-allowed;
      opacity: 0.5;
}

    .tabs__trigger:is(:focus-visible, [data-focus-visible]) {
      outline: 2px solid;
      z-index: 1;
      outline-color: var(--colors-color-palette-focus-ring);
}

    .tabs__list {
      --tabs-indicator-shadow: var(--shadows-xs);
      --tabs-indicator-bg: var(--colors-bg);
      display: inline-flex;
      position: relative;
      isolation: isolate;
      min-height: var(--tabs-height);
}

    .tabs__list[data-orientation=horizontal] {
      flex-direction: row;
}

    .tabs__list[data-orientation=vertical] {
      flex-direction: column;
}

    .tabs__content {
      --focus-ring-color: undefined;
}

    .tabs__content:is(:focus-visible, [data-focus-visible]) {
      outline-offset: 0px;
      outline-width: var(--focus-ring-width, 1px);
      outline-color: var(--focus-ring-color);
      outline-style: var(--focus-ring-style, solid);
      border-color: var(--focus-ring-color);
}

    .tabs__content[data-orientation=vertical] {
      padding-inline-start: var(--tabs-content-padding);
      height: 100%;
}

    .tabs__content[data-orientation=horizontal] {
      width: 100%;
      padding-top: var(--tabs-content-padding);
}

    .tabs__indicator {
      background: var(--tabs-indicator-bg);
      border-radius: var(--tabs-indicator-radius);
      box-shadow: var(--tabs-indicator-shadow);
      z-index: -1;
      width: var(--width);
      height: var(--height);
}

    .drawer__backdrop {
      background: var(--colors-black-alpha-500);
      position: fixed;
      inset-inline-start: 0;
      z-index: var(--z-index-overlay);
      top: 0;
      width: 100vw;
      height: 100dvh;
}

    .drawer__backdrop:is([open], [data-open], [data-state="open"], :popover-open) {
      animation-name: fade-in;
      animation-duration: var(--durations-slow);
}

    .drawer__backdrop:is([closed], [data-closed], [data-state="closed"]) {
      animation-name: fade-out;
      animation-duration: var(--durations-moderate);
}

    .drawer__positioner {
      position: fixed;
      inset-inline-start: 0;
      width: 100vw;
      height: 100dvh;
      top: 0;
      overscroll-behavior-y: none;
}

    .drawer__positioner,.drawer__content {
      display: flex;
      z-index: var(--z-index-modal);
}

    .drawer__content {
      background: var(--colors-bg-panel);
      outline: 0;
      flex-direction: column;
      position: relative;
      font-size: var(--font-sizes-sm);
      line-height: 1.25rem;
      color: inherit;
      box-shadow: var(--shadows-lg);
      width: 100%;
      max-height: 100dvh;
}

    .drawer__content:is([open], [data-open], [data-state="open"], :popover-open) {
      animation-duration: var(--durations-slowest);
      animation-timing-function: var(--easings-ease-in-smooth);
}

    .drawer__content:is([closed], [data-closed], [data-state="closed"]) {
      animation-duration: var(--durations-slower);
      animation-timing-function: var(--easings-ease-in-smooth);
}

    .drawer__title {
      flex: 1 1 0%;
      font-size: var(--font-sizes-lg);
      line-height: 1.75rem;
      font-weight: var(--font-weights-semibold);
}

    .drawer__description {
      color: var(--colors-fg-muted);
}

    .drawer__closeTrigger {
      position: absolute;
      inset-inline-end: var(--spacing-2);
      top: var(--spacing-3);
}

    .drawer__header {
      gap: var(--spacing-2);
      flex: 0;
      display: flex;
      align-items: center;
      padding-top: var(--spacing-6);
      padding-bottom: var(--spacing-4);
}

    .drawer__header,.drawer__body {
      padding-inline: var(--spacing-6);
}

    .drawer__body {
      padding-block: var(--spacing-2);
      flex: 1 1 0%;
      overflow: auto;
}

    .drawer__footer {
      gap: var(--spacing-3);
      padding-inline: var(--spacing-6);
      display: flex;
      align-items: center;
      justify-content: flex-end;
      padding-top: var(--spacing-2);
      padding-bottom: var(--spacing-4);
}

    .avatar__root {
      border-radius: var(--avatar-radius);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-weight: var(--font-weights-medium);
      position: relative;
      vertical-align: top;
      flex-shrink: 0;
      -webkit-user-select: none;
      user-select: none;
      font-size: var(--avatar-font-size);
      width: var(--avatar-size);
      height: var(--avatar-size);
}

    .avatar__root[data-group-item] {
      border-width: 2px;
      border-color: var(--colors-bg);
}

    .avatar__image {
      object-fit: cover;
      width: 100%;
      height: 100%;
}

    .avatar__image,.avatar__fallback {
      border-radius: var(--avatar-radius);
}

    .avatar__fallback {
      line-height: 1;
      text-transform: uppercase;
      font-weight: var(--font-weights-medium);
      font-size: var(--avatar-font-size);
}

    .tag__root {
      border-radius: var(--radii-l2);
      display: inline-flex;
      align-items: center;
      vertical-align: top;
      -webkit-user-select: none;
      user-select: none;
      --focus-ring-color: undefined;
}

    .tag__root:is(:focus-visible, [data-focus-visible]) {
      outline-width: var(--focus-ring-width, 2px);
      outline-offset: 2px;
      outline-style: var(--focus-ring-style, solid);
      outline-color: var(--focus-ring-color);
}

    .tag__root {
      max-width: 100%;
}

    .tag__label {
      overflow: hidden;
      display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
}

    .tag__closeTrigger {
      outline: 0;
      border-radius: var(--radii-l1);
      display: flex;
      align-items: center;
      justify-content: center;
      color: currentColor;
      --focus-ring-color: undefined;
}

    .tag__closeTrigger:is(:focus-visible, [data-focus-visible]) {
      outline-offset: 0px;
      outline-width: var(--focus-ring-width, 1px);
      outline-color: var(--focus-ring-color);
      outline-style: var(--focus-ring-style, solid);
      border-color: var(--focus-ring-color);
}

    .tag__closeTrigger {
      --focus-ring-width: 2px;
}

    .tag__startElement {
      flex-shrink: 0;
      width: var(--tag-element-size);
      height: var(--tag-element-size);
      margin-inline-start: var(--tag-element-offset);
}

    .tag__startElement:has([data-scope=avatar]) {
      width: var(--tag-avatar-size);
      height: var(--tag-avatar-size);
      margin-inline-start: calc(var(--tag-element-offset) * 1.5);
}

    .tag__startElement :where(svg) {
      width: 100%;
      height: 100%;
}

    .tag__endElement {
      flex-shrink: 0;
      width: var(--tag-element-size);
      height: var(--tag-element-size);
      margin-inline-end: var(--tag-element-offset);
}

    .tag__endElement :where(svg) {
      width: 100%;
      height: 100%;
}

    .tag__endElement:has(button) {
      margin-inline-start: calc(var(--tag-element-offset) * -1);
}

    .table__root {
      font-variant-numeric: lining-nums tabular-nums;
      border-collapse: collapse;
      text-align: start;
      vertical-align: top;
      width: var(--sizes-full);
}

    .table__row:is([aria-selected=true], [data-selected]) {
      background: var(--colors-color-palette-subtle);
}

    .table__columnHeader {
      font-weight: var(--font-weights-medium);
      text-align: start;
      color: var(--colors-fg);
}

    .table__cell {
      text-align: start;
      align-items: center;
}

    .table__footer,.table__caption {
      font-weight: var(--font-weights-medium);
}

    .table__caption {
      font-size: var(--font-sizes-xs);
      line-height: 1rem;
}

    .combobox__root {
      gap: var(--spacing-1\.5);
      display: flex;
      flex-direction: column;
      width: var(--sizes-full);
}

    .combobox__clearTrigger {
      border-radius: var(--radii-l1);
      color: var(--colors-fg-muted);
      pointer-events: auto;
      --focus-ring-color: undefined;
}

    .combobox__clearTrigger:is(:focus-visible, [data-focus-visible]) {
      outline-offset: 0px;
      outline-width: var(--focus-ring-width, 1px);
      outline-color: var(--focus-ring-color);
      outline-style: var(--focus-ring-style, solid);
      border-color: var(--focus-ring-color);
}

    .combobox__clearTrigger {
      --focus-ring-width: 2px;
}

    .combobox__content {
      background: var(--colors-bg-panel);
      border-radius: var(--radii-l2);
      outline: 0;
      display: flex;
      flex-direction: column;
      z-index: var(--z-index-dropdown);
      box-shadow: var(--shadows-md);
      max-height: var(--sizes-96);
      overflow-y: auto;
}

    .combobox__content:is([open], [data-open], [data-state="open"], :popover-open) {
      transform-origin: var(--transform-origin);
}

    .combobox__content:is([open], [data-open], [data-state="open"], :popover-open)[data-placement^=top] {
      animation-name: slide-from-bottom, fade-in;
}

    .combobox__content:is([open], [data-open], [data-state="open"], :popover-open)[data-placement^=bottom] {
      animation-name: slide-from-top, fade-in;
}

    .combobox__content:is([open], [data-open], [data-state="open"], :popover-open)[data-placement^=left] {
      animation-name: slide-from-right, fade-in;
}

    .combobox__content:is([open], [data-open], [data-state="open"], :popover-open)[data-placement^=right] {
      animation-name: slide-from-left, fade-in;
}

    .combobox__content:is([open], [data-open], [data-state="open"], :popover-open) {
      animation-duration: var(--durations-fast);
}

    .combobox__content:is([closed], [data-closed], [data-state="closed"]) {
      transform-origin: var(--transform-origin);
}

    .combobox__content:is([closed], [data-closed], [data-state="closed"])[data-placement^=top] {
      animation-name: slide-to-bottom, fade-out;
}

    .combobox__content:is([closed], [data-closed], [data-state="closed"])[data-placement^=bottom] {
      animation-name: slide-to-top, fade-out;
}

    .combobox__content:is([closed], [data-closed], [data-state="closed"])[data-placement^=left] {
      animation-name: slide-to-right, fade-out;
}

    .combobox__content:is([closed], [data-closed], [data-state="closed"])[data-placement^=right] {
      animation-name: slide-to-left, fade-out;
}

    .combobox__content:is([closed], [data-closed], [data-state="closed"]) {
      animation-duration: 0s;
}

    .combobox__content[data-empty]:not(:has([data-scope=combobox][data-part=empty])) {
      opacity: 0;
}

    .combobox__control {
      position: relative;
}

    .combobox__input {
      --input-height: var(--combobox-input-height);
      --focus-color: var(--colors-color-palette-focus-ring);
      --error-color: var(--colors-border-error);
      background: var(--colors-bg-panel);
      padding-inline: var(--combobox-input-padding-x);
      border-radius: var(--radii-l2);
      outline: 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      -webkit-user-select: none;
      user-select: none;
      text-align: start;
      width: var(--sizes-full);
      min-height: var(--combobox-input-height);
}

    .combobox__input:is(:invalid, [data-invalid], [aria-invalid=true]) {
      border-color: var(--error-color);
      --focus-ring-color: var(--error-color);
}

    .combobox__input:is(:placeholder-shown, [data-placeholder-shown]) {
      color: var(--colors-fg-muted);
}

    .combobox__input:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
      opacity: 0.5;
      cursor: not-allowed;
}

    .combobox__item {
      gap: var(--spacing-2);
      padding-block: var(--combobox-item-padding-y);
      padding-inline: var(--combobox-item-padding-x);
      flex: 1 1 0%;
      border-radius: var(--radii-l1);
      position: relative;
      -webkit-user-select: none;
      user-select: none;
      display: flex;
      align-items: center;
      cursor: var(--cursor-option);
      justify-content: space-between;
      text-align: start;
}

    .combobox__item[data-highlighted] {
      --mix-background: color-mix(in srgb, var(--colors-bg-emphasized) 60%, transparent);
      background: var(--mix-background, var(--colors-bg-emphasized));
}

    .combobox__item:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
      pointer-events: none;
      opacity: 0.5;
}

    .combobox__item :where(svg) {
      width: var(--combobox-indicator-size);
      height: var(--combobox-indicator-size);
}

    .combobox__itemGroup {
      padding-bottom: var(--combobox-item-padding-y);
}

    .combobox__itemGroup:last-child {
      padding-bottom: 0;
}

    .combobox__itemGroupLabel {
      padding-block: var(--combobox-item-padding-y);
      padding-inline: var(--combobox-item-padding-x);
      font-weight: var(--font-weights-medium);
}

    .combobox__itemText {
      flex: 1 1 0%;
}

    .combobox__label {
      font-weight: var(--font-weights-medium);
      -webkit-user-select: none;
      user-select: none;
      font-size: var(--font-sizes-sm);
      line-height: 1.25rem;
}

    .combobox__label:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
      opacity: 0.5;
      cursor: not-allowed;
}

    .combobox__trigger {
      --input-height: var(--combobox-input-height);
      display: inline-flex;
}

    .combobox__trigger,.combobox__indicatorGroup {
      align-items: center;
      justify-content: center;
}

    .combobox__indicatorGroup {
      gap: var(--spacing-1);
      padding-inline: var(--combobox-input-padding-x);
      display: flex;
      position: absolute;
      inset-inline-end: 0;
      top: 0;
      bottom: 0;
}

    .combobox__indicatorGroup :where(svg) {
      width: var(--combobox-indicator-size);
      height: var(--combobox-indicator-size);
}

    [data-disabled] .combobox__indicatorGroup {
      opacity: 0.5;
}

    .combobox__empty {
      padding-block: var(--combobox-item-padding-y);
      padding-inline: var(--combobox-item-padding-x);
}

    .popover__arrowTip {
      border-inline-start-width: 1px;
      border-top-width: 1px;
}

    .popover__content {
      --popover-bg: var(--colors-bg-panel);
      --popover-size: var(--sizes-xs);
      --popover-mobile-size: calc(100dvw - 1rem);
      --popover-z-index: var(--z-index-popover);
      background: var(--popover-bg);
      border-radius: var(--radii-l3);
      outline: 0;
      position: relative;
      display: flex;
      flex-direction: column;
      font-size: var(--font-sizes-sm);
      line-height: 1.25rem;
      box-shadow: var(--shadows-lg);
      z-index: calc(var(--popover-z-index) + var(--layer-index, 0));
      transform-origin: var(--transform-origin);
      width: min(var(--popover-mobile-size), var(--popover-size));
      max-height: var(--available-height);
}

    .popover__content:is([open], [data-open], [data-state="open"], :popover-open) {
      transform-origin: var(--transform-origin);
      animation-name: scale-in, fade-in;
      animation-duration: var(--durations-fast);
}

    .popover__content:is([closed], [data-closed], [data-state="closed"]) {
      transform-origin: var(--transform-origin);
      animation-name: scale-out, fade-out;
      animation-duration: var(--durations-faster);
}

    .popover__header {
      padding-inline: var(--popover-padding);
      padding-top: var(--popover-padding);
}

    .popover__body {
      padding: var(--popover-padding);
      flex: 1 1 0%;
}

    .popover__footer {
      padding-inline: var(--popover-padding);
      display: flex;
      align-items: center;
      padding-bottom: var(--popover-padding);
}

    @media screen and (min-width: 30rem) {
      .popover__content {
        width: var(--popover-size);
}
}
}

  .card__root--variant_outline {
    background: var(--colors-bg-panel);
    border-width: 1px;
    border-color: var(--colors-border);
}

  .card__root--size_md {
    --card-padding: var(--spacing-6);
}

  .card__title--size_md {
    font-size: var(--font-sizes-lg);
    line-height: 1.75rem;
}

  .card__root--variant_elevated {
    background: var(--colors-bg-panel);
    box-shadow: var(--shadows-md);
}

  .card__root--size_sm {
    --card-padding: var(--spacing-4);
}

  .card__title--size_sm {
    font-size: var(--font-sizes-md);
    line-height: 1.5rem;
}

  .empty-state__root--size_md {
    padding-inline: var(--spacing-8);
    padding-block: var(--spacing-12);
}

  .empty-state__content--size_md {
    gap: var(--spacing-6);
}

  .empty-state__indicator--size_md {
    font-size: var(--font-sizes-4xl);
    line-height: 2.75rem;
    letter-spacing: -0.025em;
}

  .empty-state__title--size_md {
    font-size: var(--font-sizes-lg);
    line-height: 1.75rem;
}

  .field__root--orientation_vertical {
    flex-direction: column;
    align-items: flex-start;
}

  .field__root--orientation_horizontal {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

  .field__label--orientation_horizontal {
    flex: 0 0 var(--field-label-width, 80px);
}

  .alert__root--status_error {
    --colors-color-palette-500: var(--colors-red-500);
    --colors-color-palette-contrast: var(--colors-red-contrast);
    --colors-color-palette-fg: var(--colors-red-fg);
    --colors-color-palette-subtle: var(--colors-red-subtle);
    --colors-color-palette-muted: var(--colors-red-muted);
    --colors-color-palette-emphasized: var(--colors-red-emphasized);
    --colors-color-palette-solid: var(--colors-red-solid);
    --colors-color-palette-focus-ring: var(--colors-red-focus-ring);
}

  .alert__root--variant_subtle {
    background: var(--colors-color-palette-subtle);
    color: var(--colors-color-palette-fg);
}

  .alert__root--size_md {
    gap: var(--spacing-3);
    padding-inline: var(--spacing-4);
    padding-block: var(--spacing-4);
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
}

  .alert__indicator--size_md {
    font-size: var(--font-sizes-xl);
    line-height: 1.875rem;
}

  .alert__content--inline_false {
    display: flex;
    flex-direction: column;
}

  .alert__root--status_success {
    --colors-color-palette-500: var(--colors-green-500);
    --colors-color-palette-contrast: var(--colors-green-contrast);
    --colors-color-palette-fg: var(--colors-green-fg);
    --colors-color-palette-subtle: var(--colors-green-subtle);
    --colors-color-palette-muted: var(--colors-green-muted);
    --colors-color-palette-emphasized: var(--colors-green-emphasized);
    --colors-color-palette-solid: var(--colors-green-solid);
    --colors-color-palette-focus-ring: var(--colors-green-focus-ring);
}

  .checkbox__control--variant_solid {
    border-color: var(--colors-border);
}

  .checkbox__control--variant_solid:is([data-state=checked], [data-state=indeterminate]) {
    background: var(--colors-color-palette-solid);
    border-color: var(--colors-color-palette-solid);
    color: var(--colors-color-palette-contrast);
}

  .checkbox__root--size_md {
    gap: var(--spacing-2\.5);
}

  .checkbox__label--size_md {
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
}

  .checkbox__control--size_md {
    padding: var(--spacing-0\.5);
    width: var(--sizes-5);
    height: var(--sizes-5);
}

  .accordion__root--size_md {
    --accordion-padding-y: var(--spacing-2);
}

  .accordion__itemTrigger--size_md {
    padding-block: var(--accordion-padding-y);
    font-size: var(--font-sizes-md);
    line-height: 1.5rem;
}

  .accordion__item--variant_outline {
    border-bottom-width: 1px;
}

  .breadcrumb__link--variant_plain {
    color: var(--colors-fg-muted);
}

  .breadcrumb__link--variant_plain:is(:hover, [data-hover]) {
    color: var(--colors-fg);
}

  .breadcrumb__currentLink--variant_plain {
    color: var(--colors-fg);
}

  .breadcrumb__list--size_md {
    gap: var(--spacing-1\.5);
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
}

  .tabs__root--size_md {
    --tabs-height: var(--sizes-10);
    --tabs-content-padding: var(--spacing-4);
}

  .tabs__trigger--size_md {
    padding-block: var(--spacing-2);
    padding-inline: var(--spacing-4);
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
}

  .tabs__trigger--variant_plain {
    border-radius: var(--tabs-trigger-radius);
    color: var(--colors-fg-muted);
}

  .tabs__trigger--variant_plain[data-selected][data-ssr] {
    background: var(--tabs-indicator-bg);
    border-radius: var(--tabs-indicator-radius);
    box-shadow: var(--tabs-indicator-shadow);
}

  .tabs__trigger--variant_plain:is([aria-selected=true], [data-selected]) {
    color: var(--colors-color-palette-fg);
}

  .tabs__trigger--variant_line {
    color: var(--colors-fg-muted);
}

  .tabs__trigger--variant_line:is([aria-selected=true], [data-selected]) {
    color: var(--colors-fg);
}

  .tabs__trigger--variant_line:is([aria-selected=true], [data-selected])[data-orientation=horizontal] {
    --indicator-offset-y: -1px;
    --indicator-color: var(--colors-color-palette-solid);
    --indicator-color-fallback: var(--colors-color-palette-solid);
    position: relative;
}

  .tabs__trigger--variant_line:is([aria-selected=true], [data-selected])[data-orientation=horizontal]::before {
    background: var(--indicator-color, var(--indicator-color-fallback));
    inset-inline: var(--indicator-offset-x, 0);
    content: "";
    position: absolute;
    bottom: var(--indicator-offset-y, 0);
    height: var(--indicator-thickness, 2px);
}

  .tabs__trigger--variant_line:is([aria-selected=true], [data-selected])[data-orientation=vertical] {
    --indicator-offset-x: -1px;
    --indicator-color-fallback: var(--colors-color-palette-solid);
    position: relative;
}

  .tabs__trigger--variant_line:is([aria-selected=true], [data-selected])[data-orientation=vertical]::before {
    background: var(--indicator-color, var(--indicator-color-fallback));
    inset-block: var(--indicator-offset-y, 0);
    content: "";
    position: absolute;
    inset-inline-end: var(--indicator-offset-x, 0);
    width: var(--indicator-thickness, 2px);
}

  .tabs__trigger--variant_line:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]):is(:active, [data-active]) {
    background: initial;
}

  .tabs__list--variant_line {
    border-color: var(--colors-border);
    display: flex;
}

  .tabs__list--variant_line[data-orientation=vertical] {
    border-inline-end-width: 1px;
}

  .tabs__list--variant_line[data-orientation=horizontal] {
    border-bottom-width: 1px;
}

  .tabs__trigger--variant_enclosed {
    border-radius: var(--tabs-trigger-radius);
    justify-content: center;
    color: var(--colors-fg-muted);
}

  .tabs__trigger--variant_enclosed:is([aria-selected=true], [data-selected]) {
    background: var(--colors-bg);
    color: var(--colors-color-palette-fg);
    box-shadow: var(--shadows-xs);
}

  .tabs__list--variant_enclosed {
    background: var(--colors-bg-muted);
    padding: var(--spacing-1);
    border-radius: var(--radii-l3);
    min-height: calc(var(--tabs-height) - 4px);
}

  .drawer__content--size_xs {
    max-width: var(--sizes-xs);
}

  .drawer__positioner--placement_end {
    justify-content: flex-end;
    align-items: stretch;
}

  .drawer__content--placement_end:is([open], [data-open], [data-state="open"], :popover-open) {
    animation-name: slide-from-right-full, fade-in;
}

  :where([dir=rtl], :dir(rtl)) .drawer__content--placement_end:is([open], [data-open], [data-state="open"], :popover-open) {
    animation-name: slide-from-left-full, fade-in;
}

  .drawer__content--placement_end:is([closed], [data-closed], [data-state="closed"]) {
    animation-name: slide-to-right-full, fade-out;
}

  :where([dir=rtl], :dir(rtl)) .drawer__content--placement_end:is([closed], [data-closed], [data-state="closed"]) {
    animation-name: slide-to-left-full, fade-out;
}

  .avatar__root--size_sm {
    --avatar-font-size: var(--font-sizes-sm);
    --avatar-size: var(--sizes-9);
}

  .avatar__root--shape_rounded {
    --avatar-radius: var(--radii-l3);
}

  .avatar__root--variant_subtle {
    background: var(--colors-color-palette-muted);
    color: var(--colors-color-palette-fg);
}

  .avatar__root--size_2xl {
    --avatar-font-size: var(--font-sizes-xl);
    --avatar-size: var(--sizes-16);
}

  .avatar__root--shape_full {
    --avatar-radius: var(--radii-full);
}

  .avatar__root--size_md {
    --avatar-font-size: var(--font-sizes-md);
    --avatar-size: var(--sizes-10);
}

  .tag__root--size_md {
    --tag-avatar-size: var(--spacing-3\.5);
    --tag-element-size: var(--spacing-3\.5);
    --tag-element-offset: -2px;
    padding-inline: var(--spacing-1\.5);
    gap: var(--spacing-1);
    min-height: var(--sizes-5);
}

  .tag__label--size_md {
    font-size: var(--font-sizes-xs);
    line-height: 1rem;
}

  .tag__root--variant_surface {
    background: var(--colors-color-palette-subtle);
    color: var(--colors-color-palette-fg);
    box-shadow: inset 0 0 0px 1px var(--shadow-color);
    --shadow-color: var(--colors-color-palette-muted);
}

  .tag__root--size_sm {
    --tag-avatar-size: var(--spacing-3);
    --tag-element-size: var(--spacing-3);
    --tag-element-offset: -2px;
    padding-inline: var(--spacing-1\.5);
    gap: var(--spacing-1);
    min-height: var(--sizes-4\.5);
}

  .tag__label--size_sm {
    font-size: var(--font-sizes-xs);
    line-height: 1rem;
}

  .tag__root--variant_subtle {
    background: var(--colors-color-palette-subtle);
    color: var(--colors-color-palette-fg);
}

  .tag__root--variant_outline {
    color: var(--colors-color-palette-fg);
    box-shadow: inset 0 0 0px 1px var(--shadow-color);
    --shadow-color: var(--colors-color-palette-muted);
}

  .table__row--variant_line {
    background: var(--colors-bg);
}

  .table__columnHeader--variant_line,.table__cell--variant_line {
    border-bottom-width: 1px;
}

  .table__root--size_sm {
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
}

  .table__columnHeader--size_sm,.table__cell--size_sm {
    padding-inline: var(--spacing-2);
    padding-block: var(--spacing-2);
}

  .table__root--size_md {
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
}

  .table__columnHeader--size_md,.table__cell--size_md {
    padding-inline: var(--spacing-3);
    padding-block: var(--spacing-3);
}

  .table__header--stickyHeader_true :where(tr) {
    position: sticky;
    z-index: 1;
    top: var(--table-sticky-offset, 0);
}

  .combobox__root--size_md {
    --combobox-input-height: var(--sizes-10);
    --combobox-input-padding-x: var(--spacing-3);
    --combobox-indicator-size: var(--sizes-4);
}

  .combobox__content--size_md {
    --combobox-item-padding-x: var(--spacing-2);
    --combobox-item-padding-y: var(--spacing-1\.5);
    --combobox-indicator-size: var(--sizes-4);
    padding: var(--spacing-1);
}

  .combobox__content--size_md,.combobox__input--size_md {
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
}

  .combobox__itemIndicator--size_md {
    display: flex;
    align-items: center;
    justify-content: center;
}

  .combobox__trigger--size_md {
    gap: var(--spacing-2);
    font-size: var(--font-sizes-sm);
    line-height: 1.25rem;
}

  .combobox__input--variant_outline {
    background: var(--colors-transparent);
    border-width: 1px;
    border-color: var(--colors-border);
    --focus-ring-color: undefined;
}

  .combobox__input--variant_outline:is(:focus-visible, [data-focus-visible]) {
    outline-offset: 0px;
    outline-width: var(--focus-ring-width, 1px);
    outline-color: var(--focus-ring-color);
    outline-style: var(--focus-ring-style, solid);
    border-color: var(--focus-ring-color);
}

  .popover__content--size_md {
    --popover-padding: var(--spacing-5);
}
}

@layer utilities{
  @layer compositions{

    .textStyle_lg {
      font-size: var(--font-sizes-lg);
      line-height: 1.75rem;
}

    .textStyle_sm {
      font-size: var(--font-sizes-sm);
      line-height: 1.25rem;
}

    .textStyle_xs {
      font-size: var(--font-sizes-xs);
      line-height: 1rem;
}

    .textStyle_xl {
      font-size: var(--font-sizes-xl);
      line-height: 1.875rem;
}

    .layerStyle_fill\.subtle {
      background: var(--colors-color-palette-subtle);
      color: var(--colors-color-palette-fg);
}

    .textStyle_2xl {
      font-size: var(--font-sizes-2xl);
      line-height: 2rem;
}

    .selected\:layerStyle_fill\.solid:is([aria-selected=true], [data-selected]) {
      background: var(--colors-color-palette-solid);
      color: var(--colors-color-palette-contrast);
}
}

  .m_auto {
    margin: auto;
}

  .p_6 {
    padding: var(--spacing-6);
}

  .p_4 {
    padding: var(--spacing-4);
}

  .bg_bg\.subtle {
    background: var(--colors-bg-subtle);
}

  .bg_bg\.muted {
    background: var(--colors-bg-muted);
}

  .p_1 {
    padding: var(--spacing-1);
}

  .bg_bg {
    background: var(--colors-bg);
}

  .p_3 {
    padding: var(--spacing-3);
}

  .p_32 {
    padding: var(--spacing-32);
}

  .bg_border\.subtle {
    background: var(--colors-border-subtle);
}

  .bg_orange\.50 {
    background: var(--colors-orange-50);
}

  .bd_1px_solid {
    border: 1px solid;
}

  .p_2 {
    padding: var(--spacing-2);
}

  .bg_bg\.default {
    background: bg.default;
}

  .bd_xs {
    border: var(--borders-xs);
}

  .bg_green\.500 {
    background: var(--colors-green-500);
}

  .p_12px {
    padding: 12px;
}

  .p_0 {
    padding: 0;
}

  .bg_bg\.panel {
    background: var(--colors-bg-panel);
}

  .bg_blue\.50 {
    background: var(--colors-blue-50);
}

  .bg_red\.50 {
    background: var(--colors-red-50);
}

  .bg_green\.50 {
    background: var(--colors-green-50);
}

  .bd_2px_solid {
    border: 2px solid;
}

  .bg_purple\.50 {
    background: var(--colors-purple-50);
}

  .bg_gray\.50 {
    background: var(--colors-gray-50);
}

  .bg_red\.100 {
    background: var(--colors-red-100);
}

  .mx_auto {
    margin-inline: auto;
}

  .px_4 {
    padding-inline: var(--spacing-4);
}

  .gap_10px {
    gap: 10px;
}

  .gap_1 {
    gap: var(--spacing-1);
}

  .my_auto {
    margin-block: auto;
}

  .gap_3 {
    gap: var(--spacing-3);
}

  .ov_auto {
    overflow: auto;
}

  .gap_2 {
    gap: var(--spacing-2);
}

  .ov_hidden {
    overflow: hidden;
}

  .flex_1 {
    flex: 1 1 0%;
}

  .bdr_md {
    border-radius: var(--radii-md);
}

  .gap_4 {
    gap: var(--spacing-4);
}

  .gap_6 {
    gap: var(--spacing-6);
}

  .gap_5 {
    gap: var(--spacing-5);
}

  .bdr_full {
    border-radius: var(--radii-full);
}

  .bd-r_1px_solid {
    border-right: 1px solid;
}

  .bd-c_border {
    border-color: var(--colors-border);
}

  .px_1 {
    padding-inline: var(--spacing-1);
}

  .py_4 {
    padding-block: var(--spacing-4);
}

  .px_2 {
    padding-inline: var(--spacing-2);
}

  .trs_linear {
    transition: linear;
}

  .bd-l_1px_solid_gray {
    border-left: 1px solid gray;
}

  .bd-c_gray\.200 {
    border-color: var(--colors-gray-200);
}

  .py_0 {
    padding-block: 0;
}

  .trs_opacity {
    transition-property: var(--transition-prop, opacity);
    transition-timing-function: var(--transition-easing, cubic-bezier(0.4, 0, 0.2, 1));
    transition-duration: var(--transition-duration, 150ms);
}

  .td_underline {
    text-decoration: underline;
}

  .bdr_l3 {
    border-radius: var(--radii-l3);
}

  .bdr_l2 {
    border-radius: var(--radii-l2);
}

  .bdr_xl {
    border-radius: var(--radii-xl);
}

  .gap_8 {
    gap: var(--spacing-8);
}

  .trs_all_0\.3s_ease {
    transition: all 0.3s ease;
}

  .py_8 {
    padding-block: var(--spacing-8);
}

  .bdr_lg {
    border-radius: var(--radii-lg);
}

  .my_2 {
    margin-block: var(--spacing-2);
}

  .bd-c_orange\.200 {
    border-color: var(--colors-orange-200);
}

  .bd-c_border\.muted {
    border-color: var(--colors-border-muted);
}

  .py_6 {
    padding-block: var(--spacing-6);
}

  .gap_0 {
    gap: 0;
}

  .bd-c_border\.error {
    border-color: var(--colors-border-error);
}

  .offset_4 {
    offset: 4px;
}

  .gap_1\.5 {
    gap: var(--spacing-1\.5);
}

  .px_8 {
    padding-inline: var(--spacing-8);
}

  .px_0 {
    padding-inline: 0;
}

  .flex_0_0_auto {
    flex: 0 0 auto;
}

  .bdr_9999px {
    border-radius: 9999px;
}

  .ring_0\.2em_solid {
    outline: 0.2em solid;
}

  .py_2 {
    padding-block: var(--spacing-2);
}

  .px_3 {
    padding-inline: var(--spacing-3);
}

  .bdr_inherit {
    border-radius: inherit;
}

  .ov_hidden_auto {
    overflow: hidden auto;
}

  .bdr_sm {
    border-radius: var(--radii-sm);
}

  .my_4 {
    margin-block: var(--spacing-4);
}

  .bd-b_none {
    border-bottom: none;
}

  .bd-c_blue\.200 {
    border-color: var(--colors-blue-200);
}

  .bd-c_blue\.100 {
    border-color: var(--colors-blue-100);
}

  .li-s_disc {
    list-style: disc;
}

  .bd-c_red\.200 {
    border-color: var(--colors-red-200);
}

  .bd-c_green\.200 {
    border-color: var(--colors-green-200);
}

  .trs_all_0\.2s {
    transition: all 0.2s;
}

  .bd-c_purple\.200 {
    border-color: var(--colors-purple-200);
}

  .bd-c_purple\.100 {
    border-color: var(--colors-purple-100);
}

  .py_12 {
    padding-block: var(--spacing-12);
}

  .py_1 {
    padding-block: var(--spacing-1);
}

  .px_6 {
    padding-inline: var(--spacing-6);
}

  .py_3 {
    padding-block: var(--spacing-3);
}

  .bd-w_1 {
    border-width: 1px;
}

  .trs_colors {
    transition-property: var(--transition-prop, color, background-color, border-color, outline-color, text-decoration-color, fill, stroke);
    transition-timing-function: var(--transition-easing, cubic-bezier(0.4, 0, 0.2, 1));
    transition-duration: var(--transition-duration, 150ms);
}

  .pos_relative {
    position: relative;
}

  .d_flex {
    display: flex;
}

  .ai_center {
    align-items: center;
}

  .jc_center {
    justify-content: center;
}

  .flex-d_column {
    flex-direction: column;
}

  .ta_center {
    text-align: center;
}

  .flex-sh_0 {
    flex-shrink: 0;
}

  .flex-d_row {
    flex-direction: row;
}

  .c_blue\.solid {
    color: var(--colors-blue-solid);
}

  .pos_absolute {
    position: absolute;
}

  .op_0 {
    opacity: 0;
}

  .d_inline-flex {
    display: inline-flex;
}

  .size_1em {
    width: 1em;
    height: 1em;
}

  .c_currentColor {
    color: currentColor;
}

  .fs_sm {
    font-size: var(--font-sizes-sm);
}

  .c_fg\.subtle {
    color: var(--colors-fg-subtle);
}

  .color-palette_blue {
    --colors-color-palette-500: var(--colors-blue-500);
    --colors-color-palette-contrast: var(--colors-blue-contrast);
    --colors-color-palette-fg: var(--colors-blue-fg);
    --colors-color-palette-subtle: var(--colors-blue-subtle);
    --colors-color-palette-muted: var(--colors-blue-muted);
    --colors-color-palette-emphasized: var(--colors-blue-emphasized);
    --colors-color-palette-solid: var(--colors-blue-solid);
    --colors-color-palette-focus-ring: var(--colors-blue-focus-ring);
}

  .white-space_nowrap {
    white-space: nowrap;
}

  .c_fg\.muted {
    color: var(--colors-fg-muted);
}

  .color-scheme_blue {
    color-scheme: blue;
}

  .fs_2xl {
    font-size: var(--font-sizes-2xl);
}

  .fw_bold {
    font-weight: var(--font-weights-bold);
}

  .content_Could_not_connect_to_backend\,_click_to_retry {
    content: Could not connect to backend, click to retry;
}

  .color-palette_red {
    --colors-color-palette-500: var(--colors-red-500);
    --colors-color-palette-contrast: var(--colors-red-contrast);
    --colors-color-palette-fg: var(--colors-red-fg);
    --colors-color-palette-subtle: var(--colors-red-subtle);
    --colors-color-palette-muted: var(--colors-red-muted);
    --colors-color-palette-emphasized: var(--colors-red-emphasized);
    --colors-color-palette-solid: var(--colors-red-solid);
    --colors-color-palette-focus-ring: var(--colors-red-focus-ring);
}

  .content_Collapse_sidebar {
    content: Collapse sidebar;
}

  .content_Expand_sidebar {
    content: Expand sidebar;
}

  .c_red {
    color: red;
}

  .c_\#fe2858 {
    color: #fe2858;
}

  .trs-prop_left\,_right\,_width {
    --transition-prop: left, right, width;
    transition-property: left, right, width;
}

  .trs-dur_0\.15s {
    --transition-duration: 0.15s;
    transition-duration: 0.15s;
}

  .trs-tmf_linear {
    --transition-easing: linear;
    transition-timing-function: linear;
}

  .anim-dur_0\.2s {
    animation-duration: 0.2s;
}

  .anim-tmf_linear {
    animation-timing-function: linear;
}

  .z_docked {
    z-index: var(--z-index-docked);
}

  .cursor_w-resize {
    cursor: w-resize;
}

  .cursor_e-resize {
    cursor: e-resize;
}

  .focus-ring_none {
    --focus-ring-color: undefined;
}

  .focus-ring_none:is(:focus, [data-focus]) {
    outline: none;
}

  .trf_translateX\(50\%\) {
    transform: translateX(50%);
}

  .jc_flex-start {
    justify-content: flex-start;
}

  .fw_semibold {
    font-weight: var(--font-weights-semibold);
}

  .size_8 {
    width: var(--sizes-8);
    height: var(--sizes-8);
}

  .c_colorPalette\.500 {
    color: var(--colors-color-palette-500);
}

  .tu-o_3px {
    text-underline-offset: 3px;
}

  .td-c_currentColor\/20 {
    --mix-textDecorationColor: color-mix(in srgb, currentColor 20%, transparent);
    text-decoration-color: var(--mix-textDecorationColor, currentColor);
}

  .as_flex-start {
    align-self: flex-start;
}

  .lh_relaxed {
    line-height: relaxed;
}

  .box-align_center {
    box-align: center;
}

  .d_grid {
    display: grid;
}

  .grid-tc_repeat\(1\,_minmax\(0\,_1fr\)\) {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

  .c_\#FF0000 {
    color: #FF0000;
}

  .grid-tc_1fr {
    grid-template-columns: 1fr;
}

  .jc_space-between {
    justify-content: space-between;
}

  .c_blue\.500 {
    color: var(--colors-blue-500);
}

  .c_purple\.500 {
    color: var(--colors-purple-500);
}

  .c_orange\.500 {
    color: var(--colors-orange-500);
}

  .size_4 {
    width: var(--sizes-4);
    height: var(--sizes-4);
}

  .fw_medium {
    font-weight: var(--font-weights-medium);
}

  .c_orange\.900 {
    color: var(--colors-orange-900);
}

  .fs_xs {
    font-size: var(--font-sizes-xs);
}

  .c_orange\.800 {
    color: var(--colors-orange-800);
}

  .fs_lg {
    font-size: var(--font-sizes-lg);
}

  .c_gray\.600 {
    color: var(--colors-gray-600);
}

  .c_gray\.500 {
    color: var(--colors-gray-500);
}

  .flex-wrap_wrap {
    flex-wrap: wrap;
}

  .ai_start {
    align-items: start;
}

  .color-scheme_green {
    color-scheme: green;
}

  .color-scheme_red {
    color-scheme: red;
}

  .color-scheme_yellow {
    color-scheme: yellow;
}

  .c_green {
    color: green;
}

  .ta_right {
    text-align: right;
}

  .content_Copy_result_to_excel {
    content: Copy result to excel;
}

  .ai_flex-start {
    align-items: flex-start;
}

  .c_blue\.600 {
    color: var(--colors-blue-600);
}

  .c_red\.600 {
    color: var(--colors-red-600);
}

  .d_inline-block {
    display: inline-block;
}

  .fw_500 {
    font-weight: 500;
}

  .size_6 {
    width: var(--sizes-6);
    height: var(--sizes-6);
}

  .inset-bs_0 {
    inset-block-start: 0;
}

  .inset-be_auto {
    inset-block-end: auto;
}

  .inset-s_auto {
    inset-inline-start: auto;
}

  .inset-e_0 {
    inset-inline-end: 0;
}

  .translate_50\%_-50\% {
    translate: 50% -50%;
}

  .color-palette_green {
    --colors-color-palette-500: var(--colors-green-500);
    --colors-color-palette-contrast: var(--colors-green-contrast);
    --colors-color-palette-fg: var(--colors-green-fg);
    --colors-color-palette-subtle: var(--colors-green-subtle);
    --colors-color-palette-muted: var(--colors-green-muted);
    --colors-color-palette-emphasized: var(--colors-green-emphasized);
    --colors-color-palette-solid: var(--colors-green-solid);
    --colors-color-palette-focus-ring: var(--colors-green-focus-ring);
}

  .content_Ban {
    content: Ban;
}

  .content_Unban {
    content: Unban;
}

  .content_Send_password_reset {
    content: Send password reset;
}

  .content_Impersonate {
    content: Impersonate;
}

  .content_Stop_Impersonating {
    content: Stop Impersonating;
}

  .content_Copy_invitation_link {
    content: Copy invitation link;
}

  .c_blue {
    color: blue;
}

  .z_popover {
    z-index: var(--z-index-popover);
}

  .filter_subscriberCount {
    filter: subscriberCount;
}

  .filter_videoCount {
    filter: videoCount;
}

  .filter_viewCount {
    filter: viewCount;
}

  .filter_averageViewsByVideo {
    filter: averageViewsByVideo;
}

  .content_Configure_search {
    content: Configure search;
}

  .filter_q {
    filter: q;
}

  .cursor_pointer {
    cursor: pointer;
}

  .cursor_initial {
    cursor: initial;
}

  .as_center {
    align-self: center;
}

  .trunc_true {
    overflow: hidden;
    white-space: nowrap;
}

  .trunc_true,.tov_ellipsis {
    text-overflow: ellipsis;
}

  .inset-bs_auto {
    inset-block-start: auto;
}

  .inset-be_1 {
    inset-block-end: var(--spacing-1);
}

  .inset-e_1 {
    inset-inline-end: var(--spacing-1);
}

  .translate_50\%_50\% {
    translate: 50% 50%;
}

  .ring-c_bg {
    outline-color: var(--colors-bg);
}

  .ta_start {
    text-align: start;
}

  .op_0\.8 {
    opacity: 0.8;
}

  .d_none {
    display: none;
}

  .content_Remove_this_group {
    content: Remove this group;
}

  .content_Select_this_group {
    content: Select this group;
}

  .d_table {
    display: table;
}

  .me_-2 {
    margin-inline-end: calc(var(--spacing-2) * -1);
}

  .asp_square {
    aspect-ratio: var(--aspect-ratios-square);
}

  .ai_flex-end {
    align-items: flex-end;
}

  .color-palette_gray {
    --colors-color-palette-500: var(--colors-gray-500);
    --colors-color-palette-contrast: var(--colors-gray-contrast);
    --colors-color-palette-fg: var(--colors-gray-fg);
    --colors-color-palette-subtle: var(--colors-gray-subtle);
    --colors-color-palette-muted: var(--colors-gray-muted);
    --colors-color-palette-emphasized: var(--colors-gray-emphasized);
    --colors-color-palette-solid: var(--colors-gray-solid);
    --colors-color-palette-focus-ring: var(--colors-gray-focus-ring);
}

  .sx_-3 > :not([hidden]) ~ :not([hidden]) {
    margin-inline-start: calc(var(--spacing-3) * -1);
    margin-inline-end: 0px;
}

  .sr_true {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

  .d_block {
    display: block;
}

  .\-webkit-overflow-scrolling_touch {
    -webkit-overflow-scrolling: touch;
}

  .op_1 {
    opacity: 1;
}

  .op_0\.55 {
    opacity: 0.55;
}

  .jc_flex-end {
    justify-content: flex-end;
}

  .focus-v-ring_inside {
    --focus-ring-color: undefined;
}

  .focus-v-ring_inside:is(:focus-visible, [data-focus-visible]) {
    outline-offset: 0px;
    outline-width: var(--focus-ring-width, 1px);
    outline-color: var(--focus-ring-color);
    outline-style: var(--focus-ring-style, solid);
    border-color: var(--focus-ring-color);
}

  .focus-ring-w_2px {
    --focus-ring-width: 2px;
}

  .pointer-events_auto {
    pointer-events: auto;
}

  .ff_mono {
    font-family: var(--fonts-mono);
}

  .c_blue\.900 {
    color: var(--colors-blue-900);
}

  .c_blue\.800 {
    color: var(--colors-blue-800);
}

  .lh_1\.5 {
    line-height: 1.5;
}

  .c_red\.900 {
    color: var(--colors-red-900);
}

  .c_green\.900 {
    color: var(--colors-green-900);
}

  .c_red\.500 {
    color: var(--colors-red-500);
}

  .c_green\.500 {
    color: var(--colors-green-500);
}

  .c_purple\.600 {
    color: var(--colors-purple-600);
}

  .c_purple\.900 {
    color: var(--colors-purple-900);
}

  .c_purple\.800 {
    color: var(--colors-purple-800);
}

  .color-palette_purple {
    --colors-color-palette-500: var(--colors-purple-500);
    --colors-color-palette-contrast: var(--colors-purple-contrast);
    --colors-color-palette-fg: var(--colors-purple-fg);
    --colors-color-palette-subtle: var(--colors-purple-subtle);
    --colors-color-palette-muted: var(--colors-purple-muted);
    --colors-color-palette-emphasized: var(--colors-purple-emphasized);
    --colors-color-palette-solid: var(--colors-purple-solid);
    --colors-color-palette-focus-ring: var(--colors-purple-focus-ring);
}

  .bx-sh_sm {
    box-shadow: var(--shadows-sm);
}

  .c_blue\.700 {
    color: var(--colors-blue-700);
}

  .lh_1 {
    line-height: 1;
}

  .ai_end {
    align-items: end;
}

  .ai_stretch {
    align-items: stretch;
}

  .c_black {
    color: var(--colors-black);
}

  .c_orange\.700 {
    color: var(--colors-orange-700);
}

  .c_orange\.600 {
    color: var(--colors-orange-600);
}

  .content_Could_not_connect_to_backend {
    content: Could not connect to backend;
}

  .content_Checking_connection\.\.\. {
    content: Checking connection...;
}

  .content_Please_add_at_least_one_game {
    content: Please add at least one game;
}

  .content_Please_add_at_least_one_YouTube_channel {
    content: Please add at least one YouTube channel;
}

  .color-palette_orange {
    --colors-color-palette-500: var(--colors-orange-500);
    --colors-color-palette-contrast: var(--colors-orange-contrast);
    --colors-color-palette-fg: var(--colors-orange-fg);
    --colors-color-palette-subtle: var(--colors-orange-subtle);
    --colors-color-palette-muted: var(--colors-orange-muted);
    --colors-color-palette-emphasized: var(--colors-orange-emphasized);
    --colors-color-palette-solid: var(--colors-orange-solid);
    --colors-color-palette-focus-ring: var(--colors-orange-focus-ring);
}

  .bx-sh_md {
    box-shadow: var(--shadows-md);
}

  .resize_none {
    resize: none;
}

  .color-palette_yellow {
    --colors-color-palette-500: var(--colors-yellow-500);
    --colors-color-palette-contrast: var(--colors-yellow-contrast);
    --colors-color-palette-fg: var(--colors-yellow-fg);
    --colors-color-palette-subtle: var(--colors-yellow-subtle);
    --colors-color-palette-muted: var(--colors-yellow-muted);
    --colors-color-palette-emphasized: var(--colors-yellow-emphasized);
    --colors-color-palette-solid: var(--colors-yellow-solid);
    --colors-color-palette-focus-ring: var(--colors-yellow-focus-ring);
}

  .ps_8 {
    padding-inline-start: var(--spacing-8);
}

  .us_none {
    -webkit-user-select: none;
    user-select: none;
}

  .inset-bs_50\% {
    inset-block-start: 50%;
}

  .inset-be_50\% {
    inset-block-end: 50%;
}

  .bx-sh_xs {
    box-shadow: var(--shadows-xs);
}

  .asp_16\/9 {
    aspect-ratio: 16/9;
}

  .fs_10px {
    font-size: 10px;
}

  .trf_translate3d\(-50\%\,_-50\%\,_0\) {
    transform: translate3d(-50%, -50%, 0);
}

  .inset-e_2 {
    inset-inline-end: var(--spacing-2);
}

  .lh_1\.2 {
    line-height: 1.2;
}

  .pointer-events_none {
    pointer-events: none;
}

  .content_Could_not_connect_to_backend_runner\,_click_to_retry {
    content: Could not connect to backend runner, click to retry;
}

  .white-space_break-spaces {
    white-space: break-spaces;
}

  .max-w_breakpoint-lg {
    max-width: var(--sizes-breakpoint-lg);
}

  .h_100\% {
    height: 100%;
}

  .min-h_0 {
    min-height: 0;
}

  .max-w_100\% {
    max-width: 100%;
}

  .mt_6 {
    margin-top: var(--spacing-6);
}

  .w_100\% {
    width: 100%;
}

  .mt_2 {
    margin-top: var(--spacing-2);
}

  .h_100dvh {
    height: 100dvh;
}

  .bottom_20px {
    bottom: 20px;
}

  .right_20px {
    right: 20px;
}

  .w_full {
    width: var(--sizes-full);
}

  .h_full {
    height: var(--sizes-full);
}

  .mb_4 {
    margin-bottom: var(--spacing-4);
}

  .ml_auto {
    margin-left: auto;
}

  .mr_auto {
    margin-right: auto;
}

  .max-w_md {
    max-width: var(--sizes-md);
}

  .w_320px {
    width: 320px;
}

  .min-w_24px {
    min-width: 24px;
}

  .h_24px {
    height: 24px;
}

  .w_255px {
    width: 255px;
}

  .w_47px {
    width: 47px;
}

  .top_0 {
    top: 0;
}

  .right_0 {
    right: 0;
}

  .bottom_0 {
    bottom: 0;
}

  .pl_2 {
    padding-left: var(--spacing-2);
}

  .mt_auto {
    margin-top: auto;
}

  .pt_0 {
    padding-top: 0;
}

  .pl_6 {
    padding-left: var(--spacing-6);
}

  .max-w_7xl {
    max-width: var(--sizes-7xl);
}

  .mb_16 {
    margin-bottom: var(--spacing-16);
}

  .mb_6 {
    margin-bottom: var(--spacing-6);
}

  .mb_3 {
    margin-bottom: var(--spacing-3);
}

  .mb_2 {
    margin-bottom: var(--spacing-2);
}

  .pb_50px {
    padding-bottom: 50px;
}

  .max-w_breakpoint-xl {
    max-width: var(--sizes-breakpoint-xl);
}

  .mt_4 {
    margin-top: var(--spacing-4);
}

  .h_1px {
    height: 1px;
}

  .mt_1 {
    margin-top: var(--spacing-1);
}

  .min-w_300px {
    min-width: 300px;
}

  .w_200px {
    width: 200px;
}

  .mb_20px {
    margin-bottom: 20px;
}

  .w_max-content {
    width: max-content;
}

  .max-h_150px {
    max-height: 150px;
}

  .w_100px {
    width: 100px;
}

  .ml_4 {
    margin-left: var(--spacing-4);
}

  .min-w_10rem {
    min-width: 10rem;
}

  .max-w_800px {
    max-width: 800px;
}

  .w_50\% {
    width: 50%;
}

  .max-w_135px {
    max-width: 135px;
}

  .max-w_125px {
    max-width: 125px;
}

  .w_8px {
    width: 8px;
}

  .h_8px {
    height: 8px;
}

  .mb_-2 {
    margin-bottom: calc(var(--spacing-2) * -1);
}

  .h_auto {
    height: auto;
}

  .min-h_40px {
    min-height: 40px;
}

  .ml_1 {
    margin-left: var(--spacing-1);
}

  .w_0\.9rem {
    width: 0.9rem;
}

  .h_0\.9rem {
    height: 0.9rem;
}

  .h_1\.5rem {
    height: 1.5rem;
}

  .w_1px {
    width: 1px;
}

  .w_1rem {
    width: 1rem;
}

  .h_1rem {
    height: 1rem;
}

  .w_var\(--reference-width\) {
    width: var(--reference-width);
}

  .min-w_100\% {
    min-width: 100%;
}

  .h_calc\(100\%_-_\{spacing\.2\}\) {
    height: calc(100% - var(--spacing-2));
}

  .h_1 {
    height: var(--sizes-1);
}

  .mb_1 {
    margin-bottom: var(--spacing-1);
}

  .ml_-2\.5 {
    margin-left: calc(var(--spacing-2\.5) * -1);
}

  .h_12 {
    height: var(--sizes-12);
}

  .pl_4 {
    padding-left: var(--spacing-4);
}

  .min-h_80px {
    min-height: 80px;
}

  .max-h_200px {
    max-height: 200px;
}

  .min-w_250px {
    min-width: 250px;
}

  .min-w_0 {
    min-width: 0;
}

  .ml_2 {
    margin-left: var(--spacing-2);
}

  .w_64px {
    width: 64px;
}

  .h_64px {
    height: 64px;
}

  .h_8 {
    height: var(--sizes-8);
}

  .w_4 {
    width: var(--sizes-4);
}

  .w_8 {
    width: var(--sizes-8);
}

  .min-h_300px {
    min-height: 300px;
}

  .left_4 {
    left: var(--spacing-4);
}

  .max-w_8xl {
    max-width: var(--sizes-8xl);
}

  .min-w_85px {
    min-width: 85px;
}

  .max-w_85px {
    max-width: 85px;
}

  .mr_4 {
    margin-right: var(--spacing-4);
}

  .pt_4 {
    padding-top: var(--spacing-4);
}

  .top_calc\(100\%_\+_7px\) {
    top: calc(100% + 7px);
}

  .left_50\% {
    left: 50%;
}

  .top_2 {
    top: var(--spacing-2);
}

  .mr_2 {
    margin-right: var(--spacing-2);
}

  .w_16px {
    width: 16px;
}

  .w_2xs {
    width: var(--sizes-2xs);
}

  .w_auto {
    width: auto;
}

  .w_300px {
    width: 300px;
}

  .ml_6 {
    margin-left: var(--spacing-6);
}

  .dark .dark\:bg_blue\.100 {
    background: var(--colors-blue-100);
}

  .dark .dark\:bg_red\.100 {
    background: var(--colors-red-100);
}

  .dark .dark\:bg_green\.100 {
    background: var(--colors-green-100);
}

  .dark .dark\:bg_purple\.100 {
    background: var(--colors-purple-100);
}

  .\[\&_thead\]\:bg_gray\.50 thead {
    background: var(--colors-gray-50);
}

  .dark .dark\:bg_blue\.200 {
    background: var(--colors-blue-200);
}

  .group[data-collapsed] .\[\.group\[data-collapsed\]_\&\]\:px_1\.5 {
    padding-inline: var(--spacing-1\.5);
}

  .group:is([aria-expanded=true], [data-expanded], [data-state="expanded"]) .groupExpanded\:px_2 {
    padding-inline: var(--spacing-2);
}

  .\[\&_th\]\:bd-b_1px_solid th {
    border-bottom: 1px solid;
}

  .\[\&_th\]\:bd-c_border\.muted th {
    border-color: var(--colors-border-muted);
}

  .\[\&_th\]\:py_4 th {
    padding-block: var(--spacing-4);
}

  .\[\&_th\]\:px_6 th {
    padding-inline: var(--spacing-6);
}

  .\[\&_td\]\:bd-b_1px_solid td {
    border-bottom: 1px solid;
}

  .\[\&_td\]\:bd-c_border\.subtle td {
    border-color: var(--colors-border-subtle);
}

  .\[\&_td\]\:py_4 td {
    padding-block: var(--spacing-4);
}

  .\[\&_td\]\:px_6 td {
    padding-inline: var(--spacing-6);
}

  .\[\&_tbody_tr\:last-child_td\]\:bd-b_none tbody tr:last-child td {
    border-bottom: none;
}

  .current\:fw_bold:is([aria-current=true], [data-current]) {
    font-weight: var(--font-weights-bold);
}

  .current\:c_fg:is([aria-current=true], [data-current]) {
    color: var(--colors-fg);
}

  .group[data-current] .\[\.group\[data-current\]_\&\]\:fw_bold {
    font-weight: var(--font-weights-bold);
}

  .group[data-current] .\[\.group\[data-current\]_\&\]\:c_fg {
    color: var(--colors-fg);
}

  .group[data-collapsed] .\[\.group\[data-collapsed\]_\&\]\:op_0 {
    opacity: 0;
}

  .\[\&_table\]\:bd-cl_separate table {
    border-collapse: separate;
}

  .\[\&_table\]\:bd-sp_0 table {
    border-spacing: 0;
}

  .\[\&_th\]\:fw_semibold th {
    font-weight: var(--font-weights-semibold);
}

  .\[\&_th\]\:fs_sm th {
    font-size: var(--font-sizes-sm);
}

  .\[\&_th\]\:c_fg\.default th {
    color: fg.default;
}

  .dark .dark\:c_blue\.900 {
    color: var(--colors-blue-900);
}

  .dark .dark\:c_red\.900 {
    color: var(--colors-red-900);
}

  .group:is([aria-expanded=true], [data-expanded], [data-state="expanded"]) .groupExpanded\:op_1 {
    opacity: 1;
}

  .group:is([aria-expanded=true], [data-expanded], [data-state="expanded"]) .groupExpanded\:pointer-events_auto {
    pointer-events: auto;
}

  .group[data-collapsed] .\[\.group\[data-collapsed\]_\&\]\:h_0 {
    height: 0;
}

  .icon\:w_5 :where(svg) {
    width: var(--sizes-5);
}

  .icon\:h_5 :where(svg) {
    height: var(--sizes-5);
}

  .focus\:bd-c_blue\.400:is(:focus, [data-focus]) {
    border-color: var(--colors-blue-400);
}

  .focus\:bd-c_purple\.400:is(:focus, [data-focus]) {
    border-color: var(--colors-purple-400);
}

  .focus\:bx-sh_0_0_0_1px_var\(--chakra-colors-blue-400\):is(:focus, [data-focus]) {
    box-shadow: 0 0 0 1px var(--chakra-colors-blue-400);
}

  .focus\:bx-sh_0_0_0_1px_var\(--chakra-colors-purple-400\):is(:focus, [data-focus]) {
    box-shadow: 0 0 0 1px var(--chakra-colors-purple-400);
}

  .hover\:bg_gray\.50:is(:hover, [data-hover]) {
    background: var(--colors-gray-50);
}

  .hover\:bg_bg\.muted:is(:hover, [data-hover]) {
    background: var(--colors-bg-muted);
}

  .\[\&_tbody_tr\:hover\]\:bg_blue\.25 tbody tr:hover {
    background: blue.25;
}

  .hover\:bg_red\.300:is(:hover, [data-hover]) {
    background: var(--colors-red-300);
}

  .hover\:td_underline:is(:hover, [data-hover]) {
    text-decoration: underline;
}

  .hover\:td-c_currentColor\/45:is(:hover, [data-hover]) {
    --mix-textDecorationColor: color-mix(in srgb, currentColor 45%, transparent);
    text-decoration-color: var(--mix-textDecorationColor, currentColor);
}

  .hover\:tu-o_3px:is(:hover, [data-hover]) {
    text-underline-offset: 3px;
}

  .hover\:td-c_currentColor\/20:is(:hover, [data-hover]) {
    --mix-textDecorationColor: color-mix(in srgb, currentColor 20%, transparent);
    text-decoration-color: var(--mix-textDecorationColor, currentColor);
}

  .hover\:trf_translateY\(-4px\):is(:hover, [data-hover]) {
    transform: translateY(-4px);
}

  .hover\:bx-sh_xl:is(:hover, [data-hover]) {
    box-shadow: var(--shadows-xl);
}

  .hover\:c_blue\.600:is(:hover, [data-hover]) {
    color: var(--colors-blue-600);
}

  .hover\:op_0\.8:is(:hover, [data-hover]) {
    opacity: 0.8;
}

  .hover\:filter_brightness\(\.9\):is(:hover, [data-hover]) {
    filter: brightness(.9);
}

  .hover\:trf_translateY\(-1px\):is(:hover, [data-hover]) {
    transform: translateY(-1px);
}

  .hover\:bx-sh_lg:is(:hover, [data-hover]) {
    box-shadow: var(--shadows-lg);
}

  .active\:ring_none:is(:active, [data-active]) {
    outline: 2px solid transparent;
    outline-offset: 2px;
}

  .active\:bx-sh_0_0_0_2px_var\(--shadow-color\):is(:active, [data-active]) {
    box-shadow: 0 0 0 2px var(--shadow-color);
}

  .active\:bx-sh-c_bg\.emphasized:is(:active, [data-active]) {
    --shadow-color: var(--colors-bg-emphasized);
}

  @media screen and (min-width: 48rem) {
    .md\:px_6 {
      padding-inline: var(--spacing-6);
}
    .md\:grid-tc_repeat\(2\,_minmax\(0\,_1fr\)\) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
}
    .md\:flex-d_row {
      flex-direction: row;
}
    .md\:w_356px {
      width: 356px;
}
}

  @media screen and (min-width: 64rem) {
    .lg\:px_8 {
      padding-inline: var(--spacing-8);
}
}

  @media screen and (max-width: 47.9975rem) {
    .mdDown\:inset-x_1rem {
      inset-inline: 1rem;
}
}
}