@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400..600;1,9..144,400..600&family=Hanken+Grotesk:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root {
	color-scheme: light;
	--ax-color-primary: #5b34d6;
	--ax-color-primary-dark: #4a29b0;
	--ax-color-primary-rgb: 91, 52, 214;
	--ax-color-primary-3: rgba(91, 52, 214, 0.09);
	--ax-color-primary-11: #3f2399;

	--ax-gray-1: #fcfbf8;
	--ax-gray-2: #faf8f4;
	--ax-gray-3: #f3efe8;
	--ax-gray-4: #ece6db;
	--ax-gray-5: #e3ddd1;
	--ax-gray-6: #d6cfc1;
	--ax-gray-7: #bcb4c0;
	--ax-gray-8: #9a93a6;
	--ax-gray-9: #8a8294;
	--ax-gray-10: #6f6880;
	--ax-gray-11: #544c5e;
	--ax-gray-12: #1a1622;

	--ax-gray-a3: rgba(26, 22, 34, 0.04);
	--ax-gray-a6: rgba(26, 22, 34, 0.12);

	--ax-color-peach: #36e0c8;

	--ax-color-dark: #0c0a14;
	--ax-color-dark-text: var(--ax-gray-12);
	--ax-color-dark-light: #2a2640;

	--ax-color-grey: var(--ax-gray-9);
	--ax-color-light: var(--ax-gray-1);
	--ax-color-white: #ffffff;

	--ax-color-success: #3fa874;
	--ax-color-success-bg: #e3f3ea;
	--ax-color-success-text: #2a7d54;

	--ax-color-warning: #c9942f;
	--ax-color-warning-bg: #f9efd9;
	--ax-color-warning-text: #8a6418;

	--ax-color-danger: #e5484d;
	--ax-color-danger-bg: #fbe6e7;
	--ax-color-danger-text: #c5343a;

	--ax-font-primary: 'Hanken Grotesk', system-ui, -apple-system, sans-serif;
	--ax-font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
	--ax-font-mono: 'IBM Plex Mono', ui-monospace, 'Courier New', monospace;
	--ax-font-code: 'IBM Plex Mono', Consolas, monospace;

	--ax-spacing-xs: 0.25rem;
	--ax-spacing-sm: 0.5rem;
	--ax-spacing-md: 0.75rem;
	--ax-spacing-lg: 1rem;
	--ax-spacing-xl: 1.5rem;
	--ax-spacing-2xl: 2rem;
	--ax-spacing-3xl: 3rem;

	--ax-shadow-sm: none;
	--ax-shadow-md: none;
	--ax-shadow-lg: none;
	--ax-shadow-card: none;
	--ax-shadow-hover: none;

	--ax-radius-sm: 8px;
	--ax-radius-md: 12px;
	--ax-radius-lg: 16px;
	--ax-radius-xl: 20px;

	--ax-transition-fast: 0.2s ease;
	--ax-transition-normal: 0.3s ease;
	--ax-transition-slow: 0.5s ease;

	--ax-sidebar-width: 220px;
	--ax-sidebar-collapsed: 72px;
	--ax-topbar-height: 64px;

	--ax-border-light: 1px solid var(--ax-gray-4);
	--ax-border-input: 1px solid var(--ax-gray-5);
	--ax-border-white-light: 1px solid rgba(255, 255, 255, 0.1);
	--ax-border-white-medium: 1px solid rgba(255, 255, 255, 0.2);
}