:host,
.ahi-theme-dark,
.ahi-invert {
  color-scheme: dark;

  --ahi-color-gray-50: #0b1015;
  --ahi-color-gray-100: #12181d;
  --ahi-color-gray-200: #1b2127;
  --ahi-color-gray-300: #272d34;
  --ahi-color-gray-400: #383f47;
  --ahi-color-gray-500: #51575f;
  --ahi-color-gray-600: #70777e;
  --ahi-color-gray-700: #949ba1;
  --ahi-color-gray-800: #bbc0c6;
  --ahi-color-gray-900: #e2e7eb;

  --ahi-background: var(--ahi-color-gray-50);
  --ahi-background-hovered: var(--ahi-color-gray-100);
  --ahi-background-depressed: var(--ahi-color-gray-200);
  --ahi-background-selected: var(--ahi-color-gray-200);
  --ahi-surface: var(--ahi-color-gray-200);
  --ahi-surface-neutral: var(--ahi-color-gray-300);
  --ahi-surface-neutral-hovered: var(--ahi-color-gray-400);
  --ahi-surface-neutral-depressed: var(--ahi-color-gray-500);
  --ahi-surface-neutral-disabled: var(--ahi-color-gray-200);
  --ahi-surface-neutral-subdued: var(--ahi-color-gray-200);
  --ahi-surface-subdued: var(--ahi-color-gray-100);
  --ahi-surface-disabled: var(--ahi-color-gray-100);
  --ahi-surface-hovered: var(--ahi-color-gray-300);
  --ahi-surface-depressed: var(--ahi-color-gray-400);
  --ahi-surface-search-field: var(--ahi-color-gray-100);
  --ahi-backdrop: #00000080;
  --ahi-overlay: color-mix(in srgb, var(--ahi-color-gray-100), transparent 50%);
  --ahi-border: var(--ahi-color-gray-600);
  --ahi-border-neutral-subdued: var(--ahi-color-gray-500);
  --ahi-border-hovered: var(--ahi-color-gray-700);
  --ahi-border-disabled: var(--ahi-color-gray-400);
  --ahi-border-subdued: var(--ahi-color-gray-500);
  --ahi-border-depressed: var(--ahi-color-gray-700);
  --ahi-border-shadow: var(--ahi-color-gray-500);
  --ahi-border-shadow-subdued: var(--ahi-color-gray-400);
  --ahi-divider: var(--ahi-color-gray-300);
  --ahi-icon: var(--ahi-color-gray-700);
  --ahi-icon-hovered: var(--ahi-color-gray-900);
  --ahi-icon-depressed: var(--ahi-color-gray-900);
  --ahi-icon-disabled: var(--ahi-color-gray-500);
  --ahi-icon-subdued: var(--ahi-color-gray-600);
  --ahi-text: var(--ahi-color-gray-900);
  --ahi-text-disabled: var(--ahi-color-gray-600);
  --ahi-text-subdued: var(--ahi-color-gray-700);

  --ahi-interactive: var(--ahi-color-blue-400);
  --ahi-interactive-disabled: var(--ahi-color-gray-500);
  --ahi-interactive-hovered: var(--ahi-color-blue-300);
  --ahi-interactive-depressed: var(--ahi-color-blue-200);
  --ahi-focused: var(--ahi-color-blue-400);
  --ahi-surface-selected: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 15%,
    var(--ahi-surface)
  );
  --ahi-surface-selected-hovered: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 20%,
    var(--ahi-surface)
  );
  --ahi-surface-selected-depressed: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 27%,
    var(--ahi-surface)
  );
  --ahi-icon-on-interactive: #fff;
  --ahi-text-on-interactive: #fff;

  --ahi-action-secondary: var(--ahi-color-gray-300);
  --ahi-action-secondary-disabled: var(--ahi-color-gray-200);
  --ahi-action-secondary-hovered: var(--ahi-color-gray-400);
  --ahi-action-secondary-depressed: var(--ahi-color-gray-500);

  --ahi-action-primary: var(--ahi-color-blue-600);
  --ahi-action-primary-disabled: var(--ahi-color-gray-300);
  --ahi-action-primary-hovered: var(--ahi-color-blue-700);
  --ahi-action-primary-depressed: var(--ahi-color-blue-800);
  --ahi-icon-on-primary: #fff;
  --ahi-text-on-primary: #fff;
  --ahi-text-primary: var(--ahi-color-blue-400);
  --ahi-text-primary-hovered: var(--ahi-color-blue-300);
  --ahi-text-primary-depressed: var(--ahi-color-blue-200);
  --ahi-surface-primary-selected: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 15%,
    var(--ahi-surface)
  );
  --ahi-surface-primary-selected-hovered: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 20%,
    var(--ahi-surface)
  );
  --ahi-surface-primary-selected-depressed: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 27%,
    var(--ahi-surface)
  );

  --ahi-border-critical: var(--ahi-color-red-500);
  --ahi-border-critical-subdued: var(--ahi-color-red-700);
  --ahi-border-critical-disabled: var(--ahi-color-red-800);
  --ahi-icon-critical: var(--ahi-color-red-400);
  --ahi-surface-critical: color-mix(
    in oklab,
    var(--ahi-color-red-500) 32%,
    var(--ahi-surface)
  );
  --ahi-surface-critical-subdued: color-mix(
    in oklab,
    var(--ahi-color-red-500) 15%,
    var(--ahi-surface)
  );
  --ahi-surface-critical-subdued-hovered: color-mix(
    in oklab,
    var(--ahi-color-red-500) 20%,
    var(--ahi-surface)
  );
  --ahi-surface-critical-subdued-depressed: color-mix(
    in oklab,
    var(--ahi-color-red-500) 27%,
    var(--ahi-surface)
  );
  --ahi-text-critical: var(--ahi-color-red-300);
  --ahi-action-critical: var(--ahi-color-red-700);
  --ahi-action-critical-disabled: var(--ahi-color-gray-300);
  --ahi-action-critical-hovered: var(--ahi-color-red-800);
  --ahi-action-critical-depressed: var(--ahi-color-red-900);
  --ahi-icon-on-critical: #fff;
  --ahi-text-on-critical: #fff;
  --ahi-interactive-critical: var(--ahi-color-red-400);
  --ahi-interactive-critical-disabled: var(--ahi-color-red-700);
  --ahi-interactive-critical-hovered: var(--ahi-color-red-300);
  --ahi-interactive-critical-depressed: var(--ahi-color-red-200);

  --ahi-border-warning: var(--ahi-color-yellow-500);
  --ahi-border-warning-subdued: var(--ahi-color-yellow-700);
  --ahi-icon-warning: var(--ahi-color-yellow-400);
  --ahi-surface-warning: color-mix(
    in oklab,
    var(--ahi-color-yellow-500) 32%,
    var(--ahi-surface)
  );
  --ahi-surface-warning-subdued: color-mix(
    in oklab,
    var(--ahi-color-yellow-500) 15%,
    var(--ahi-surface)
  );
  --ahi-surface-warning-subdued-hovered: color-mix(
    in oklab,
    var(--ahi-color-yellow-500) 20%,
    var(--ahi-surface)
  );
  --ahi-surface-warning-subdued-depressed: color-mix(
    in oklab,
    var(--ahi-color-yellow-500) 27%,
    var(--ahi-surface)
  );
  --ahi-text-warning: var(--ahi-color-yellow-300);

  --ahi-border-highlight: var(--ahi-color-blue-500);
  --ahi-border-highlight-subdued: var(--ahi-color-blue-700);
  --ahi-icon-highlight: var(--ahi-color-blue-400);
  --ahi-surface-highlight: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 32%,
    var(--ahi-surface)
  );
  --ahi-surface-highlight-subdued: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 15%,
    var(--ahi-surface)
  );
  --ahi-surface-highlight-subdued-hovered: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 20%,
    var(--ahi-surface)
  );
  --ahi-surface-highlight-subdued-depressed: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 27%,
    var(--ahi-surface)
  );
  --ahi-text-highlight: var(--ahi-color-blue-300);

  --ahi-border-success: var(--ahi-color-green-500);
  --ahi-border-success-subdued: var(--ahi-color-green-700);
  --ahi-icon-success: var(--ahi-color-green-400);
  --ahi-surface-success: color-mix(
    in oklab,
    var(--ahi-color-green-500) 32%,
    var(--ahi-surface)
  );
  --ahi-surface-success-subdued: color-mix(
    in oklab,
    var(--ahi-color-green-500) 15%,
    var(--ahi-surface)
  );
  --ahi-surface-success-subdued-hovered: color-mix(
    in oklab,
    var(--ahi-color-green-500) 20%,
    var(--ahi-surface)
  );
  --ahi-surface-success-subdued-depressed: color-mix(
    in oklab,
    var(--ahi-color-green-500) 27%,
    var(--ahi-surface)
  );
  --ahi-text-success: var(--ahi-color-green-300);

  --ahi-icon-attention: var(--ahi-color-yellow-400);
  --ahi-surface-attention: color-mix(
    in oklab,
    var(--ahi-color-yellow-500) 36%,
    var(--ahi-surface)
  );
  --ahi-text-attention: var(--ahi-color-yellow-200);

  --ahi-color-accent: var(--ahi-color-blue-600);
  --ahi-color-accent-secondary: var(--ahi-color-blue-700);
  --ahi-color-text-on-accent: #fff;
  --ahi-color-text-on-accent-secondary: #fff;
  --ahi-color-navigation-text: var(--ahi-text);
  --ahi-color-navigation-heading-text: var(--ahi-text-subdued);
  --ahi-color-navigation-hover: var(--ahi-color-gray-300);
  --ahi-color-navigation-hover-text: var(--ahi-text);
  --ahi-color-navigation-depressed: var(--ahi-color-gray-400);
  --ahi-color-badge-notification: var(--ahi-action-critical);
  --ahi-color-text-on-badge-notification: #fff;

  --ahi-tooltip-color: var(--ahi-color-gray-100);
  --ahi-tooltip-background-color: var(--ahi-color-gray-900);

  --ahi-color-green-50: #f2fbf4;
  --ahi-color-green-100: #ddefdf;
  --ahi-color-green-200: #bbe1c2;
  --ahi-color-green-300: #9acea3;
  --ahi-color-green-400: #76b884;
  --ahi-color-green-500: #52a165;
  --ahi-color-green-600: #31884a;
  --ahi-color-green-700: #007231;
  --ahi-color-green-800: #005924;
  --ahi-color-green-900: #003a15;

  --ahi-color-teal-50: #e8f4f6;
  --ahi-color-teal-100: #cee9ed;
  --ahi-color-teal-200: #a3dbe3;
  --ahi-color-teal-300: #76c8d3;
  --ahi-color-teal-400: #41b2c0;
  --ahi-color-teal-500: #0099a8;
  --ahi-color-teal-600: #007d8a;
  --ahi-color-teal-700: #006570;
  --ahi-color-teal-800: #004e56;
  --ahi-color-teal-900: #003136;

  --ahi-color-blue-50: #e5ecf4;
  --ahi-color-blue-100: #cfdfef;
  --ahi-color-blue-200: #adcdef;
  --ahi-color-blue-300: #8bb7e5;
  --ahi-color-blue-400: #679fd7;
  --ahi-color-blue-500: #4286c7;
  --ahi-color-blue-600: #216caf;
  --ahi-color-blue-700: #005696;
  --ahi-color-blue-800: #004073;
  --ahi-color-blue-900: #00264a;

  --ahi-color-purple-50: #f5eff8;
  --ahi-color-purple-100: #eadef0;
  --ahi-color-purple-200: #dec5eb;
  --ahi-color-purple-300: #cca9dd;
  --ahi-color-purple-400: #b88dcc;
  --ahi-color-purple-500: #a270b9;
  --ahi-color-purple-600: #8a55a1;
  --ahi-color-purple-700: #733f8a;
  --ahi-color-purple-800: #592f6b;
  --ahi-color-purple-900: #391b46;

  --ahi-color-red-50: #fff8f7;
  --ahi-color-red-100: #fff2ef;
  --ahi-color-red-200: #ffd6cf;
  --ahi-color-red-300: #ffb5a9;
  --ahi-color-red-400: #ff8b79;
  --ahi-color-red-500: #f26552;
  --ahi-color-red-600: #d74433;
  --ahi-color-red-700: #c41002;
  --ahi-color-red-800: #9d0600;
  --ahi-color-red-900: #6f0000;

  --ahi-color-orange-50: #fff9f5;
  --ahi-color-orange-100: #fff8f4;
  --ahi-color-orange-200: #feebde;
  --ahi-color-orange-300: #fccdad;
  --ahi-color-orange-400: #fba86e;
  --ahi-color-orange-500: #ee8630;
  --ahi-color-orange-600: #d16c00;
  --ahi-color-orange-700: #b15a00;
  --ahi-color-orange-800: #904800;
  --ahi-color-orange-900: #683200;

  --ahi-color-yellow-50: #fffaf1;
  --ahi-color-yellow-100: #fff9ef;
  --ahi-color-yellow-200: #fff5e4;
  --ahi-color-yellow-300: #feda9e;
  --ahi-color-yellow-400: #eabd71;
  --ahi-color-yellow-500: #d7a240;
  --ahi-color-yellow-600: #bd8706;
  --ahi-color-yellow-700: #a07200;
  --ahi-color-yellow-800: #845d00;
  --ahi-color-yellow-900: #604300;

  --ahi-brand-blue: var(--ahi-color-blue-600);
  --ahi-brand-green: var(--ahi-color-green-600);
  --ahi-brand-red: var(--ahi-color-red-600);

  --ahi-color-data-1: var(--ahi-color-blue-600);
  --ahi-color-data-2: var(--ahi-color-orange-600);
  --ahi-color-data-3: var(--ahi-color-green-600);
  --ahi-color-data-4: var(--ahi-color-purple-600);
  --ahi-color-data-5: var(--ahi-color-red-600);
  --ahi-color-data-6: var(--ahi-color-teal-600);
  --ahi-color-data-7: var(--ahi-color-yellow-600);

  --ahi-border-radius-sharp: 2px;
  --ahi-border-radius-small: 4px;
  --ahi-border-radius-medium: 8px;
  --ahi-border-radius-pill: 9999px;
  --ahi-border-radius-circle: 50%;

  --ahi-font-family-mono:
    ui-monospace, SFMono-Regular, "SF Mono", Consolas, "Liberation Mono", Menlo,
    monospace;
  --ahi-font-family-sans:
    -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto,
    "Helvetica Neue", sans-serif;

  --ahi-font-weight-regular: 400;
  --ahi-font-weight-medium: 500;
  --ahi-font-weight-semibold: 600;
  --ahi-font-weight-bold: 700;

  --ahi-font-scale: 1;

  --ahi-line-height-300: calc(12px * var(--ahi-font-scale));
  --ahi-line-height-400: calc(16px * var(--ahi-font-scale));
  --ahi-line-height-500: calc(20px * var(--ahi-font-scale));
  --ahi-line-height-600: calc(24px * var(--ahi-font-scale));
  --ahi-line-height-700: calc(28px * var(--ahi-font-scale));
  --ahi-line-height-800: calc(32px * var(--ahi-font-scale));
  --ahi-line-height-1000: calc(40px * var(--ahi-font-scale));
  --ahi-line-height-1200: calc(48px * var(--ahi-font-scale));

  --ahi-letter-spacing-densest: -0.54px;
  --ahi-letter-spacing-denser: -0.3px;
  --ahi-letter-spacing-dense: -0.2px;
  --ahi-letter-spacing-normal: 0px;

  --ahi-font-size-300: calc(12px * var(--ahi-font-scale));
  --ahi-font-size-350: calc(14px * var(--ahi-font-scale));
  --ahi-font-size-400: calc(16px * var(--ahi-font-scale));
  --ahi-font-size-450: calc(18px * var(--ahi-font-scale));
  --ahi-font-size-500: calc(20px * var(--ahi-font-scale));
  --ahi-font-size-600: calc(24px * var(--ahi-font-scale));
  --ahi-font-size-750: calc(30px * var(--ahi-font-scale));
  --ahi-font-size-900: calc(36px * var(--ahi-font-scale));

  --ahi-font-size-275: var(--ahi-font-size-300);
  --ahi-font-size-325: var(--ahi-font-size-350);
  --ahi-font-size-375: var(--ahi-font-size-350);
  --ahi-font-size-425: var(--ahi-font-size-400);
  --ahi-font-size-550: var(--ahi-font-size-600);
  --ahi-font-size-800: var(--ahi-font-size-750);
  --ahi-font-size-1000: var(--ahi-font-size-900);

  --ahi-type-display-font-size: calc(30px * var(--ahi-font-scale));
  --ahi-type-display-line-height: calc(36px * var(--ahi-font-scale));

  --ahi-type-heading-font-size: calc(20px * var(--ahi-font-scale));
  --ahi-type-heading-line-height: calc(28px * var(--ahi-font-scale));

  --ahi-type-subheading-font-size: calc(16px * var(--ahi-font-scale));
  --ahi-type-subheading-line-height: calc(24px * var(--ahi-font-scale));

  --ahi-type-body-font-size: calc(14px * var(--ahi-font-scale));
  --ahi-type-body-line-height: calc(20px * var(--ahi-font-scale));

  --ahi-type-body-emphasis-font-size: calc(14px * var(--ahi-font-scale));
  --ahi-type-body-emphasis-line-height: calc(20px * var(--ahi-font-scale));

  --ahi-type-label-font-size: calc(14px * var(--ahi-font-scale));
  --ahi-type-label-line-height: calc(20px * var(--ahi-font-scale));

  --ahi-type-caption-font-size: calc(12px * var(--ahi-font-scale));
  --ahi-type-caption-line-height: calc(16px * var(--ahi-font-scale));

  --ahi-type-code-font-size: calc(13px * var(--ahi-font-scale));
  --ahi-type-code-line-height: calc(20px * var(--ahi-font-scale));

  --ahi-focus-ring-color: var(--ahi-focused);
  --ahi-focus-ring-style: solid;
  --ahi-focus-ring-width: 3px;
  --ahi-focus-ring: var(--ahi-focus-ring-style) var(--ahi-focus-ring-width)
    var(--ahi-focus-ring-color);
  --ahi-focus-ring-offset: 1px;

  --ahi-target-min-size: 24px;

  --ahi-space-base: 16px;

  --ahi-space-0: 0;
  --ahi-space-025: calc(0.0625 * var(--ahi-space-base));
  --ahi-space-05: calc(0.125 * var(--ahi-space-base));
  --ahi-space-1: calc(0.25 * var(--ahi-space-base));
  --ahi-space-2: calc(0.5 * var(--ahi-space-base));
  --ahi-space-3: calc(0.75 * var(--ahi-space-base));
  --ahi-space-4: var(--ahi-space-base);
  --ahi-space-5: calc(1.25 * var(--ahi-space-base));
  --ahi-space-6: calc(1.5 * var(--ahi-space-base));
  --ahi-space-8: calc(2 * var(--ahi-space-base));
  --ahi-space-10: calc(2.5 * var(--ahi-space-base));
  --ahi-space-12: calc(3 * var(--ahi-space-base));
  --ahi-space-16: calc(4 * var(--ahi-space-base));
  --ahi-space-20: calc(5 * var(--ahi-space-base));
  --ahi-space-24: calc(6 * var(--ahi-space-base));
  --ahi-space-28: calc(7 * var(--ahi-space-base));
  --ahi-space-32: calc(8 * var(--ahi-space-base));
  --ahi-border-width-1: 1px;
  --ahi-border-width-2: 2px;
  --ahi-border-width-3: 3px;
  --ahi-border-divider: var(--ahi-border-width-1) solid var(--ahi-divider);
  --ahi-transition-x-slow: 1000ms;
  --ahi-transition-slow: 500ms;
  --ahi-transition-medium: 250ms;
  --ahi-transition-fast: 150ms;
  --ahi-transition-x-fast: 50ms;
  --ahi-ease: cubic-bezier(0.25, 0.1, 0.25, 1);
  --ahi-ease-in: cubic-bezier(0.42, 0, 1, 1);
  --ahi-ease-in-out: cubic-bezier(0.42, 0, 0.58, 1);
  --ahi-shadow-transparent: 0 0 0 0 transparent;
  --ahi-shadow-faint: 0 1px 0 0 rgba(22, 29, 37, 0.05);
  --ahi-shadow-base:
    0 0 0 1px rgba(63, 63, 68, 0.05), 0 1px 3px 0 rgba(63, 63, 68, 0.15);
  --ahi-shadow-deep:
    0 0 0 1px rgba(6, 44, 82, 0.1), 0 2px 16px rgba(33, 43, 54, 0.08);
  --ahi-shadow-button: 0 1px 0 rgba(0, 0, 0, 0.05);
  --ahi-shadow-top-bar: 0 2px 2px -1px rgba(0, 0, 0, 0.15);
  --ahi-shadow-card:
    0 0 5px rgba(23, 24, 24, 0.05), 0 1px 2px rgba(0, 0, 0, 0.15);
  --ahi-shadow-popover:
    0 3px 6px -3px rgba(23, 24, 24, 0.08),
    0 8px 20px -4px rgba(23, 24, 24, 0.12);
  --ahi-shadow-layer:
    0 31px 41px 0 rgba(32, 42, 53, 0.2), 0 2px 16px 0 rgba(32, 42, 54, 0.08);
  --ahi-shadow-modal:
    0 26px 80px rgba(0, 0, 0, 0.2), 0 0 1px rgba(0, 0, 0, 0.2);
  --ahi-z-index-sticky: 300;
  --ahi-z-index-nav: 400;
  --ahi-z-index-top-bar: 500;
  --ahi-z-index-overlay: 600;
  --ahi-z-index-dialog: 800;
  --ahi-z-index-dropdown: 900;
  --ahi-z-index-alert: 950;
  --ahi-z-index-tooltip: 1000;

  --ahi-field-min-height: calc(36px * var(--ahi-font-scale));

  --ahi-option-min-height: auto;
  --ahi-form-control-required-content: "*";
  --ahi-form-control-required-content-offset: -2px;
  --ahi-form-control-required-content-color: var(--ahi-text-critical);

  --ahi-form-control-font-size: var(--ahi-type-body-font-size);

  --ahi-form-control-label-font-size: var(--ahi-font-size-375);
  --ahi-form-control-label-spacing: var(--ahi-space-4);
  --ahi-form-control-help-text-color: var(--ahi-text-subdued);

  --ahi-form-control-help-text-font-size: inherit;
  --ahi-form-control-error-color: var(--ahi-text-critical);

  --ahi-card-title-font-size: var(--ahi-type-subheading-font-size);
  --ahi-tooltip-arrow-size: 6px;
  --ahi-tooltip-padding: var(--ahi-space-1) var(--ahi-space-2);
  --ahi-tooltip-line-height: var(--ahi-line-height-600);
  --ahi-tooltip-font-weight: var(--ahi-font-weight-regular);
  --ahi-tooltip-font-size: var(--ahi-font-size-350);
  --ahi-tooltip-font-family: var(--ahi-font-family-sans);
  --ahi-tooltip-border-radius: var(--ahi-border-radius-small);
  --ahi-icon-size-minor: 16px;
  --ahi-icon-size-major: 20px;
  --ahi-icon-size-spot: 60px;

  --ahi-shadow-popover:
    0 0 0 1px rgba(255, 255, 255, 0.18), 0 3px 6px -3px rgba(0, 0, 0, 0.5),
    0 8px 20px -4px rgba(0, 0, 0, 0.65);
  --ahi-shadow-modal:
    0 0 0 1px rgba(255, 255, 255, 0.2), 0 26px 80px rgba(0, 0, 0, 0.7),
    0 0 1px rgba(0, 0, 0, 0.6);
}

