@layer aitwister-foundation, aitwister-component-foundation, aitwister-shell, aitwister-components, aitwister-public, aitwister-user, aitwister-admin, aitwister-utilities, aitwister-overrides;
@layer aitwister-component-foundation {
:root {
--ait-css-component-base-tokens: 1;
--ait-token-color-text: var(--text, #e5eefc);
--ait-token-color-text-muted: var(--muted, #9aa8bf);
--ait-token-color-text-soft: var(--text-soft, rgba(226, 232, 240, 0.72));
--ait-token-color-surface: var(--surface-main, rgba(15, 23, 42, 0.72));
--ait-token-color-surface-alt: var(--surface-alt, rgba(15, 23, 42, 0.54));
--ait-token-color-surface-soft: var(--surface-soft, rgba(15, 23, 42, 0.36));
--ait-token-color-border: var(--panel-border, rgba(148, 163, 184, 0.18));
--ait-token-color-border-soft: var(--surface-border-soft, rgba(148, 163, 184, 0.14));
--ait-token-color-accent-a: var(--accent-a, #22d3ee);
--ait-token-color-accent-b: var(--accent-b, #a78bfa);
--ait-token-color-accent-contrast: var(--accent-contrast, #06121f);
--ait-token-radius-xs: 8px;
--ait-token-radius-sm: 12px;
--ait-token-radius-md: 16px;
--ait-token-radius-lg: 22px;
--ait-token-radius-xl: 28px;
--ait-token-radius-pill: 999px;
--ait-token-space-1: 4px;
--ait-token-space-2: 8px;
--ait-token-space-3: 12px;
--ait-token-space-4: 16px;
--ait-token-space-5: 20px;
--ait-token-space-6: 24px;
--ait-token-space-8: 32px;
--ait-token-shadow-soft: var(--surface-shadow, 0 18px 48px rgba(0, 0, 0, 0.22));
--ait-token-shadow-panel: var(--shadow, 0 24px 70px rgba(0, 0, 0, 0.28));
--ait-token-z-dropdown: 40;
--ait-token-z-sticky: 50;
--ait-token-z-modal: 100;
--ait-token-z-toast: 120;
}
}