:root {
  --effectShadowLightShallow: 0 1px 10px 0 rgb(53 58 62 / 6%), 0 2px 4px 0 rgb(53 58 62 / 8%);
  --effectShadowLightDeep: 0 16px 24px rgb(24 26 28 / 7%), 0 6px 30px rgb(24 26 28 / 6%), 0 8px 10px rgb(24 26 28 / 10%); /* Use for modals, dropdowns, and other components that need to be elevated above the page. */
  --effectShadowDarkShallow: 0 1px 10px 0 rgb(18 24 31 / 60%), 0 2px 4px 0 rgb(18 24 31 / 40%);
  --effectShadowDarkDeep: 0 16px 24px rgb(6 11 16 / 20%), 0 6px 30px rgb(6 11 16 / 30%), 0 8px 10px rgb(6 11 16 / 40%); /* Use for modals, dropdowns, and other components that need to be elevated above the page. */
}