:root {
   
   --primary: hsl(24 100% 20%);
   --on-primary: hsl(24 100% 95%);
   --primary-container: hsl(24 100% 80%);
   --on-primary-container: hsl(24 100% 10%);
   
   --secondary: hsl(128 60% 20%);
   --on-secondary: hsl(128 60% 95%);
   --secondary-container: hsl(128 60% 80%);
   --on-secondary-container: hsl(128 60% 10%);
   
   --tertiary: hsl(50 60% 20%);
   --on-tertiary: hsl(50 60% 95%);
   --tertiary-container: hsl(50 60% 80%);
   --on-tertiary-container: hsl(50 60% 10%);
   
   --error: hsl(18 100% 20%);
   --on-error: hsl(18 100% 95%);
   --error-container: hsl(18 100% 80%);
   --on-error-container: hsl(18 100% 10%);

   
   --background: hsl(24 40% 92%);
   --on-background: hsl(24 40% 30%);
   
   --surface: hsl(24 40% 87%);
   --on-surface: hsl(24 40% 7%);
   
   --surface-container: hsl(24 40% 83%);
   --on-surface-container: hsl(24 40% 4%);
   
   --surface-variant: hsl(24 60% 80%);
   --on-surface-variant: hsl(24 60% 10%);
   
   --primary-glass: hsl(24 100% 70% / 0.4);
   --surface-glass: hsl(24 40% 70% / 0.4);
}