:root {
	--border-radius--base: 5px;

	--font-size--base: 14px;
	--font-size--large: 18px;
	--font-size--x-large: 22px;
	--font-size--xx-large: 26px;

	--font-weight--medium: 500;

	--opacity--selected: 0.2;

	--spacing--x-large: 60px;
	--spacing--large: 30px;
	--spacing--base: 15px;
	--spacing--small: 10px;
	--spacing--x-small: 5px;

	--transition-duration--base: 0.15s;

	--color--primary-red: 255;
	--color--primary-green: 171;
	--color--primary-blue: 5;
	--color--primary: rgb(var(--color--primary-red), var(--color--primary-green), var(--color--primary-blue));
	--color--primary-selected: rgb(var(--color--primary-red), var(--color--primary-green), var(--color--primary-blue), var(--opacity--selected));

	--color--secondary-red: 192;
	--color--secondary-green: 192;
	--color--secondary-blue: 192;
	--color--secondary: rgb(var(--color--secondary-red), var(--color--secondary-green), var(--color--secondary-blue));
	--color--secondary-selected: rgb(var(--color--secondary-red), var(--color--secondary-green), var(--color--secondary-blue), var(--opacity--selected));

	--background-color: #ffffff;
	--foreground-color: #000000;
	--border-color: #d0d0d0;
	--link-color: #3661af;

	--app-background-color: #e0e0e0;
	--app-width: 100vw;
	--app-height: 100vh;
	--app-min-width: 800px;
	--app-min-height: 600px;
	--app-hint-height: 28px;
	--app-hint-shortcut-background-color: rgb(255, 255, 255, 0.5);

	--button-min-width: 28px;
	--button-min-height: 28px;

	--field-min-height: 28px;

	--checkbox-field-size: 20px;

	--canvas-line-color: #000000;
}