:root { --alfa-light: #331d16; --alfa-dark: #CF382A; --bravo-light: #FFC341; --bravo-dark: #8D3327; --charlie-light: #DABEA3; --charlie-dark: #A24E56; --alfa-hover: color-mix(in srgb, var(--alfa-light), black 20%); --bravo-hover: color-mix(in srgb, var(--bravo-dark), black 20%); --charlie-hover: color-mix(in srgb, var(--charlie-light), black 20%); --alfa-switch: var(--alfa-light); --alfa-switch-inv: var(--alfa-dark); --bravo-switch: var(--bravo-light); --bravo-switch-inv: var(--bravo-dark); --charlie-switch: var(--charlie-light); --charlie-switch-inv: var(--charlie-dark); --accent: #FFC341; --light: #f7f7f7; --light-soft: #f5f4f3; --light-grey: color-mix(in srgb, var(--light) 90%, black 10%); --dark: #050505; --dark-soft: color-mix(in srgb, var(--dark) 95%, white 5%); --dark-grey: color-mix(in srgb, var(--dark) 80%, white 20%); --grey: color-mix(in srgb, var(--dark) 60%, white 40%); --day-switch: var(--light); --night-switch: var(--dark); --morning-switch: var(--light-grey); --evening-switch: var(--dark-grey); --light-warm: #FAF6EF; --light-cool: #b5daf2; --dark-warm: #423a3b; --dark-cool: #3a3b42; --warm-switch: var(--light-warm); --cool-switch: var(--light-cool); --positive: hsl(117, 100%, 65%); --positive-soft: color-mix(in srgb, var(--positive), white 85%); --negative: hsl(0, 100%, 65%); --negative-soft: color-mix(in srgb, var(--negative), white 85%); --caution: hsl(46, 100%, 65%); --caution-soft: color-mix(in srgb, var(--caution), white 85%); --information: hsl(200, 100%, 65%); --information-soft: color-mix(in srgb, var(--information), white 85%);}