@import url(https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&display=swap); @import url(https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&display=swap); :root, :host .sl-theme-light { color-scheme: light; --lyst-button-radius: 4; --lyst-heading-font-family: DM Sans,  sans-serif; --lyst-paragraph-font-family: DM Sans,  sans-serif; --danger-100: #FFEDDB; --danger-200: #FFD7B7; --danger-300: #FFBC93; --danger-400: #FFA178; --danger-500: #FF764C; --danger-600: #DB5237; --danger-700: #B73326; --danger-800: #931A18; --danger-900: #7A0E14; --secondary-100: #DBEAFF; --secondary-200: #B8D3FF; --secondary-300: #95BBFF; --secondary-400: #7AA6FF; --secondary-500: #4F83FF; --secondary-600: #3964DB; --secondary-700: #2749B7; --secondary-800: #193293; --secondary-900: #0F217A; --primary-100: #D8F7FE; --primary-200: #B2EBFE; --primary-300: #8BD9FC; --primary-400: #6EC7F9; --primary-500: #3FA9F5; --primary-600: #2E84D2; --primary-700: #1F63B0; --primary-800: #14468E; --primary-900: #0C3175; --success-100: #F1FBCF; --success-200: #E1F8A0; --success-300: #C5EB6E; --success-400: #A6D848; --success-500: #7EBF16; --success-600: #65A410; --success-700: #4E890B; --success-800: #3A6E07; --success-900: #2C5B04; --accent-100: #FFF9CC; --accent-200: #FFF099; --accent-300: #FFE667; --accent-400: #FFDC41; --accent-500: #FFCC02; --accent-600: #DBAA01; --accent-700: #B78B01; --accent-800: #936C00; --accent-900: #7A5700; --basic-100: #FFFFFF; --basic-200: #F7F9FC; --basic-300: #EDF1F7; --basic-400: #E4E9F2; --basic-500: #C5CEE0; --basic-600: #8F9BB3; --basic-700: #2E3A59; --basic-800: #222B45; --basic-900: #1A2138; --basic-1000: #151A30; --basic-1100: #101426; --on-danger-100: var(--basic-1000); --on-danger-200: var(--basic-1000); --on-danger-300: var(--basic-1000); --on-danger-400: var(--basic-1000); --on-danger-500: var(--basic-1000); --on-danger-600: var(--basic-200); --on-danger-700: var(--basic-200); --on-danger-800: var(--basic-200); --on-danger-900: var(--basic-200); --on-secondary-100: var(--basic-1000); --on-secondary-200: var(--basic-1000); --on-secondary-300: var(--basic-1000); --on-secondary-400: var(--basic-1000); --on-secondary-500: var(--basic-1000); --on-secondary-600: var(--basic-200); --on-secondary-700: var(--basic-200); --on-secondary-800: var(--basic-200); --on-secondary-900: var(--basic-200); --on-primary-100: var(--basic-1000); --on-primary-200: var(--basic-1000); --on-primary-300: var(--basic-1000); --on-primary-400: var(--basic-1000); --on-primary-500: var(--basic-1000); --on-primary-600: var(--basic-200); --on-primary-700: var(--basic-200); --on-primary-800: var(--basic-200); --on-primary-900: var(--basic-200); --on-success-100: var(--basic-1000); --on-success-200: var(--basic-1000); --on-success-300: var(--basic-1000); --on-success-400: var(--basic-1000); --on-success-500: var(--basic-1000); --on-success-600: var(--basic-1000); --on-success-700: var(--basic-200); --on-success-800: var(--basic-200); --on-success-900: var(--basic-200); --on-accent-100: var(--basic-1000); --on-accent-200: var(--basic-1000); --on-accent-300: var(--basic-1000); --on-accent-400: var(--basic-1000); --on-accent-500: var(--basic-1000); --on-accent-600: var(--basic-1000); --on-accent-700: var(--basic-1000); --on-accent-800: var(--basic-200); --on-accent-900: var(--basic-200); --on-basic-100: var(--basic-1000); --on-basic-200: var(--basic-1000); --on-basic-300: var(--basic-1000); --on-basic-400: var(--basic-1000); --on-basic-500: var(--basic-1000); --on-basic-600: var(--basic-1000); --on-basic-700: var(--basic-200); --on-basic-800: var(--basic-200); --on-basic-900: var(--basic-200); --on-basic-1000: var(--basic-200); --on-basic-1100: var(--basic-200); --primary-transparent-100: rgba(63, 169, 245, 0.08); --primary-transparent-200: rgba(63, 169, 245, 0.16); --primary-transparent-300: rgba(63, 169, 245, 0.24); --primary-transparent-400: rgba(63, 169, 245, 0.32); --primary-transparent-500: rgba(63, 169, 245, 0.4); --primary-transparent-600: rgba(63, 169, 245, 0.48); --secondary-transparent-100: rgba(79, 131, 255, 0.08); --secondary-transparent-200: rgba(79, 131, 255, 0.16); --secondary-transparent-300: rgba(79, 131, 255, 0.24); --secondary-transparent-400: rgba(79, 131, 255, 0.32); --secondary-transparent-500: rgba(79, 131, 255, 0.4); --secondary-transparent-600: rgba(79, 131, 255, 0.48); --accent-transparent-100: rgba(255, 204, 2, 0.08); --accent-transparent-200: rgba(255, 204, 2, 0.16); --accent-transparent-300: rgba(255, 204, 2, 0.24); --accent-transparent-400: rgba(255, 204, 2, 0.32); --accent-transparent-500: rgba(255, 204, 2, 0.4); --accent-transparent-600: rgba(255, 204, 2, 0.48); --basic-transparent-100: rgba(197, 206, 224, 0.08); --basic-transparent-200: rgba(197, 206, 224, 0.16); --basic-transparent-300: rgba(197, 206, 224, 0.24); --basic-transparent-400: rgba(197, 206, 224, 0.32); --basic-transparent-500: rgba(197, 206, 224, 0.4); --basic-transparent-600: rgba(197, 206, 224, 0.48); --success-transparent-100: rgba(126, 191, 22, 0.08); --success-transparent-200: rgba(126, 191, 22, 0.16); --success-transparent-300: rgba(126, 191, 22, 0.24); --success-transparent-400: rgba(126, 191, 22, 0.32); --success-transparent-500: rgba(126, 191, 22, 0.4); --success-transparent-600: rgba(126, 191, 22, 0.48); --danger-transparent-100: rgba(255, 118, 76, 0.08); --danger-transparent-200: rgba(255, 118, 76, 0.16); --danger-transparent-300: rgba(255, 118, 76, 0.24); --danger-transparent-400: rgba(255, 118, 76, 0.32); --danger-transparent-500: rgba(255, 118, 76, 0.4); --danger-transparent-600: rgba(255, 118, 76, 0.48); --alternate-transparent-100: rgba(255, 255, 255, 0.08); --alternate-transparent-200: rgba(255, 255, 255, 0.16); --alternate-transparent-300: rgba(255, 255, 255, 0.24); --alternate-transparent-400: rgba(255, 255, 255, 0.32); --alternate-transparent-500: rgba(255, 255, 255, 0.4); --alternate-transparent-600: rgba(255, 255, 255, 0.48);  }