@supports (scrollbar-gutter: stable) {
  .ahi-scroll-lock {
    scrollbar-gutter: var(--ahi-scroll-lock-gutter) !important;
  }

  .ahi-scroll-lock body {
    overflow: hidden !important;
  }
}

@supports not (scrollbar-gutter: stable) {
  .ahi-scroll-lock body {
    padding-right: var(--ahi-scroll-lock-size) !important;
    overflow: hidden !important;
  }
}

.ahi-toast-stack {
  inset: auto;
  margin: 0;
  border: none;
  padding: 0;
  background: transparent;
  color: inherit;

  position: fixed;
  top: 0;
  inset-inline-end: 0;
  z-index: var(--ahi-z-index-alert);
  width: 448px;
  max-width: 100%;
  max-height: 100%;
  overflow: auto;
}

.ahi-toast-stack ahi-banner {
  margin: var(--ahi-space-4);
}

.ahi-toast-stack ahi-banner::part(base) {
  box-shadow: var(--ahi-shadow-popover);
}

@media (pointer: coarse) {
  :root {
    --ahi-target-min-size: 44px;

    --ahi-field-min-height: calc(44px * var(--ahi-font-scale));

    --ahi-option-min-height: 44px;

    --ahi-form-control-font-size: calc(16px * var(--ahi-font-scale));
  }
}

