:root{
	/*border-radius*/
	--rd-sm: 6px;
	--rd-md: 10px;
	--rd-lg: 16px;

	/* Spacing scale */
	--sp-sm: 	7px;
	--sp-md: 	11px;
	--sp-lg: 	12px;
	--sp-xl: 	20px;

	/* Typography scale */
	--font-sans: 
    ui-sans-serif, system-ui, -apple-system, 
    Segoe UI, Roboto, Helvetica, Arial, 
    "Apple Color Emoji", "Segoe UI Emoji";
	--fs-sm: 12px;
	--fs-md: 16px; /* default body */
	--fs-lg: 18px;
	--fs-xl: 28px;

	/* Elevation */
	--sh-sm: 0 1px 2px rgba(0,0,0,0.06);
	--sh-md: 0 4px 12px rgba(0,0,0,0.1);
	--sh-lg: 0 10px 24px rgba(0,0,0,0.14);
}

@media (prefers-color-scheme: dark) {
  :root {
    --sh-sm: 0 1px 2px rgba(0,0,0,0.5);
    --sh-md: 0 4px 12px rgba(0,0,0,0.55);
    --sh-lg: 0 10px 24px rgba(0,0,0,0.6);
  }
}