:root {
	/**
	 * Palette
	 */

	--sensei-color-blue-110: #123; /* 17, 34, 51 */
	--sensei-color-blue-100: #142B43; /* 20, 43, 67 */
	--sensei-color-blue-95: #003853; /* 0, 56, 83 */
	--sensei-color-blue-90: #047; /* 0, 68, 119 */
	--sensei-color-blue-80: #06B; /* 0, 102, 187 */
	--sensei-color-blue-70: #0078E4; /* 0, 120, 228 */
	--sensei-color-blue-60: #3680C9; /* 54, 128, 201 */
	--sensei-color-blue-50: #298CEF; /* 41, 140, 239 */
	--sensei-color-blue-40: #5AF; /* 85, 170, 255 */
	--sensei-color-blue-30: #0CF; /* 0, 204, 255 */
	--sensei-color-blue-25: #00DEFE; /* 0, 222, 254 */
	--sensei-color-blue-20: #8CDCFF; /* 140, 220, 255 */
	--sensei-color-blue-15: #AAE4F4; /* 170, 228, 244 */
	--sensei-color-blue-10: #D1ECF4; /* 209, 236, 244 */

	--sensei-color-red: #F44; /* 255, 68, 68 */
	--sensei-color-green: #4F4; /* 68, 255, 68 */
	--sensei-color-orange: #FA0; /* 255, 170, 0 */

	--sensei-color-white: #FFF;
	--sensei-color-black: #000;

	/**
	 * Semantic colors
	 */

	/* Backgrounds / surfaces */
	--sensei-color-canvas: var(--sensei-color-blue-95);
	--sensei-color-surface: var(--sensei-color-blue-100);
	--sensei-color-surface-deep: var(--sensei-color-blue-110);
	--sensei-color-surface-alt: var(--sensei-color-blue-90);
	--sensei-color-surface-accent: var(--sensei-color-blue-80);
	--sensei-color-surface-accent-hover: var(--sensei-color-blue-70);
	--sensei-color-surface-highlight: var(--sensei-color-blue-20);
	--sensei-color-logo: var(--sensei-color-blue-25);

	/* Fields / controls */
	--sensei-color-field: var(--sensei-color-blue-10);
	--sensei-color-field-focus: var(--sensei-color-blue-15);

	/* Text */
	--sensei-color-text: var(--sensei-color-white);
	--sensei-color-text-secondary: var(--sensei-color-blue-10);
	--sensei-color-text-muted: var(--sensei-color-blue-15);
	--sensei-color-text-inverse: var(--sensei-color-blue-100);

	/* Accent / interaction */
	--sensei-color-accent: var(--sensei-color-blue-30);
	--sensei-color-accent-hover: var(--sensei-color-blue-50);
	--sensei-color-accent-muted: var(--sensei-color-blue-40);
	--sensei-color-link: var(--sensei-color-accent);
	--sensei-color-focus: var(--sensei-color-accent);

	/* Borders */
	--sensei-color-border: var(--sensei-color-blue-40);
	--sensei-color-border-muted: var(--sensei-color-blue-60);
	--sensei-color-border-accent: var(--sensei-color-accent);
	--sensei-color-border-contrast: var(--sensei-color-white);

	/* States */
	--sensei-color-success: var(--sensei-color-green);
	--sensei-color-warning: var(--sensei-color-orange);
	--sensei-color-danger: var(--sensei-color-red);

	/* Selection */
	--sensei-color-selection: var(--sensei-color-success);
	--sensei-color-selection-text: var(--sensei-color-text-inverse);
}