.ahi-density-comfortable {
  --ahi-form-control-font-size: var(--ahi-font-size-400);
  --ahi-form-control-label-font-size: var(--ahi-font-size-400);
  --ahi-form-control-help-text-font-size: var(--ahi-font-size-350);
  --ahi-target-min-size: 44px;

  --ahi-type-display-font-size: calc(34px * var(--ahi-font-scale));
  --ahi-type-display-line-height: calc(40px * var(--ahi-font-scale));
  --ahi-type-heading-font-size: calc(24px * var(--ahi-font-scale));
  --ahi-type-heading-line-height: calc(32px * var(--ahi-font-scale));
  --ahi-type-subheading-font-size: calc(18px * var(--ahi-font-scale));
  --ahi-type-subheading-line-height: calc(26px * var(--ahi-font-scale));
  --ahi-type-body-font-size: calc(16px * var(--ahi-font-scale));
  --ahi-type-body-line-height: calc(24px * var(--ahi-font-scale));
  --ahi-type-body-emphasis-font-size: calc(16px * var(--ahi-font-scale));
  --ahi-type-body-emphasis-line-height: calc(24px * var(--ahi-font-scale));
  --ahi-type-label-font-size: calc(16px * var(--ahi-font-scale));
  --ahi-type-label-line-height: calc(24px * var(--ahi-font-scale));
  --ahi-type-caption-font-size: calc(14px * var(--ahi-font-scale));
  --ahi-type-caption-line-height: calc(20px * var(--ahi-font-scale));
  --ahi-type-code-font-size: calc(14px * var(--ahi-font-scale));
  --ahi-type-code-line-height: calc(22px * var(--ahi-font-scale));
}

