@import url(https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:wght@400;500;700&display=swap); @import url(https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;700&display=swap); :root, :host .sl-theme-light { color-scheme: light; --lyst-button-radius: 12; --lyst-heading-font-family: Bricolage Grotesque, sans-serif; --lyst-paragraph-font-family: Manrope, sans-serif; --primary-100: #e8dfff; --primary-200: #cebcff; --primary-300: #b89aff; --primary-400: #a07ef7; --primary-500: #815ed4; --primary-600: #653fb2; --primary-700: #53289b; --primary-800: #410b85; --primary-900: #29005f; --primary-transparent-100: rgba(129, 94, 212, 0.08); --primary-transparent-200: rgba(129, 94, 212, 0.16); --primary-transparent-300: rgba(129, 94, 212, 0.24); --primary-transparent-400: rgba(129, 94, 212, 0.32); --primary-transparent-500: rgba(129, 94, 212, 0.4); --primary-transparent-600: rgba(129, 94, 212, 0.48);  }