.ahi-density-spacious {
  --ahi-form-control-font-size: var(--ahi-font-size-450);
  --ahi-form-control-label-font-size: var(--ahi-font-size-450);
  --ahi-form-control-help-text-font-size: var(--ahi-font-size-400);
  --ahi-target-min-size: 44px;

  --ahi-type-display-font-size: calc(36px * var(--ahi-font-scale));
  --ahi-type-display-line-height: calc(44px * var(--ahi-font-scale));
  --ahi-type-heading-font-size: calc(30px * var(--ahi-font-scale));
  --ahi-type-heading-line-height: calc(36px * var(--ahi-font-scale));
  --ahi-type-subheading-font-size: calc(20px * var(--ahi-font-scale));
  --ahi-type-subheading-line-height: calc(28px * var(--ahi-font-scale));
  --ahi-type-body-font-size: calc(18px * var(--ahi-font-scale));
  --ahi-type-body-line-height: calc(28px * var(--ahi-font-scale));
  --ahi-type-body-emphasis-font-size: calc(18px * var(--ahi-font-scale));
  --ahi-type-body-emphasis-line-height: calc(28px * var(--ahi-font-scale));
  --ahi-type-label-font-size: calc(18px * var(--ahi-font-scale));
  --ahi-type-label-line-height: calc(28px * var(--ahi-font-scale));
  --ahi-type-caption-font-size: calc(16px * var(--ahi-font-scale));
  --ahi-type-caption-line-height: calc(24px * var(--ahi-font-scale));
  --ahi-type-code-font-size: calc(16px * var(--ahi-font-scale));
  --ahi-type-code-line-height: calc(24px * var(--ahi-font-scale));
}

@layer ahi-utilities {
  .ahi-cluster {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--ahi-space-4);
  }

  .ahi-grid {
    display: grid;
    gap: var(--ahi-space-4);
    grid-template-columns: repeat(
      auto-fill,
      minmax(clamp(0px, var(--ahi-min-column-size, 20ch), 100%), 1fr)
    );
  }

  .ahi-span-grid {
    grid-column: 1 / -1;
  }

  .ahi-flank {
    display: flex;
    align-items: center;
    gap: var(--ahi-space-4);
  }

  .ahi-flank > :first-child {
    flex: 0 0 var(--ahi-flank-size, auto);
  }

  .ahi-flank > :last-child {
    flex: 1 1 auto;
    min-width: 0;
  }

  .ahi-flank-end > :first-child {
    flex: 1 1 auto;
    min-width: 0;
  }

  .ahi-flank-end > :last-child {
    flex: 0 0 var(--ahi-flank-size, auto);
  }

  .ahi-frame {
    display: block;
    overflow: hidden;
    aspect-ratio: 1;
    border-radius: var(--ahi-border-radius-medium);
  }

  .ahi-frame-landscape {
    aspect-ratio: 16 / 9;
  }

  .ahi-frame-portrait {
    aspect-ratio: 9 / 16;
  }

  .ahi-frame > * {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .ahi-cloak:not(:defined),
  .ahi-cloak:has(:not(:defined)) {
    visibility: hidden;
  }

  .ahi-row,
  .ahi-column {
    display: flex;
    gap: var(--ahi-space-4);
  }

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

  .ahi-split {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ahi-space-4);
  }

  .ahi-split-column {
    flex-direction: column;
    align-items: stretch;
  }

  .ahi-gap-0 {
    gap: var(--ahi-space-0);
  }
  .ahi-gap-1 {
    gap: var(--ahi-space-1);
  }
  .ahi-gap-2 {
    gap: var(--ahi-space-2);
  }
  .ahi-gap-3 {
    gap: var(--ahi-space-3);
  }
  .ahi-gap-4 {
    gap: var(--ahi-space-4);
  }
  .ahi-gap-5 {
    gap: var(--ahi-space-5);
  }
  .ahi-gap-6 {
    gap: var(--ahi-space-6);
  }
  .ahi-gap-8 {
    gap: var(--ahi-space-8);
  }
  .ahi-gap-10 {
    gap: var(--ahi-space-10);
  }
  .ahi-gap-12 {
    gap: var(--ahi-space-12);
  }
  .ahi-gap-16 {
    gap: var(--ahi-space-16);
  }

  .ahi-align-items-start {
    align-items: flex-start;
  }
  .ahi-align-items-end {
    align-items: flex-end;
  }
  .ahi-align-items-center {
    align-items: center;
  }
  .ahi-align-items-stretch {
    align-items: stretch;
  }
  .ahi-align-items-baseline {
    align-items: baseline;
  }

  .ahi-justify-content-start {
    justify-content: flex-start;
  }
  .ahi-justify-content-end {
    justify-content: flex-end;
  }
  .ahi-justify-content-center {
    justify-content: center;
  }
  .ahi-justify-content-space-between {
    justify-content: space-between;
  }
  .ahi-justify-content-space-around {
    justify-content: space-around;
  }
  .ahi-justify-content-space-evenly {
    justify-content: space-evenly;
  }

  .ahi-flex-wrap {
    flex-wrap: wrap;
  }
  .ahi-flex-nowrap {
    flex-wrap: nowrap;
  }

  .ahi-text-display {
    margin: 0;
    font-size: var(--ahi-type-display-font-size);
    line-height: var(--ahi-type-display-line-height);
  }

  .ahi-text-heading {
    margin: 0;
    font-size: var(--ahi-type-heading-font-size);
    line-height: var(--ahi-type-heading-line-height);
  }

  .ahi-text-subheading {
    margin: 0;
    font-size: var(--ahi-type-subheading-font-size);
    line-height: var(--ahi-type-subheading-line-height);
  }

  .ahi-text-body {
    margin: 0;
    font-size: var(--ahi-type-body-font-size);
    line-height: var(--ahi-type-body-line-height);
  }

  .ahi-text-body-emphasis {
    margin: 0;
    font-size: var(--ahi-type-body-emphasis-font-size);
    line-height: var(--ahi-type-body-emphasis-line-height);
    font-weight: var(--ahi-font-weight-semibold);
  }

  .ahi-text-label {
    margin: 0;
    font-size: var(--ahi-type-label-font-size);
    line-height: var(--ahi-type-label-line-height);
  }

  .ahi-text-caption {
    margin: 0;
    font-size: var(--ahi-type-caption-font-size);
    line-height: var(--ahi-type-caption-line-height);
  }

  .ahi-text-code {
    margin: 0;
    font-family: var(--ahi-font-family-mono);
    font-size: var(--ahi-type-code-font-size);
    line-height: var(--ahi-type-code-line-height);
  }

  .ahi-text-subdued {
    color: var(--ahi-text-subdued);
  }

  .ahi-text-critical {
    color: var(--ahi-text-critical);
  }

  .ahi-text-warning {
    color: var(--ahi-text-warning);
  }

  .ahi-text-success {
    color: var(--ahi-text-success);
  }

  .ahi-text-inherit {
    color: inherit;
  }

  .ahi-text-regular {
    font-weight: var(--ahi-font-weight-regular);
  }

  .ahi-text-medium {
    font-weight: var(--ahi-font-weight-medium);
  }

  .ahi-text-semibold {
    font-weight: var(--ahi-font-weight-semibold);
  }

  .ahi-text-bold {
    font-weight: var(--ahi-font-weight-bold);
  }

  .ahi-text-start {
    text-align: start;
  }

  .ahi-text-center {
    text-align: center;
  }

  .ahi-text-end {
    text-align: end;
  }

  .ahi-text-justify {
    text-align: justify;
  }

  .ahi-text-uppercase {
    text-transform: uppercase;
  }

  .ahi-text-capitalize {
    text-transform: capitalize;
  }

  .ahi-text-truncate {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .ahi-text-nowrap {
    white-space: nowrap;
  }

  .ahi-text-break-word {
    overflow-wrap: anywhere;
    word-break: normal;
  }

  .ahi-text-clamp-2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
  }

  .ahi-text-clamp-3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    overflow: hidden;
  }

  .ahi-text-numeric {
    font-variant-numeric: tabular-nums lining-nums;
  }

  .ahi-text-line-through {
    text-decoration-line: line-through;
  }

  .ahi-visually-hidden:not(:focus-within) {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .ahi-visually-hidden-label::part(form-control-label) {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }
}
