ion-header[data-v-4ba061e1] { --background: var(--color-background); --border-color: transparent; position: relative; z-index: 1000; } ion-header ion-toolbar[data-v-4ba061e1]:first-of-type { padding-top: 0 !important; } ion-toolbar[data-v-4ba061e1], ion-toolbar.uf-header__toolbar[data-v-4ba061e1] { --background: linear-gradient(180deg, rgba(0, 0, 0, 0.89) 0%, rgba(0, 0, 0, 0.7) 49.48%, rgba(0, 0, 0, 0) 100%); --background-rgb: var(--uf-header-background-rgb, 0, 0, 0); --border-width: 0; --border-style: none; --border-color: transparent; --padding-top: 0; --padding-bottom: var(--uf-header-padding-bottom, 0); --padding-start: var(--uf-header-padding-start, 0); --padding-end: var(--uf-header-padding-end, 0); min-height: calc(var(--uf-header-min-height, 3em) + env(safe-area-inset-top, 0px)); } .uf-header__toolbar--size-S[data-v-4ba061e1] { --uf-header-min-height: 2.5em; max-height: calc(2.5em + env(safe-area-inset-top, 0px)); } .uf-header__toolbar--size-S ion-buttons[slot=start][data-v-4ba061e1] { padding: 0 0 0.5em 1em; } .uf-header__toolbar--size-S ion-buttons[slot=end][data-v-4ba061e1] { padding: 0 1em 0.5em 0; } .uf-header__toolbar--size-M[data-v-4ba061e1] { --uf-header-min-height: 3em; max-height: calc(3em + env(safe-area-inset-top, 0px)); } .uf-header__toolbar--size-M ion-buttons[slot=start][data-v-4ba061e1] { padding: calc(0.5em + env(safe-area-inset-top, 0px)) 0 0.5em 1em; } .uf-header__toolbar--size-M ion-buttons[slot=end][data-v-4ba061e1] { padding: calc(0.5em + env(safe-area-inset-top, 0px)) 1em 0.5em 0; } .uf-header__toolbar--size-L[data-v-4ba061e1] { --uf-header-min-height: 3.5em; max-height: calc(3.5em + env(safe-area-inset-top, 0px)); } .uf-header__toolbar--size-L ion-buttons[slot=start][data-v-4ba061e1] { padding: calc(0.5em + env(safe-area-inset-top, 0px)) 0 1em 1em; } .uf-header__toolbar--size-L ion-buttons[slot=end][data-v-4ba061e1] { padding: calc(0.5em + env(safe-area-inset-top, 0px)) 1em 1em 0; } ion-buttons[data-v-4ba061e1] { display: flex; align-items: center; gap: 0.5em; } ion-buttons[slot=start][data-v-4ba061e1] { flex: 1 1 auto; min-width: 0; width: 100%; margin-right: 0.5em; } ion-buttons[slot=end][data-v-4ba061e1] { flex-shrink: 0; margin-left: 0.5em; } .uf-header__trail[data-v-4ba061e1] { display: flex; align-items: center; gap: 0.5em; } .uf-header__avatar[data-v-4ba061e1] { display: flex; align-items: center; justify-content: center; width: 2em; height: 2em; border-radius: 9999px; background-color: var(--elevation-0); } .uf-header__text[data-v-4ba061e1] { display: flex; flex-direction: column; justify-content: center; align-items: start; height: 2em; text-transform: uppercase; } .uf-header__avatar-img[data-v-4ba061e1] { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .uf-header__welcome[data-v-4ba061e1] { display: flex; flex-direction: column; justify-content: center; align-items: start; }.uf-icon[data-v-e511cf8a] { display: inline-flex; width: var(--icon-size, 24px); height: var(--icon-size, 24px); color: var(--icon-color, currentColor); } [data-v-e511cf8a] svg { width: 100%; height: 100%; display: block; fill: currentColor; stroke: currentColor; } .uf-icon--size-XS[data-v-e511cf8a] { width: 12px; height: 12px; } .uf-icon--size-S[data-v-e511cf8a] { width: 16px; height: 16px; } .uf-icon--size-M[data-v-e511cf8a] { width: 24px; height: 24px; } .uf-icon--size-L[data-v-e511cf8a] { width: 32px; height: 32px; } .uf-icon--size-XL[data-v-e511cf8a] { width: 48px; height: 48px; }/** * SCSS Variables & CSS Custom Properties * Theme configuration - use these throughout your app */ [data-v-b0de5daf]:root { /* Primary Colors */ --color-primary-900: #1B6AB1; --color-primary-800: #197EDA; --color-primary-700: #208DF0; --color-primary-600: #3DA2FF; --color-primary-500: #5CB2FF; --color-primary-400: #7DC2FF; --color-primary-300: #A5DBFF; --color-primary-200: #BBE4FF; --color-primary-100: #D4EEFF; --color-primary-50: #E7F5FF; /* Secondary Colors */ --color-secondary-900: #101B3E; --color-secondary-800: #17285E; --color-secondary-700: #173E8B; --color-secondary-600: #1C4FB4; --color-secondary-500: #2161E0; --color-secondary-400: #397BFD; --color-secondary-300: #689BFF; --color-secondary-200: #95B9FF; --color-secondary-100: #C8DAFF; --color-secondary-50: #E4EDFF; /* Accent Colors */ --color-accent-900: #7A6D05; --color-accent-800: #AB9805; --color-accent-700: #E4CD1C; --color-accent-600: #FFE51F; --color-accent-500: #FFED68; --color-accent-400: #FFF07E; --color-accent-300: #FFF28C; --color-accent-200: #FFF5AA; --color-accent-100: #FFFAD9; --color-accent-50: #FFFFF2; /* Success Colors */ --color-success-900: #02170D; --color-success-800: #074526; --color-success-700: #0C7440; --color-success-600: #11A259; --color-success-500: #16D072; --color-success-400: #2FE98C; --color-success-300: #5DEEA5; --color-success-200: #8CF3BF; --color-success-100: #BAF8D9; --color-success-50: #E8FDF2; /* Error Colors */ --color-error-900: #500910; --color-error-800: #850F1A; --color-error-700: #A0121F; --color-error-600: #D5182A; --color-error-500: #E93E4F; --color-error-400: #F07884; --color-error-300: #F49FA7; --color-error-200: #F9C5CA; --color-error-100: #FDECED; --color-error-50: #FFFAFA; /* Ionic theme variables (keeps Ionic components aligned with Tailwind palette) */ --ion-font-family: Saira, sans-serif; --ion-background-color: #000000; --ion-background-color-rgb: to-rgb-string(#000000); --ion-text-color: #ffffff; --ion-text-color-rgb: to-rgb-string(#ffffff); --ion-color-primary: #5CB2FF; --ion-color-primary-rgb: to-rgb-string(#5CB2FF); --ion-color-primary-contrast: #FFFFFF; --ion-color-primary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-primary-shade: #3DA2FF; --ion-color-primary-tint: #7DC2FF; --ion-color-secondary: #2161E0; --ion-color-secondary-rgb: to-rgb-string(#2161E0); --ion-color-secondary-contrast: #FFFFFF; --ion-color-secondary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-secondary-shade: #1C4FB4; --ion-color-secondary-tint: #397BFD; --ion-color-tertiary: #FFED68; --ion-color-tertiary-rgb: to-rgb-string(#FFED68); --ion-color-tertiary-contrast: #1C1A22; --ion-color-tertiary-contrast-rgb: to-rgb-string(#1C1A22); --ion-color-tertiary-shade: #E4CD1C; --ion-color-tertiary-tint: #FFF07E; --ion-color-success: #16D072; --ion-color-success-rgb: to-rgb-string(#16D072); --ion-color-success-contrast: #FFFFFF; --ion-color-success-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-success-shade: #11A259; --ion-color-success-tint: #2FE98C; --ion-color-danger: #E93E4F; --ion-color-danger-rgb: to-rgb-string(#E93E4F); --ion-color-danger-contrast: #FFFFFF; --ion-color-danger-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-danger-shade: #D5182A; --ion-color-danger-tint: #F07884; /* Neutral Colors */ --color-neutral-900: #1C1A22; --color-neutral-800: #312F37; --color-neutral-700: #48454F; --color-neutral-600: #605D66; --color-neutral-500: #79757F; --color-neutral-400: #9A96A2; --color-neutral-300: #C9C4CF; --color-neutral-200: #E6E1E6; --color-neutral-100: #F4EFF4; --color-neutral-50: #FFFFFF; /* Legacy color variables for backward compatibility */ --color-primary: #5CB2FF; --color-primary-dark: #208DF0; --color-primary-light: #A5DBFF; --color-secondary: #2161E0; /* Background and text */ --color-background: #000000; --color-surface: #000000; --color-text: #ffffff; --color-text-light: #C9C4CF; /* Spacing */ --spacing-xs: 0.25em; --spacing-sm: 0.5em; --spacing-md: 1em; --spacing-lg: 1.5em; --spacing-xl: 2em; /* Typography */ --font-family: Saira, sans-serif; --font-family-saira: Saira, sans-serif; --font-family-saira-condensed: Saira Condensed, sans-serif; --font-size-xs: 0.75rem; --font-size-sm: 0.875rem; --font-size-md: 1rem; --font-size-lg: 1.125rem; --font-size-xl: 1.25rem; /* Typography System - CSS Custom Properties */ --text-title-1-l-font-size: 2rem; --text-title-1-l-line-height: 2.125rem; --text-title-1-l-font-weight: 700; --text-title-1-l-letter-spacing: -0.0125em; --text-title-1-l-text-transform: none; --text-title-1-m-font-size: 2rem; --text-title-1-m-line-height: 2.125rem; --text-title-1-m-font-weight: 600; --text-title-1-m-letter-spacing: -0.0125em; --text-title-1-m-text-transform: none; --text-title-2-l-font-size: 1.75rem; --text-title-2-l-line-height: 2rem; --text-title-2-l-font-weight: 700; --text-title-2-l-letter-spacing: -0.0125em; --text-title-2-l-text-transform: none; --text-title-2-m-font-size: 1.75rem; --text-title-2-m-line-height: 2rem; --text-title-2-m-font-weight: 600; --text-title-2-m-letter-spacing: -0.0125em; --text-title-2-m-text-transform: none; --text-title-3-l-font-size: 1.625rem; --text-title-3-l-line-height: 1.75rem; --text-title-3-l-font-weight: 700; --text-title-3-l-letter-spacing: 0; --text-title-3-l-text-transform: none; --text-title-3-m-font-size: 1.625rem; --text-title-3-m-line-height: 1.75rem; --text-title-3-m-font-weight: 600; --text-title-3-m-letter-spacing: 0; --text-title-3-m-text-transform: none; --text-title-4-l-font-size: 1.375rem; --text-title-4-l-line-height: 1.5rem; --text-title-4-l-font-weight: 700; --text-title-4-l-letter-spacing: 0; --text-title-4-l-text-transform: none; --text-title-4-m-font-size: 1.375rem; --text-title-4-m-line-height: 1.5rem; --text-title-4-m-font-weight: 600; --text-title-4-m-letter-spacing: 0; --text-title-4-m-text-transform: none; --text-subtitle-1-l-font-size: 1.5rem; --text-subtitle-1-l-line-height: 2rem; --text-subtitle-1-l-font-weight: 700; --text-subtitle-1-l-letter-spacing: -0.01em; --text-subtitle-1-l-text-transform: none; --text-subtitle-1-m-font-size: 1.5rem; --text-subtitle-1-m-line-height: 2rem; --text-subtitle-1-m-font-weight: 600; --text-subtitle-1-m-letter-spacing: -0.01em; --text-subtitle-1-m-text-transform: none; --text-subtitle-2-l-font-size: 1.25rem; --text-subtitle-2-l-line-height: 1.75rem; --text-subtitle-2-l-font-weight: 700; --text-subtitle-2-l-letter-spacing: -0.01em; --text-subtitle-2-l-text-transform: none; --text-subtitle-2-m-font-size: 1.25rem; --text-subtitle-2-m-line-height: 1.75rem; --text-subtitle-2-m-font-weight: 600; --text-subtitle-2-m-letter-spacing: -0.01em; --text-subtitle-2-m-text-transform: none; --text-subtitle-3-l-font-size: 1.125rem; --text-subtitle-3-l-line-height: 1.625rem; --text-subtitle-3-l-font-weight: 700; --text-subtitle-3-l-letter-spacing: -0.01em; --text-subtitle-3-l-text-transform: none; --text-subtitle-3-m-font-size: 1.125rem; --text-subtitle-3-m-line-height: 1.625rem; --text-subtitle-3-m-font-weight: 600; --text-subtitle-3-m-letter-spacing: -0.01em; --text-subtitle-3-m-text-transform: none; --text-subtitle-4-l-font-size: 1rem; --text-subtitle-4-l-line-height: 1.5rem; --text-subtitle-4-l-font-weight: 700; --text-subtitle-4-l-letter-spacing: -0.01em; --text-subtitle-4-l-text-transform: none; --text-subtitle-4-m-font-size: 1rem; --text-subtitle-4-m-line-height: 1.5rem; --text-subtitle-4-m-font-weight: 600; --text-subtitle-4-m-letter-spacing: -0.01em; --text-subtitle-4-m-text-transform: none; --text-label-1-l-font-size: 1.125rem; --text-label-1-l-line-height: 1.375rem; --text-label-1-l-font-weight: 700; --text-label-1-l-letter-spacing: 0.0025em; --text-label-1-l-text-transform: none; --text-label-1-m-font-size: 1.125rem; --text-label-1-m-line-height: 1.375rem; --text-label-1-m-font-weight: 600; --text-label-1-m-letter-spacing: 0.0025em; --text-label-1-m-text-transform: none; --text-label-2-l-font-size: 1rem; --text-label-2-l-line-height: 1.25rem; --text-label-2-l-font-weight: 700; --text-label-2-l-letter-spacing: 0.0025em; --text-label-2-l-text-transform: none; --text-label-2-m-font-size: 1rem; --text-label-2-m-line-height: 1.25rem; --text-label-2-m-font-weight: 600; --text-label-2-m-letter-spacing: 0.0025em; --text-label-2-m-text-transform: none; --text-label-3-l-font-size: 0.875rem; --text-label-3-l-line-height: 1rem; --text-label-3-l-font-weight: 700; --text-label-3-l-letter-spacing: 0.0025em; --text-label-3-l-text-transform: none; --text-label-3-m-font-size: 0.875rem; --text-label-3-m-line-height: 1rem; --text-label-3-m-font-weight: 600; --text-label-3-m-letter-spacing: 0.0025em; --text-label-3-m-text-transform: none; --text-button-1-font-size: 1.25rem; --text-button-1-line-height: 1.5rem; --text-button-1-font-weight: 700; --text-button-1-letter-spacing: 0.005em; --text-button-1-text-transform: none; --text-button-2-font-size: 1.125rem; --text-button-2-line-height: 1.5rem; --text-button-2-font-weight: 700; --text-button-2-letter-spacing: 0.005em; --text-button-2-text-transform: none; --text-button-3-font-size: 1rem; --text-button-3-line-height: 1.45rem; --text-button-3-font-weight: 700; --text-button-3-letter-spacing: 0.005em; --text-button-3-text-transform: none; --text-button-4-font-size: 0.875rem; --text-button-4-line-height: 1rem; --text-button-4-font-weight: 700; --text-button-4-letter-spacing: 0.005em; --text-button-4-text-transform: none; --text-body-1-font-size: 1.25rem; --text-body-1-line-height: 1.5rem; --text-body-1-font-weight: 400; --text-body-1-letter-spacing: 0.005em; --text-body-1-text-transform: none; --text-body-2-font-size: 1.125rem; --text-body-2-line-height: 1.375rem; --text-body-2-font-weight: 400; --text-body-2-letter-spacing: 0.005em; --text-body-2-text-transform: none; --text-body-3-font-size: 1rem; --text-body-3-line-height: 1.25rem; --text-body-3-font-weight: 400; --text-body-3-letter-spacing: 0.005em; --text-body-3-text-transform: none; --text-body-4-font-size: 0.875rem; --text-body-4-line-height: 1.125rem; --text-body-4-font-weight: 400; --text-body-4-letter-spacing: 0.005em; --text-body-4-text-transform: none; --text-overline-1-l-font-size: 0.875rem; --text-overline-1-l-line-height: 1rem; --text-overline-1-l-font-weight: 700; --text-overline-1-l-letter-spacing: 0.05em; --text-overline-1-l-text-transform: uppercase; --text-overline-1-m-font-size: 0.875rem; --text-overline-1-m-line-height: 1rem; --text-overline-1-m-font-weight: 600; --text-overline-1-m-letter-spacing: 0.05em; --text-overline-1-m-text-transform: uppercase; --text-overline-2-l-font-size: 0.75rem; --text-overline-2-l-line-height: 0.875rem; --text-overline-2-l-font-weight: 700; --text-overline-2-l-letter-spacing: 0.05em; --text-overline-2-l-text-transform: uppercase; --text-overline-2-m-font-size: 0.75rem; --text-overline-2-m-line-height: 0.875rem; --text-overline-2-m-font-weight: 600; --text-overline-2-m-letter-spacing: 0.05em; --text-overline-2-m-text-transform: uppercase; --text-caption-1-l-font-size: 1rem; --text-caption-1-l-line-height: 1.25rem; --text-caption-1-l-font-weight: 700; --text-caption-1-l-letter-spacing: -0.01em; --text-caption-1-l-text-transform: none; --text-caption-1-m-font-size: 1rem; --text-caption-1-m-line-height: 1.25rem; --text-caption-1-m-font-weight: 600; --text-caption-1-m-letter-spacing: -0.01em; --text-caption-1-m-text-transform: none; --text-caption-2-l-font-size: 0.875rem; --text-caption-2-l-line-height: 1rem; --text-caption-2-l-font-weight: 700; --text-caption-2-l-letter-spacing: -0.01em; --text-caption-2-l-text-transform: none; --text-caption-2-m-font-size: 0.875rem; --text-caption-2-m-line-height: 1rem; --text-caption-2-m-font-weight: 600; --text-caption-2-m-letter-spacing: -0.01em; --text-caption-2-m-text-transform: none; --text-caption-3-l-font-size: 0.75rem; --text-caption-3-l-line-height: 0.875rem; --text-caption-3-l-font-weight: 700; --text-caption-3-l-letter-spacing: -0.01em; --text-caption-3-l-text-transform: none; --text-caption-3-m-font-size: 0.75rem; --text-caption-3-m-line-height: 0.875rem; --text-caption-3-m-font-weight: 600; --text-caption-3-m-letter-spacing: -0.01em; --text-caption-3-m-text-transform: none; --text-caption-4-l-font-size: 0.625rem; --text-caption-4-l-line-height: 0.625rem; --text-caption-4-l-font-weight: 700; --text-caption-4-l-letter-spacing: -0.01em; --text-caption-4-l-text-transform: none; --text-caption-4-m-font-size: 0.625rem; --text-caption-4-m-line-height: 0.625rem; --text-caption-4-m-font-weight: 600; --text-caption-4-m-letter-spacing: -0.01em; --text-caption-4-m-text-transform: none; /* Breakpoints (for use in media queries) */ --breakpoint-mobile: 1024px; --breakpoint-desktop: 1025px; /* Border radius */ --radius-sm: 0.1875em; --radius-md: 0.5em; --radius-lg: 0.75em; /* Shadows */ --shadow-sm: 0 0.0625em 0.125em rgba(0, 0, 0, 0.05); --shadow-md: 0 0.25em 0.375em rgba(0, 0, 0, 0.1); --shadow-lg: 0 0.625em 0.9375em rgba(0, 0, 0, 0.1); /* MISC Colors */ --color-misc-talent-card: #8DF800; --color-misc-bonus-card: #A641D0; --color-misc-bonus-gradient: linear-gradient(0deg, #21222A 0%, #9143CB 100%); --color-misc-black-fade-0: linear-gradient(0deg, #000000 0%, rgba(9, 14, 23, 0) 100%); --color-misc-black-fade-1: linear-gradient(0deg, #101010 0%, rgba(25, 26, 31, 0) 100%); /* Gradients */ --gradient-primary: linear-gradient(90deg, #0062FF 0%, #001D6D 100%); --gradient-secondary: linear-gradient(90deg, #0C1E54 0%, #0C44A4 100%); --gradient-light: linear-gradient(90deg, #1B6AB1 0%, #7DC2FF 100%); --gradient-accent: linear-gradient(90deg, #FFEE6A 0%, #CD9A17 100%); --gradient-dark: linear-gradient(180deg, #151319 0%, #262930 100%); /* Elevation */ --elevation-0: #000000; --elevation-1: #101010; --elevation-2: #202020; --elevation-3: #282828; --elevation-4: #303030; --elevation-5: #383838; --elevation-6: #404040; /* Card Effects */ --card-effect-base: conic-gradient(from 180deg at 48.5% 50%, #989DA3 -46.16deg, #101012 130.63deg, #9DA2A9 133.38deg, #121214 311.43deg, #989DA3 313.84deg, #101012 490.63deg); --card-effect-bronze: linear-gradient(90deg, #B5947D 0%, #B6937D 6.65%, #FFECE0 8.25%, #F0CAB2 30.69%, #A47C6C 34.31%, #7F5B4A 65.92%, #AC836D 74.36%, #AB836E 91.3%, #8E6958 100%); --card-effect-silverg: linear-gradient(74.17deg, #7A7F81 13.43%, #9EA1A1 26.76%, #979E9D 47.44%, #798082 53.73%, #8E9799 77.78%, #9EA3A5 86.51%, #8A9092 95.7%); --card-effect-gold-1: conic-gradient(from 180deg at 48.5% 50%, #FFEAC2 -46.16deg, #4B2A16 130.63deg, #EAB872 133.38deg, #AE824E 204.46deg, #533018 311.43deg, #FFEAC2 313.84deg, #4B2A16 490.63deg); --card-effect-gold-2: linear-gradient(75.74deg, #C1A875 12.49%, #EAB872 26.21%, #AE824E 47.49%, #C1A875 53.96%, #C1A875 78.71%, #EAB872 87.7%, #C1A875 97.16%); --card-effect-sapphire: conic-gradient(from -1.98deg at 91% 2.08%, #52F9FF 0deg, #68E3FE 26.25deg, #2E9BFF 161.27deg, #52F9FF 176.4deg, #2E9BFF 204.68deg, #52F9FF 255deg, #2E9BFF 309.38deg, #52F9FF 360deg); } .uf-toolbar[data-v-b0de5daf] { width: 100%; } .uf-toolbar__bar[data-v-b0de5daf] { background: var(--elevation-1); opacity: 0.9; position: fixed; bottom: 0; left: 0; right: 0; z-index: 1000; display: flex; align-items: center; padding: 16px 16px 34px 16px; -moz-column-gap: 16px; column-gap: 16px; min-height: 88px; } @media (min-width: 1025px) { .uf-toolbar__bar[data-v-b0de5daf] { display: none; } } .uf-toolbar__button[data-v-b0de5daf] { display: flex; flex-direction: column; align-items: center; justify-content: center; row-gap: 4px; padding: 0 16px; cursor: pointer; color: var(--color-neutral-400); transition: color 0.2s ease; flex: 1; min-width: 0; } .uf-toolbar__button[data-v-b0de5daf]:active { color: var(--color-neutral-50); } .uf-toolbar__button--active[data-v-b0de5daf] { color: var(--color-neutral-50); } .uf-toolbar__button--logout[data-v-b0de5daf] { color: var(--color-error-300); } .uf-toolbar__icon-wrapper[data-v-b0de5daf] { position: relative; display: flex; align-items: center; justify-content: center; } .uf-toolbar__icon[data-v-b0de5daf] { flex-shrink: 0; color: currentColor; } .uf-toolbar__badge[data-v-b0de5daf] { position: absolute; top: 0; right: 0; --background: var(--color-error-600); --color: var(--color-error-600); display: block; width: 8px; height: 8px; min-width: 8px; min-height: 8px; padding: 0; font-size: 0; line-height: 0; border-radius: 50%; } .uf-toolbar__badge[data-v-b0de5daf]::part(native) { display: block; width: 100%; height: 100%; padding: 0; min-width: 8px; min-height: 8px; } .uf-toolbar__label[data-v-b0de5daf] { color: currentColor; }/** * SCSS Variables & CSS Custom Properties * Theme configuration - use these throughout your app */ [data-v-28a2496e]:root { /* Primary Colors */ --color-primary-900: #1B6AB1; --color-primary-800: #197EDA; --color-primary-700: #208DF0; --color-primary-600: #3DA2FF; --color-primary-500: #5CB2FF; --color-primary-400: #7DC2FF; --color-primary-300: #A5DBFF; --color-primary-200: #BBE4FF; --color-primary-100: #D4EEFF; --color-primary-50: #E7F5FF; /* Secondary Colors */ --color-secondary-900: #101B3E; --color-secondary-800: #17285E; --color-secondary-700: #173E8B; --color-secondary-600: #1C4FB4; --color-secondary-500: #2161E0; --color-secondary-400: #397BFD; --color-secondary-300: #689BFF; --color-secondary-200: #95B9FF; --color-secondary-100: #C8DAFF; --color-secondary-50: #E4EDFF; /* Accent Colors */ --color-accent-900: #7A6D05; --color-accent-800: #AB9805; --color-accent-700: #E4CD1C; --color-accent-600: #FFE51F; --color-accent-500: #FFED68; --color-accent-400: #FFF07E; --color-accent-300: #FFF28C; --color-accent-200: #FFF5AA; --color-accent-100: #FFFAD9; --color-accent-50: #FFFFF2; /* Success Colors */ --color-success-900: #02170D; --color-success-800: #074526; --color-success-700: #0C7440; --color-success-600: #11A259; --color-success-500: #16D072; --color-success-400: #2FE98C; --color-success-300: #5DEEA5; --color-success-200: #8CF3BF; --color-success-100: #BAF8D9; --color-success-50: #E8FDF2; /* Error Colors */ --color-error-900: #500910; --color-error-800: #850F1A; --color-error-700: #A0121F; --color-error-600: #D5182A; --color-error-500: #E93E4F; --color-error-400: #F07884; --color-error-300: #F49FA7; --color-error-200: #F9C5CA; --color-error-100: #FDECED; --color-error-50: #FFFAFA; /* Ionic theme variables (keeps Ionic components aligned with Tailwind palette) */ --ion-font-family: Saira, sans-serif; --ion-background-color: #000000; --ion-background-color-rgb: to-rgb-string(#000000); --ion-text-color: #ffffff; --ion-text-color-rgb: to-rgb-string(#ffffff); --ion-color-primary: #5CB2FF; --ion-color-primary-rgb: to-rgb-string(#5CB2FF); --ion-color-primary-contrast: #FFFFFF; --ion-color-primary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-primary-shade: #3DA2FF; --ion-color-primary-tint: #7DC2FF; --ion-color-secondary: #2161E0; --ion-color-secondary-rgb: to-rgb-string(#2161E0); --ion-color-secondary-contrast: #FFFFFF; --ion-color-secondary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-secondary-shade: #1C4FB4; --ion-color-secondary-tint: #397BFD; --ion-color-tertiary: #FFED68; --ion-color-tertiary-rgb: to-rgb-string(#FFED68); --ion-color-tertiary-contrast: #1C1A22; --ion-color-tertiary-contrast-rgb: to-rgb-string(#1C1A22); --ion-color-tertiary-shade: #E4CD1C; --ion-color-tertiary-tint: #FFF07E; --ion-color-success: #16D072; --ion-color-success-rgb: to-rgb-string(#16D072); --ion-color-success-contrast: #FFFFFF; --ion-color-success-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-success-shade: #11A259; --ion-color-success-tint: #2FE98C; --ion-color-danger: #E93E4F; --ion-color-danger-rgb: to-rgb-string(#E93E4F); --ion-color-danger-contrast: #FFFFFF; --ion-color-danger-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-danger-shade: #D5182A; --ion-color-danger-tint: #F07884; /* Neutral Colors */ --color-neutral-900: #1C1A22; --color-neutral-800: #312F37; --color-neutral-700: #48454F; --color-neutral-600: #605D66; --color-neutral-500: #79757F; --color-neutral-400: #9A96A2; --color-neutral-300: #C9C4CF; --color-neutral-200: #E6E1E6; --color-neutral-100: #F4EFF4; --color-neutral-50: #FFFFFF; /* Legacy color variables for backward compatibility */ --color-primary: #5CB2FF; --color-primary-dark: #208DF0; --color-primary-light: #A5DBFF; --color-secondary: #2161E0; /* Background and text */ --color-background: #000000; --color-surface: #000000; --color-text: #ffffff; --color-text-light: #C9C4CF; /* Spacing */ --spacing-xs: 0.25em; --spacing-sm: 0.5em; --spacing-md: 1em; --spacing-lg: 1.5em; --spacing-xl: 2em; /* Typography */ --font-family: Saira, sans-serif; --font-family-saira: Saira, sans-serif; --font-family-saira-condensed: Saira Condensed, sans-serif; --font-size-xs: 0.75rem; --font-size-sm: 0.875rem; --font-size-md: 1rem; --font-size-lg: 1.125rem; --font-size-xl: 1.25rem; /* Typography System - CSS Custom Properties */ --text-title-1-l-font-size: 2rem; --text-title-1-l-line-height: 2.125rem; --text-title-1-l-font-weight: 700; --text-title-1-l-letter-spacing: -0.0125em; --text-title-1-l-text-transform: none; --text-title-1-m-font-size: 2rem; --text-title-1-m-line-height: 2.125rem; --text-title-1-m-font-weight: 600; --text-title-1-m-letter-spacing: -0.0125em; --text-title-1-m-text-transform: none; --text-title-2-l-font-size: 1.75rem; --text-title-2-l-line-height: 2rem; --text-title-2-l-font-weight: 700; --text-title-2-l-letter-spacing: -0.0125em; --text-title-2-l-text-transform: none; --text-title-2-m-font-size: 1.75rem; --text-title-2-m-line-height: 2rem; --text-title-2-m-font-weight: 600; --text-title-2-m-letter-spacing: -0.0125em; --text-title-2-m-text-transform: none; --text-title-3-l-font-size: 1.625rem; --text-title-3-l-line-height: 1.75rem; --text-title-3-l-font-weight: 700; --text-title-3-l-letter-spacing: 0; --text-title-3-l-text-transform: none; --text-title-3-m-font-size: 1.625rem; --text-title-3-m-line-height: 1.75rem; --text-title-3-m-font-weight: 600; --text-title-3-m-letter-spacing: 0; --text-title-3-m-text-transform: none; --text-title-4-l-font-size: 1.375rem; --text-title-4-l-line-height: 1.5rem; --text-title-4-l-font-weight: 700; --text-title-4-l-letter-spacing: 0; --text-title-4-l-text-transform: none; --text-title-4-m-font-size: 1.375rem; --text-title-4-m-line-height: 1.5rem; --text-title-4-m-font-weight: 600; --text-title-4-m-letter-spacing: 0; --text-title-4-m-text-transform: none; --text-subtitle-1-l-font-size: 1.5rem; --text-subtitle-1-l-line-height: 2rem; --text-subtitle-1-l-font-weight: 700; --text-subtitle-1-l-letter-spacing: -0.01em; --text-subtitle-1-l-text-transform: none; --text-subtitle-1-m-font-size: 1.5rem; --text-subtitle-1-m-line-height: 2rem; --text-subtitle-1-m-font-weight: 600; --text-subtitle-1-m-letter-spacing: -0.01em; --text-subtitle-1-m-text-transform: none; --text-subtitle-2-l-font-size: 1.25rem; --text-subtitle-2-l-line-height: 1.75rem; --text-subtitle-2-l-font-weight: 700; --text-subtitle-2-l-letter-spacing: -0.01em; --text-subtitle-2-l-text-transform: none; --text-subtitle-2-m-font-size: 1.25rem; --text-subtitle-2-m-line-height: 1.75rem; --text-subtitle-2-m-font-weight: 600; --text-subtitle-2-m-letter-spacing: -0.01em; --text-subtitle-2-m-text-transform: none; --text-subtitle-3-l-font-size: 1.125rem; --text-subtitle-3-l-line-height: 1.625rem; --text-subtitle-3-l-font-weight: 700; --text-subtitle-3-l-letter-spacing: -0.01em; --text-subtitle-3-l-text-transform: none; --text-subtitle-3-m-font-size: 1.125rem; --text-subtitle-3-m-line-height: 1.625rem; --text-subtitle-3-m-font-weight: 600; --text-subtitle-3-m-letter-spacing: -0.01em; --text-subtitle-3-m-text-transform: none; --text-subtitle-4-l-font-size: 1rem; --text-subtitle-4-l-line-height: 1.5rem; --text-subtitle-4-l-font-weight: 700; --text-subtitle-4-l-letter-spacing: -0.01em; --text-subtitle-4-l-text-transform: none; --text-subtitle-4-m-font-size: 1rem; --text-subtitle-4-m-line-height: 1.5rem; --text-subtitle-4-m-font-weight: 600; --text-subtitle-4-m-letter-spacing: -0.01em; --text-subtitle-4-m-text-transform: none; --text-label-1-l-font-size: 1.125rem; --text-label-1-l-line-height: 1.375rem; --text-label-1-l-font-weight: 700; --text-label-1-l-letter-spacing: 0.0025em; --text-label-1-l-text-transform: none; --text-label-1-m-font-size: 1.125rem; --text-label-1-m-line-height: 1.375rem; --text-label-1-m-font-weight: 600; --text-label-1-m-letter-spacing: 0.0025em; --text-label-1-m-text-transform: none; --text-label-2-l-font-size: 1rem; --text-label-2-l-line-height: 1.25rem; --text-label-2-l-font-weight: 700; --text-label-2-l-letter-spacing: 0.0025em; --text-label-2-l-text-transform: none; --text-label-2-m-font-size: 1rem; --text-label-2-m-line-height: 1.25rem; --text-label-2-m-font-weight: 600; --text-label-2-m-letter-spacing: 0.0025em; --text-label-2-m-text-transform: none; --text-label-3-l-font-size: 0.875rem; --text-label-3-l-line-height: 1rem; --text-label-3-l-font-weight: 700; --text-label-3-l-letter-spacing: 0.0025em; --text-label-3-l-text-transform: none; --text-label-3-m-font-size: 0.875rem; --text-label-3-m-line-height: 1rem; --text-label-3-m-font-weight: 600; --text-label-3-m-letter-spacing: 0.0025em; --text-label-3-m-text-transform: none; --text-button-1-font-size: 1.25rem; --text-button-1-line-height: 1.5rem; --text-button-1-font-weight: 700; --text-button-1-letter-spacing: 0.005em; --text-button-1-text-transform: none; --text-button-2-font-size: 1.125rem; --text-button-2-line-height: 1.5rem; --text-button-2-font-weight: 700; --text-button-2-letter-spacing: 0.005em; --text-button-2-text-transform: none; --text-button-3-font-size: 1rem; --text-button-3-line-height: 1.45rem; --text-button-3-font-weight: 700; --text-button-3-letter-spacing: 0.005em; --text-button-3-text-transform: none; --text-button-4-font-size: 0.875rem; --text-button-4-line-height: 1rem; --text-button-4-font-weight: 700; --text-button-4-letter-spacing: 0.005em; --text-button-4-text-transform: none; --text-body-1-font-size: 1.25rem; --text-body-1-line-height: 1.5rem; --text-body-1-font-weight: 400; --text-body-1-letter-spacing: 0.005em; --text-body-1-text-transform: none; --text-body-2-font-size: 1.125rem; --text-body-2-line-height: 1.375rem; --text-body-2-font-weight: 400; --text-body-2-letter-spacing: 0.005em; --text-body-2-text-transform: none; --text-body-3-font-size: 1rem; --text-body-3-line-height: 1.25rem; --text-body-3-font-weight: 400; --text-body-3-letter-spacing: 0.005em; --text-body-3-text-transform: none; --text-body-4-font-size: 0.875rem; --text-body-4-line-height: 1.125rem; --text-body-4-font-weight: 400; --text-body-4-letter-spacing: 0.005em; --text-body-4-text-transform: none; --text-overline-1-l-font-size: 0.875rem; --text-overline-1-l-line-height: 1rem; --text-overline-1-l-font-weight: 700; --text-overline-1-l-letter-spacing: 0.05em; --text-overline-1-l-text-transform: uppercase; --text-overline-1-m-font-size: 0.875rem; --text-overline-1-m-line-height: 1rem; --text-overline-1-m-font-weight: 600; --text-overline-1-m-letter-spacing: 0.05em; --text-overline-1-m-text-transform: uppercase; --text-overline-2-l-font-size: 0.75rem; --text-overline-2-l-line-height: 0.875rem; --text-overline-2-l-font-weight: 700; --text-overline-2-l-letter-spacing: 0.05em; --text-overline-2-l-text-transform: uppercase; --text-overline-2-m-font-size: 0.75rem; --text-overline-2-m-line-height: 0.875rem; --text-overline-2-m-font-weight: 600; --text-overline-2-m-letter-spacing: 0.05em; --text-overline-2-m-text-transform: uppercase; --text-caption-1-l-font-size: 1rem; --text-caption-1-l-line-height: 1.25rem; --text-caption-1-l-font-weight: 700; --text-caption-1-l-letter-spacing: -0.01em; --text-caption-1-l-text-transform: none; --text-caption-1-m-font-size: 1rem; --text-caption-1-m-line-height: 1.25rem; --text-caption-1-m-font-weight: 600; --text-caption-1-m-letter-spacing: -0.01em; --text-caption-1-m-text-transform: none; --text-caption-2-l-font-size: 0.875rem; --text-caption-2-l-line-height: 1rem; --text-caption-2-l-font-weight: 700; --text-caption-2-l-letter-spacing: -0.01em; --text-caption-2-l-text-transform: none; --text-caption-2-m-font-size: 0.875rem; --text-caption-2-m-line-height: 1rem; --text-caption-2-m-font-weight: 600; --text-caption-2-m-letter-spacing: -0.01em; --text-caption-2-m-text-transform: none; --text-caption-3-l-font-size: 0.75rem; --text-caption-3-l-line-height: 0.875rem; --text-caption-3-l-font-weight: 700; --text-caption-3-l-letter-spacing: -0.01em; --text-caption-3-l-text-transform: none; --text-caption-3-m-font-size: 0.75rem; --text-caption-3-m-line-height: 0.875rem; --text-caption-3-m-font-weight: 600; --text-caption-3-m-letter-spacing: -0.01em; --text-caption-3-m-text-transform: none; --text-caption-4-l-font-size: 0.625rem; --text-caption-4-l-line-height: 0.625rem; --text-caption-4-l-font-weight: 700; --text-caption-4-l-letter-spacing: -0.01em; --text-caption-4-l-text-transform: none; --text-caption-4-m-font-size: 0.625rem; --text-caption-4-m-line-height: 0.625rem; --text-caption-4-m-font-weight: 600; --text-caption-4-m-letter-spacing: -0.01em; --text-caption-4-m-text-transform: none; /* Breakpoints (for use in media queries) */ --breakpoint-mobile: 1024px; --breakpoint-desktop: 1025px; /* Border radius */ --radius-sm: 0.1875em; --radius-md: 0.5em; --radius-lg: 0.75em; /* Shadows */ --shadow-sm: 0 0.0625em 0.125em rgba(0, 0, 0, 0.05); --shadow-md: 0 0.25em 0.375em rgba(0, 0, 0, 0.1); --shadow-lg: 0 0.625em 0.9375em rgba(0, 0, 0, 0.1); /* MISC Colors */ --color-misc-talent-card: #8DF800; --color-misc-bonus-card: #A641D0; --color-misc-bonus-gradient: linear-gradient(0deg, #21222A 0%, #9143CB 100%); --color-misc-black-fade-0: linear-gradient(0deg, #000000 0%, rgba(9, 14, 23, 0) 100%); --color-misc-black-fade-1: linear-gradient(0deg, #101010 0%, rgba(25, 26, 31, 0) 100%); /* Gradients */ --gradient-primary: linear-gradient(90deg, #0062FF 0%, #001D6D 100%); --gradient-secondary: linear-gradient(90deg, #0C1E54 0%, #0C44A4 100%); --gradient-light: linear-gradient(90deg, #1B6AB1 0%, #7DC2FF 100%); --gradient-accent: linear-gradient(90deg, #FFEE6A 0%, #CD9A17 100%); --gradient-dark: linear-gradient(180deg, #151319 0%, #262930 100%); /* Elevation */ --elevation-0: #000000; --elevation-1: #101010; --elevation-2: #202020; --elevation-3: #282828; --elevation-4: #303030; --elevation-5: #383838; --elevation-6: #404040; /* Card Effects */ --card-effect-base: conic-gradient(from 180deg at 48.5% 50%, #989DA3 -46.16deg, #101012 130.63deg, #9DA2A9 133.38deg, #121214 311.43deg, #989DA3 313.84deg, #101012 490.63deg); --card-effect-bronze: linear-gradient(90deg, #B5947D 0%, #B6937D 6.65%, #FFECE0 8.25%, #F0CAB2 30.69%, #A47C6C 34.31%, #7F5B4A 65.92%, #AC836D 74.36%, #AB836E 91.3%, #8E6958 100%); --card-effect-silverg: linear-gradient(74.17deg, #7A7F81 13.43%, #9EA1A1 26.76%, #979E9D 47.44%, #798082 53.73%, #8E9799 77.78%, #9EA3A5 86.51%, #8A9092 95.7%); --card-effect-gold-1: conic-gradient(from 180deg at 48.5% 50%, #FFEAC2 -46.16deg, #4B2A16 130.63deg, #EAB872 133.38deg, #AE824E 204.46deg, #533018 311.43deg, #FFEAC2 313.84deg, #4B2A16 490.63deg); --card-effect-gold-2: linear-gradient(75.74deg, #C1A875 12.49%, #EAB872 26.21%, #AE824E 47.49%, #C1A875 53.96%, #C1A875 78.71%, #EAB872 87.7%, #C1A875 97.16%); --card-effect-sapphire: conic-gradient(from -1.98deg at 91% 2.08%, #52F9FF 0deg, #68E3FE 26.25deg, #2E9BFF 161.27deg, #52F9FF 176.4deg, #2E9BFF 204.68deg, #52F9FF 255deg, #2E9BFF 309.38deg, #52F9FF 360deg); } .uf-sidebar[data-v-28a2496e] { display: none; width: 16rem; min-width: 16rem; flex-shrink: 0; background: var(--elevation-1); border-right: 1px solid var(--elevation-2); z-index: 999; } .uf-sidebar__nav[data-v-28a2496e] { display: flex; flex-direction: column; justify-content: space-between; padding: 1rem 0.75rem; gap: 0.25rem; min-height: 100%; } .uf-sidebar__group[data-v-28a2496e] { display: flex; flex-direction: column; gap: 0.25rem; } .uf-sidebar__group--footer[data-v-28a2496e] { margin-top: auto; } .uf-sidebar__button[data-v-28a2496e] { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem 1rem; cursor: pointer; color: var(--color-neutral-400); transition: color 0.2s ease, background 0.2s ease; border-radius: var(--radius-md); text-align: left; width: 100%; border: none; background: transparent; } .uf-sidebar__button[data-v-28a2496e]:hover:not(:disabled) { color: var(--color-neutral-200); background: var(--elevation-2); } .uf-sidebar__button[data-v-28a2496e]:active:not(:disabled) { color: var(--color-neutral-50); } .uf-sidebar__button--active[data-v-28a2496e] { color: var(--color-neutral-50); background: var(--elevation-3); } .uf-sidebar__button--logout[data-v-28a2496e] { color: var(--color-error-300); } .uf-sidebar__button--logout[data-v-28a2496e]:hover:not(:disabled) { color: var(--color-error-200); } .uf-sidebar__button[data-v-28a2496e]:disabled { opacity: 0.5; cursor: not-allowed; } .uf-sidebar__icon-wrapper[data-v-28a2496e] { position: relative; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .uf-sidebar__icon[data-v-28a2496e] { color: currentColor; } .uf-sidebar__badge[data-v-28a2496e] { position: absolute; top: 0; right: 0; --background: var(--color-error-600); --color: var(--color-error-600); display: block; width: 8px; height: 8px; min-width: 8px; min-height: 8px; padding: 0; font-size: 0; line-height: 0; border-radius: 50%; } .uf-sidebar__badge[data-v-28a2496e]::part(native) { display: block; width: 100%; height: 100%; padding: 0; min-width: 8px; min-height: 8px; } .uf-sidebar__label[data-v-28a2496e] { color: currentColor; } @media (min-width: 1025px) { .uf-sidebar[data-v-28a2496e] { display: block; } }.logo[data-v-5742dbcd] { display: block; -o-object-fit: contain; object-fit: contain; }.animated-splash[data-v-cb58024f] { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: var(--color-background); display: flex; align-items: center; justify-content: center; z-index: 9999; overflow: hidden; } .splash-content[data-v-cb58024f] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3rem; } .logo-container[data-v-cb58024f] { position: relative; } .logo-wrapper[data-v-cb58024f] { animation: logoFadeInScale-cb58024f 1s ease-out,logoPulse-cb58024f 1.5s ease-in-out 1s infinite; transform-origin: center; } @keyframes logoFadeInScale-cb58024f { 0% { opacity: 0; transform: scale(0.5); } 100% { opacity: 1; transform: scale(1); } } @keyframes logoPulse-cb58024f { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } } .loading-indicator[data-v-cb58024f] { display: flex; gap: 0.75rem; align-items: center; } .loading-dot[data-v-cb58024f] { width: 0.75em; height: 0.75em; border-radius: 50%; background-color: rgba(255, 255, 255, 0.9); animation: dotBounce-cb58024f 1.4s ease-in-out infinite; } .loading-dot[data-v-cb58024f]:nth-child(1) { animation-delay: 0s; } .loading-dot[data-v-cb58024f]:nth-child(2) { animation-delay: 0.2s; } .loading-dot[data-v-cb58024f]:nth-child(3) { animation-delay: 0.4s; } @keyframes dotBounce-cb58024f { 0%, 80%, 100% { transform: translateY(0) scale(1); opacity: 0.7; } 40% { transform: translateY(-1.25em) scale(1.1); opacity: 1; } } .splash-fade-leave-active[data-v-cb58024f] { transition: opacity 0.3s ease-out; } .splash-fade-leave-to[data-v-cb58024f] { opacity: 0; }/** * SCSS Variables & CSS Custom Properties * Theme configuration - use these throughout your app */ [data-v-676358cf]:root { /* Primary Colors */ --color-primary-900: #1B6AB1; --color-primary-800: #197EDA; --color-primary-700: #208DF0; --color-primary-600: #3DA2FF; --color-primary-500: #5CB2FF; --color-primary-400: #7DC2FF; --color-primary-300: #A5DBFF; --color-primary-200: #BBE4FF; --color-primary-100: #D4EEFF; --color-primary-50: #E7F5FF; /* Secondary Colors */ --color-secondary-900: #101B3E; --color-secondary-800: #17285E; --color-secondary-700: #173E8B; --color-secondary-600: #1C4FB4; --color-secondary-500: #2161E0; --color-secondary-400: #397BFD; --color-secondary-300: #689BFF; --color-secondary-200: #95B9FF; --color-secondary-100: #C8DAFF; --color-secondary-50: #E4EDFF; /* Accent Colors */ --color-accent-900: #7A6D05; --color-accent-800: #AB9805; --color-accent-700: #E4CD1C; --color-accent-600: #FFE51F; --color-accent-500: #FFED68; --color-accent-400: #FFF07E; --color-accent-300: #FFF28C; --color-accent-200: #FFF5AA; --color-accent-100: #FFFAD9; --color-accent-50: #FFFFF2; /* Success Colors */ --color-success-900: #02170D; --color-success-800: #074526; --color-success-700: #0C7440; --color-success-600: #11A259; --color-success-500: #16D072; --color-success-400: #2FE98C; --color-success-300: #5DEEA5; --color-success-200: #8CF3BF; --color-success-100: #BAF8D9; --color-success-50: #E8FDF2; /* Error Colors */ --color-error-900: #500910; --color-error-800: #850F1A; --color-error-700: #A0121F; --color-error-600: #D5182A; --color-error-500: #E93E4F; --color-error-400: #F07884; --color-error-300: #F49FA7; --color-error-200: #F9C5CA; --color-error-100: #FDECED; --color-error-50: #FFFAFA; /* Ionic theme variables (keeps Ionic components aligned with Tailwind palette) */ --ion-font-family: Saira, sans-serif; --ion-background-color: #000000; --ion-background-color-rgb: to-rgb-string(#000000); --ion-text-color: #ffffff; --ion-text-color-rgb: to-rgb-string(#ffffff); --ion-color-primary: #5CB2FF; --ion-color-primary-rgb: to-rgb-string(#5CB2FF); --ion-color-primary-contrast: #FFFFFF; --ion-color-primary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-primary-shade: #3DA2FF; --ion-color-primary-tint: #7DC2FF; --ion-color-secondary: #2161E0; --ion-color-secondary-rgb: to-rgb-string(#2161E0); --ion-color-secondary-contrast: #FFFFFF; --ion-color-secondary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-secondary-shade: #1C4FB4; --ion-color-secondary-tint: #397BFD; --ion-color-tertiary: #FFED68; --ion-color-tertiary-rgb: to-rgb-string(#FFED68); --ion-color-tertiary-contrast: #1C1A22; --ion-color-tertiary-contrast-rgb: to-rgb-string(#1C1A22); --ion-color-tertiary-shade: #E4CD1C; --ion-color-tertiary-tint: #FFF07E; --ion-color-success: #16D072; --ion-color-success-rgb: to-rgb-string(#16D072); --ion-color-success-contrast: #FFFFFF; --ion-color-success-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-success-shade: #11A259; --ion-color-success-tint: #2FE98C; --ion-color-danger: #E93E4F; --ion-color-danger-rgb: to-rgb-string(#E93E4F); --ion-color-danger-contrast: #FFFFFF; --ion-color-danger-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-danger-shade: #D5182A; --ion-color-danger-tint: #F07884; /* Neutral Colors */ --color-neutral-900: #1C1A22; --color-neutral-800: #312F37; --color-neutral-700: #48454F; --color-neutral-600: #605D66; --color-neutral-500: #79757F; --color-neutral-400: #9A96A2; --color-neutral-300: #C9C4CF; --color-neutral-200: #E6E1E6; --color-neutral-100: #F4EFF4; --color-neutral-50: #FFFFFF; /* Legacy color variables for backward compatibility */ --color-primary: #5CB2FF; --color-primary-dark: #208DF0; --color-primary-light: #A5DBFF; --color-secondary: #2161E0; /* Background and text */ --color-background: #000000; --color-surface: #000000; --color-text: #ffffff; --color-text-light: #C9C4CF; /* Spacing */ --spacing-xs: 0.25em; --spacing-sm: 0.5em; --spacing-md: 1em; --spacing-lg: 1.5em; --spacing-xl: 2em; /* Typography */ --font-family: Saira, sans-serif; --font-family-saira: Saira, sans-serif; --font-family-saira-condensed: Saira Condensed, sans-serif; --font-size-xs: 0.75rem; --font-size-sm: 0.875rem; --font-size-md: 1rem; --font-size-lg: 1.125rem; --font-size-xl: 1.25rem; /* Typography System - CSS Custom Properties */ --text-title-1-l-font-size: 2rem; --text-title-1-l-line-height: 2.125rem; --text-title-1-l-font-weight: 700; --text-title-1-l-letter-spacing: -0.0125em; --text-title-1-l-text-transform: none; --text-title-1-m-font-size: 2rem; --text-title-1-m-line-height: 2.125rem; --text-title-1-m-font-weight: 600; --text-title-1-m-letter-spacing: -0.0125em; --text-title-1-m-text-transform: none; --text-title-2-l-font-size: 1.75rem; --text-title-2-l-line-height: 2rem; --text-title-2-l-font-weight: 700; --text-title-2-l-letter-spacing: -0.0125em; --text-title-2-l-text-transform: none; --text-title-2-m-font-size: 1.75rem; --text-title-2-m-line-height: 2rem; --text-title-2-m-font-weight: 600; --text-title-2-m-letter-spacing: -0.0125em; --text-title-2-m-text-transform: none; --text-title-3-l-font-size: 1.625rem; --text-title-3-l-line-height: 1.75rem; --text-title-3-l-font-weight: 700; --text-title-3-l-letter-spacing: 0; --text-title-3-l-text-transform: none; --text-title-3-m-font-size: 1.625rem; --text-title-3-m-line-height: 1.75rem; --text-title-3-m-font-weight: 600; --text-title-3-m-letter-spacing: 0; --text-title-3-m-text-transform: none; --text-title-4-l-font-size: 1.375rem; --text-title-4-l-line-height: 1.5rem; --text-title-4-l-font-weight: 700; --text-title-4-l-letter-spacing: 0; --text-title-4-l-text-transform: none; --text-title-4-m-font-size: 1.375rem; --text-title-4-m-line-height: 1.5rem; --text-title-4-m-font-weight: 600; --text-title-4-m-letter-spacing: 0; --text-title-4-m-text-transform: none; --text-subtitle-1-l-font-size: 1.5rem; --text-subtitle-1-l-line-height: 2rem; --text-subtitle-1-l-font-weight: 700; --text-subtitle-1-l-letter-spacing: -0.01em; --text-subtitle-1-l-text-transform: none; --text-subtitle-1-m-font-size: 1.5rem; --text-subtitle-1-m-line-height: 2rem; --text-subtitle-1-m-font-weight: 600; --text-subtitle-1-m-letter-spacing: -0.01em; --text-subtitle-1-m-text-transform: none; --text-subtitle-2-l-font-size: 1.25rem; --text-subtitle-2-l-line-height: 1.75rem; --text-subtitle-2-l-font-weight: 700; --text-subtitle-2-l-letter-spacing: -0.01em; --text-subtitle-2-l-text-transform: none; --text-subtitle-2-m-font-size: 1.25rem; --text-subtitle-2-m-line-height: 1.75rem; --text-subtitle-2-m-font-weight: 600; --text-subtitle-2-m-letter-spacing: -0.01em; --text-subtitle-2-m-text-transform: none; --text-subtitle-3-l-font-size: 1.125rem; --text-subtitle-3-l-line-height: 1.625rem; --text-subtitle-3-l-font-weight: 700; --text-subtitle-3-l-letter-spacing: -0.01em; --text-subtitle-3-l-text-transform: none; --text-subtitle-3-m-font-size: 1.125rem; --text-subtitle-3-m-line-height: 1.625rem; --text-subtitle-3-m-font-weight: 600; --text-subtitle-3-m-letter-spacing: -0.01em; --text-subtitle-3-m-text-transform: none; --text-subtitle-4-l-font-size: 1rem; --text-subtitle-4-l-line-height: 1.5rem; --text-subtitle-4-l-font-weight: 700; --text-subtitle-4-l-letter-spacing: -0.01em; --text-subtitle-4-l-text-transform: none; --text-subtitle-4-m-font-size: 1rem; --text-subtitle-4-m-line-height: 1.5rem; --text-subtitle-4-m-font-weight: 600; --text-subtitle-4-m-letter-spacing: -0.01em; --text-subtitle-4-m-text-transform: none; --text-label-1-l-font-size: 1.125rem; --text-label-1-l-line-height: 1.375rem; --text-label-1-l-font-weight: 700; --text-label-1-l-letter-spacing: 0.0025em; --text-label-1-l-text-transform: none; --text-label-1-m-font-size: 1.125rem; --text-label-1-m-line-height: 1.375rem; --text-label-1-m-font-weight: 600; --text-label-1-m-letter-spacing: 0.0025em; --text-label-1-m-text-transform: none; --text-label-2-l-font-size: 1rem; --text-label-2-l-line-height: 1.25rem; --text-label-2-l-font-weight: 700; --text-label-2-l-letter-spacing: 0.0025em; --text-label-2-l-text-transform: none; --text-label-2-m-font-size: 1rem; --text-label-2-m-line-height: 1.25rem; --text-label-2-m-font-weight: 600; --text-label-2-m-letter-spacing: 0.0025em; --text-label-2-m-text-transform: none; --text-label-3-l-font-size: 0.875rem; --text-label-3-l-line-height: 1rem; --text-label-3-l-font-weight: 700; --text-label-3-l-letter-spacing: 0.0025em; --text-label-3-l-text-transform: none; --text-label-3-m-font-size: 0.875rem; --text-label-3-m-line-height: 1rem; --text-label-3-m-font-weight: 600; --text-label-3-m-letter-spacing: 0.0025em; --text-label-3-m-text-transform: none; --text-button-1-font-size: 1.25rem; --text-button-1-line-height: 1.5rem; --text-button-1-font-weight: 700; --text-button-1-letter-spacing: 0.005em; --text-button-1-text-transform: none; --text-button-2-font-size: 1.125rem; --text-button-2-line-height: 1.5rem; --text-button-2-font-weight: 700; --text-button-2-letter-spacing: 0.005em; --text-button-2-text-transform: none; --text-button-3-font-size: 1rem; --text-button-3-line-height: 1.45rem; --text-button-3-font-weight: 700; --text-button-3-letter-spacing: 0.005em; --text-button-3-text-transform: none; --text-button-4-font-size: 0.875rem; --text-button-4-line-height: 1rem; --text-button-4-font-weight: 700; --text-button-4-letter-spacing: 0.005em; --text-button-4-text-transform: none; --text-body-1-font-size: 1.25rem; --text-body-1-line-height: 1.5rem; --text-body-1-font-weight: 400; --text-body-1-letter-spacing: 0.005em; --text-body-1-text-transform: none; --text-body-2-font-size: 1.125rem; --text-body-2-line-height: 1.375rem; --text-body-2-font-weight: 400; --text-body-2-letter-spacing: 0.005em; --text-body-2-text-transform: none; --text-body-3-font-size: 1rem; --text-body-3-line-height: 1.25rem; --text-body-3-font-weight: 400; --text-body-3-letter-spacing: 0.005em; --text-body-3-text-transform: none; --text-body-4-font-size: 0.875rem; --text-body-4-line-height: 1.125rem; --text-body-4-font-weight: 400; --text-body-4-letter-spacing: 0.005em; --text-body-4-text-transform: none; --text-overline-1-l-font-size: 0.875rem; --text-overline-1-l-line-height: 1rem; --text-overline-1-l-font-weight: 700; --text-overline-1-l-letter-spacing: 0.05em; --text-overline-1-l-text-transform: uppercase; --text-overline-1-m-font-size: 0.875rem; --text-overline-1-m-line-height: 1rem; --text-overline-1-m-font-weight: 600; --text-overline-1-m-letter-spacing: 0.05em; --text-overline-1-m-text-transform: uppercase; --text-overline-2-l-font-size: 0.75rem; --text-overline-2-l-line-height: 0.875rem; --text-overline-2-l-font-weight: 700; --text-overline-2-l-letter-spacing: 0.05em; --text-overline-2-l-text-transform: uppercase; --text-overline-2-m-font-size: 0.75rem; --text-overline-2-m-line-height: 0.875rem; --text-overline-2-m-font-weight: 600; --text-overline-2-m-letter-spacing: 0.05em; --text-overline-2-m-text-transform: uppercase; --text-caption-1-l-font-size: 1rem; --text-caption-1-l-line-height: 1.25rem; --text-caption-1-l-font-weight: 700; --text-caption-1-l-letter-spacing: -0.01em; --text-caption-1-l-text-transform: none; --text-caption-1-m-font-size: 1rem; --text-caption-1-m-line-height: 1.25rem; --text-caption-1-m-font-weight: 600; --text-caption-1-m-letter-spacing: -0.01em; --text-caption-1-m-text-transform: none; --text-caption-2-l-font-size: 0.875rem; --text-caption-2-l-line-height: 1rem; --text-caption-2-l-font-weight: 700; --text-caption-2-l-letter-spacing: -0.01em; --text-caption-2-l-text-transform: none; --text-caption-2-m-font-size: 0.875rem; --text-caption-2-m-line-height: 1rem; --text-caption-2-m-font-weight: 600; --text-caption-2-m-letter-spacing: -0.01em; --text-caption-2-m-text-transform: none; --text-caption-3-l-font-size: 0.75rem; --text-caption-3-l-line-height: 0.875rem; --text-caption-3-l-font-weight: 700; --text-caption-3-l-letter-spacing: -0.01em; --text-caption-3-l-text-transform: none; --text-caption-3-m-font-size: 0.75rem; --text-caption-3-m-line-height: 0.875rem; --text-caption-3-m-font-weight: 600; --text-caption-3-m-letter-spacing: -0.01em; --text-caption-3-m-text-transform: none; --text-caption-4-l-font-size: 0.625rem; --text-caption-4-l-line-height: 0.625rem; --text-caption-4-l-font-weight: 700; --text-caption-4-l-letter-spacing: -0.01em; --text-caption-4-l-text-transform: none; --text-caption-4-m-font-size: 0.625rem; --text-caption-4-m-line-height: 0.625rem; --text-caption-4-m-font-weight: 600; --text-caption-4-m-letter-spacing: -0.01em; --text-caption-4-m-text-transform: none; /* Breakpoints (for use in media queries) */ --breakpoint-mobile: 1024px; --breakpoint-desktop: 1025px; /* Border radius */ --radius-sm: 0.1875em; --radius-md: 0.5em; --radius-lg: 0.75em; /* Shadows */ --shadow-sm: 0 0.0625em 0.125em rgba(0, 0, 0, 0.05); --shadow-md: 0 0.25em 0.375em rgba(0, 0, 0, 0.1); --shadow-lg: 0 0.625em 0.9375em rgba(0, 0, 0, 0.1); /* MISC Colors */ --color-misc-talent-card: #8DF800; --color-misc-bonus-card: #A641D0; --color-misc-bonus-gradient: linear-gradient(0deg, #21222A 0%, #9143CB 100%); --color-misc-black-fade-0: linear-gradient(0deg, #000000 0%, rgba(9, 14, 23, 0) 100%); --color-misc-black-fade-1: linear-gradient(0deg, #101010 0%, rgba(25, 26, 31, 0) 100%); /* Gradients */ --gradient-primary: linear-gradient(90deg, #0062FF 0%, #001D6D 100%); --gradient-secondary: linear-gradient(90deg, #0C1E54 0%, #0C44A4 100%); --gradient-light: linear-gradient(90deg, #1B6AB1 0%, #7DC2FF 100%); --gradient-accent: linear-gradient(90deg, #FFEE6A 0%, #CD9A17 100%); --gradient-dark: linear-gradient(180deg, #151319 0%, #262930 100%); /* Elevation */ --elevation-0: #000000; --elevation-1: #101010; --elevation-2: #202020; --elevation-3: #282828; --elevation-4: #303030; --elevation-5: #383838; --elevation-6: #404040; /* Card Effects */ --card-effect-base: conic-gradient(from 180deg at 48.5% 50%, #989DA3 -46.16deg, #101012 130.63deg, #9DA2A9 133.38deg, #121214 311.43deg, #989DA3 313.84deg, #101012 490.63deg); --card-effect-bronze: linear-gradient(90deg, #B5947D 0%, #B6937D 6.65%, #FFECE0 8.25%, #F0CAB2 30.69%, #A47C6C 34.31%, #7F5B4A 65.92%, #AC836D 74.36%, #AB836E 91.3%, #8E6958 100%); --card-effect-silverg: linear-gradient(74.17deg, #7A7F81 13.43%, #9EA1A1 26.76%, #979E9D 47.44%, #798082 53.73%, #8E9799 77.78%, #9EA3A5 86.51%, #8A9092 95.7%); --card-effect-gold-1: conic-gradient(from 180deg at 48.5% 50%, #FFEAC2 -46.16deg, #4B2A16 130.63deg, #EAB872 133.38deg, #AE824E 204.46deg, #533018 311.43deg, #FFEAC2 313.84deg, #4B2A16 490.63deg); --card-effect-gold-2: linear-gradient(75.74deg, #C1A875 12.49%, #EAB872 26.21%, #AE824E 47.49%, #C1A875 53.96%, #C1A875 78.71%, #EAB872 87.7%, #C1A875 97.16%); --card-effect-sapphire: conic-gradient(from -1.98deg at 91% 2.08%, #52F9FF 0deg, #68E3FE 26.25deg, #2E9BFF 161.27deg, #52F9FF 176.4deg, #2E9BFF 204.68deg, #52F9FF 255deg, #2E9BFF 309.38deg, #52F9FF 360deg); } .app-layout[data-v-676358cf] { display: flex; flex-direction: column; width: 100%; min-height: 100vh; background-color: var(--color-background); } .app-layout__main[data-v-676358cf] { flex: 1; display: flex; flex-direction: column; min-width: 0; overflow: hidden; position: relative; } .app-layout__main[data-v-676358cf] ion-router-outlet { flex: 1 1 auto; min-height: 0; width: 100%; position: relative; display: block; } .app-layout__toolbar[data-v-676358cf] { flex-shrink: 0; } @media (min-width: 1025px) { .app-layout[data-v-676358cf] { flex-direction: row; } .app-layout__main[data-v-676358cf] { flex: 1; } .app-layout__toolbar[data-v-676358cf] { display: none; } }/** * SCSS Variables & CSS Custom Properties * Theme configuration - use these throughout your app */ [data-v-481d6635]:root { /* Primary Colors */ --color-primary-900: #1B6AB1; --color-primary-800: #197EDA; --color-primary-700: #208DF0; --color-primary-600: #3DA2FF; --color-primary-500: #5CB2FF; --color-primary-400: #7DC2FF; --color-primary-300: #A5DBFF; --color-primary-200: #BBE4FF; --color-primary-100: #D4EEFF; --color-primary-50: #E7F5FF; /* Secondary Colors */ --color-secondary-900: #101B3E; --color-secondary-800: #17285E; --color-secondary-700: #173E8B; --color-secondary-600: #1C4FB4; --color-secondary-500: #2161E0; --color-secondary-400: #397BFD; --color-secondary-300: #689BFF; --color-secondary-200: #95B9FF; --color-secondary-100: #C8DAFF; --color-secondary-50: #E4EDFF; /* Accent Colors */ --color-accent-900: #7A6D05; --color-accent-800: #AB9805; --color-accent-700: #E4CD1C; --color-accent-600: #FFE51F; --color-accent-500: #FFED68; --color-accent-400: #FFF07E; --color-accent-300: #FFF28C; --color-accent-200: #FFF5AA; --color-accent-100: #FFFAD9; --color-accent-50: #FFFFF2; /* Success Colors */ --color-success-900: #02170D; --color-success-800: #074526; --color-success-700: #0C7440; --color-success-600: #11A259; --color-success-500: #16D072; --color-success-400: #2FE98C; --color-success-300: #5DEEA5; --color-success-200: #8CF3BF; --color-success-100: #BAF8D9; --color-success-50: #E8FDF2; /* Error Colors */ --color-error-900: #500910; --color-error-800: #850F1A; --color-error-700: #A0121F; --color-error-600: #D5182A; --color-error-500: #E93E4F; --color-error-400: #F07884; --color-error-300: #F49FA7; --color-error-200: #F9C5CA; --color-error-100: #FDECED; --color-error-50: #FFFAFA; /* Ionic theme variables (keeps Ionic components aligned with Tailwind palette) */ --ion-font-family: Saira, sans-serif; --ion-background-color: #000000; --ion-background-color-rgb: to-rgb-string(#000000); --ion-text-color: #ffffff; --ion-text-color-rgb: to-rgb-string(#ffffff); --ion-color-primary: #5CB2FF; --ion-color-primary-rgb: to-rgb-string(#5CB2FF); --ion-color-primary-contrast: #FFFFFF; --ion-color-primary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-primary-shade: #3DA2FF; --ion-color-primary-tint: #7DC2FF; --ion-color-secondary: #2161E0; --ion-color-secondary-rgb: to-rgb-string(#2161E0); --ion-color-secondary-contrast: #FFFFFF; --ion-color-secondary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-secondary-shade: #1C4FB4; --ion-color-secondary-tint: #397BFD; --ion-color-tertiary: #FFED68; --ion-color-tertiary-rgb: to-rgb-string(#FFED68); --ion-color-tertiary-contrast: #1C1A22; --ion-color-tertiary-contrast-rgb: to-rgb-string(#1C1A22); --ion-color-tertiary-shade: #E4CD1C; --ion-color-tertiary-tint: #FFF07E; --ion-color-success: #16D072; --ion-color-success-rgb: to-rgb-string(#16D072); --ion-color-success-contrast: #FFFFFF; --ion-color-success-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-success-shade: #11A259; --ion-color-success-tint: #2FE98C; --ion-color-danger: #E93E4F; --ion-color-danger-rgb: to-rgb-string(#E93E4F); --ion-color-danger-contrast: #FFFFFF; --ion-color-danger-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-danger-shade: #D5182A; --ion-color-danger-tint: #F07884; /* Neutral Colors */ --color-neutral-900: #1C1A22; --color-neutral-800: #312F37; --color-neutral-700: #48454F; --color-neutral-600: #605D66; --color-neutral-500: #79757F; --color-neutral-400: #9A96A2; --color-neutral-300: #C9C4CF; --color-neutral-200: #E6E1E6; --color-neutral-100: #F4EFF4; --color-neutral-50: #FFFFFF; /* Legacy color variables for backward compatibility */ --color-primary: #5CB2FF; --color-primary-dark: #208DF0; --color-primary-light: #A5DBFF; --color-secondary: #2161E0; /* Background and text */ --color-background: #000000; --color-surface: #000000; --color-text: #ffffff; --color-text-light: #C9C4CF; /* Spacing */ --spacing-xs: 0.25em; --spacing-sm: 0.5em; --spacing-md: 1em; --spacing-lg: 1.5em; --spacing-xl: 2em; /* Typography */ --font-family: Saira, sans-serif; --font-family-saira: Saira, sans-serif; --font-family-saira-condensed: Saira Condensed, sans-serif; --font-size-xs: 0.75rem; --font-size-sm: 0.875rem; --font-size-md: 1rem; --font-size-lg: 1.125rem; --font-size-xl: 1.25rem; /* Typography System - CSS Custom Properties */ --text-title-1-l-font-size: 2rem; --text-title-1-l-line-height: 2.125rem; --text-title-1-l-font-weight: 700; --text-title-1-l-letter-spacing: -0.0125em; --text-title-1-l-text-transform: none; --text-title-1-m-font-size: 2rem; --text-title-1-m-line-height: 2.125rem; --text-title-1-m-font-weight: 600; --text-title-1-m-letter-spacing: -0.0125em; --text-title-1-m-text-transform: none; --text-title-2-l-font-size: 1.75rem; --text-title-2-l-line-height: 2rem; --text-title-2-l-font-weight: 700; --text-title-2-l-letter-spacing: -0.0125em; --text-title-2-l-text-transform: none; --text-title-2-m-font-size: 1.75rem; --text-title-2-m-line-height: 2rem; --text-title-2-m-font-weight: 600; --text-title-2-m-letter-spacing: -0.0125em; --text-title-2-m-text-transform: none; --text-title-3-l-font-size: 1.625rem; --text-title-3-l-line-height: 1.75rem; --text-title-3-l-font-weight: 700; --text-title-3-l-letter-spacing: 0; --text-title-3-l-text-transform: none; --text-title-3-m-font-size: 1.625rem; --text-title-3-m-line-height: 1.75rem; --text-title-3-m-font-weight: 600; --text-title-3-m-letter-spacing: 0; --text-title-3-m-text-transform: none; --text-title-4-l-font-size: 1.375rem; --text-title-4-l-line-height: 1.5rem; --text-title-4-l-font-weight: 700; --text-title-4-l-letter-spacing: 0; --text-title-4-l-text-transform: none; --text-title-4-m-font-size: 1.375rem; --text-title-4-m-line-height: 1.5rem; --text-title-4-m-font-weight: 600; --text-title-4-m-letter-spacing: 0; --text-title-4-m-text-transform: none; --text-subtitle-1-l-font-size: 1.5rem; --text-subtitle-1-l-line-height: 2rem; --text-subtitle-1-l-font-weight: 700; --text-subtitle-1-l-letter-spacing: -0.01em; --text-subtitle-1-l-text-transform: none; --text-subtitle-1-m-font-size: 1.5rem; --text-subtitle-1-m-line-height: 2rem; --text-subtitle-1-m-font-weight: 600; --text-subtitle-1-m-letter-spacing: -0.01em; --text-subtitle-1-m-text-transform: none; --text-subtitle-2-l-font-size: 1.25rem; --text-subtitle-2-l-line-height: 1.75rem; --text-subtitle-2-l-font-weight: 700; --text-subtitle-2-l-letter-spacing: -0.01em; --text-subtitle-2-l-text-transform: none; --text-subtitle-2-m-font-size: 1.25rem; --text-subtitle-2-m-line-height: 1.75rem; --text-subtitle-2-m-font-weight: 600; --text-subtitle-2-m-letter-spacing: -0.01em; --text-subtitle-2-m-text-transform: none; --text-subtitle-3-l-font-size: 1.125rem; --text-subtitle-3-l-line-height: 1.625rem; --text-subtitle-3-l-font-weight: 700; --text-subtitle-3-l-letter-spacing: -0.01em; --text-subtitle-3-l-text-transform: none; --text-subtitle-3-m-font-size: 1.125rem; --text-subtitle-3-m-line-height: 1.625rem; --text-subtitle-3-m-font-weight: 600; --text-subtitle-3-m-letter-spacing: -0.01em; --text-subtitle-3-m-text-transform: none; --text-subtitle-4-l-font-size: 1rem; --text-subtitle-4-l-line-height: 1.5rem; --text-subtitle-4-l-font-weight: 700; --text-subtitle-4-l-letter-spacing: -0.01em; --text-subtitle-4-l-text-transform: none; --text-subtitle-4-m-font-size: 1rem; --text-subtitle-4-m-line-height: 1.5rem; --text-subtitle-4-m-font-weight: 600; --text-subtitle-4-m-letter-spacing: -0.01em; --text-subtitle-4-m-text-transform: none; --text-label-1-l-font-size: 1.125rem; --text-label-1-l-line-height: 1.375rem; --text-label-1-l-font-weight: 700; --text-label-1-l-letter-spacing: 0.0025em; --text-label-1-l-text-transform: none; --text-label-1-m-font-size: 1.125rem; --text-label-1-m-line-height: 1.375rem; --text-label-1-m-font-weight: 600; --text-label-1-m-letter-spacing: 0.0025em; --text-label-1-m-text-transform: none; --text-label-2-l-font-size: 1rem; --text-label-2-l-line-height: 1.25rem; --text-label-2-l-font-weight: 700; --text-label-2-l-letter-spacing: 0.0025em; --text-label-2-l-text-transform: none; --text-label-2-m-font-size: 1rem; --text-label-2-m-line-height: 1.25rem; --text-label-2-m-font-weight: 600; --text-label-2-m-letter-spacing: 0.0025em; --text-label-2-m-text-transform: none; --text-label-3-l-font-size: 0.875rem; --text-label-3-l-line-height: 1rem; --text-label-3-l-font-weight: 700; --text-label-3-l-letter-spacing: 0.0025em; --text-label-3-l-text-transform: none; --text-label-3-m-font-size: 0.875rem; --text-label-3-m-line-height: 1rem; --text-label-3-m-font-weight: 600; --text-label-3-m-letter-spacing: 0.0025em; --text-label-3-m-text-transform: none; --text-button-1-font-size: 1.25rem; --text-button-1-line-height: 1.5rem; --text-button-1-font-weight: 700; --text-button-1-letter-spacing: 0.005em; --text-button-1-text-transform: none; --text-button-2-font-size: 1.125rem; --text-button-2-line-height: 1.5rem; --text-button-2-font-weight: 700; --text-button-2-letter-spacing: 0.005em; --text-button-2-text-transform: none; --text-button-3-font-size: 1rem; --text-button-3-line-height: 1.45rem; --text-button-3-font-weight: 700; --text-button-3-letter-spacing: 0.005em; --text-button-3-text-transform: none; --text-button-4-font-size: 0.875rem; --text-button-4-line-height: 1rem; --text-button-4-font-weight: 700; --text-button-4-letter-spacing: 0.005em; --text-button-4-text-transform: none; --text-body-1-font-size: 1.25rem; --text-body-1-line-height: 1.5rem; --text-body-1-font-weight: 400; --text-body-1-letter-spacing: 0.005em; --text-body-1-text-transform: none; --text-body-2-font-size: 1.125rem; --text-body-2-line-height: 1.375rem; --text-body-2-font-weight: 400; --text-body-2-letter-spacing: 0.005em; --text-body-2-text-transform: none; --text-body-3-font-size: 1rem; --text-body-3-line-height: 1.25rem; --text-body-3-font-weight: 400; --text-body-3-letter-spacing: 0.005em; --text-body-3-text-transform: none; --text-body-4-font-size: 0.875rem; --text-body-4-line-height: 1.125rem; --text-body-4-font-weight: 400; --text-body-4-letter-spacing: 0.005em; --text-body-4-text-transform: none; --text-overline-1-l-font-size: 0.875rem; --text-overline-1-l-line-height: 1rem; --text-overline-1-l-font-weight: 700; --text-overline-1-l-letter-spacing: 0.05em; --text-overline-1-l-text-transform: uppercase; --text-overline-1-m-font-size: 0.875rem; --text-overline-1-m-line-height: 1rem; --text-overline-1-m-font-weight: 600; --text-overline-1-m-letter-spacing: 0.05em; --text-overline-1-m-text-transform: uppercase; --text-overline-2-l-font-size: 0.75rem; --text-overline-2-l-line-height: 0.875rem; --text-overline-2-l-font-weight: 700; --text-overline-2-l-letter-spacing: 0.05em; --text-overline-2-l-text-transform: uppercase; --text-overline-2-m-font-size: 0.75rem; --text-overline-2-m-line-height: 0.875rem; --text-overline-2-m-font-weight: 600; --text-overline-2-m-letter-spacing: 0.05em; --text-overline-2-m-text-transform: uppercase; --text-caption-1-l-font-size: 1rem; --text-caption-1-l-line-height: 1.25rem; --text-caption-1-l-font-weight: 700; --text-caption-1-l-letter-spacing: -0.01em; --text-caption-1-l-text-transform: none; --text-caption-1-m-font-size: 1rem; --text-caption-1-m-line-height: 1.25rem; --text-caption-1-m-font-weight: 600; --text-caption-1-m-letter-spacing: -0.01em; --text-caption-1-m-text-transform: none; --text-caption-2-l-font-size: 0.875rem; --text-caption-2-l-line-height: 1rem; --text-caption-2-l-font-weight: 700; --text-caption-2-l-letter-spacing: -0.01em; --text-caption-2-l-text-transform: none; --text-caption-2-m-font-size: 0.875rem; --text-caption-2-m-line-height: 1rem; --text-caption-2-m-font-weight: 600; --text-caption-2-m-letter-spacing: -0.01em; --text-caption-2-m-text-transform: none; --text-caption-3-l-font-size: 0.75rem; --text-caption-3-l-line-height: 0.875rem; --text-caption-3-l-font-weight: 700; --text-caption-3-l-letter-spacing: -0.01em; --text-caption-3-l-text-transform: none; --text-caption-3-m-font-size: 0.75rem; --text-caption-3-m-line-height: 0.875rem; --text-caption-3-m-font-weight: 600; --text-caption-3-m-letter-spacing: -0.01em; --text-caption-3-m-text-transform: none; --text-caption-4-l-font-size: 0.625rem; --text-caption-4-l-line-height: 0.625rem; --text-caption-4-l-font-weight: 700; --text-caption-4-l-letter-spacing: -0.01em; --text-caption-4-l-text-transform: none; --text-caption-4-m-font-size: 0.625rem; --text-caption-4-m-line-height: 0.625rem; --text-caption-4-m-font-weight: 600; --text-caption-4-m-letter-spacing: -0.01em; --text-caption-4-m-text-transform: none; /* Breakpoints (for use in media queries) */ --breakpoint-mobile: 1024px; --breakpoint-desktop: 1025px; /* Border radius */ --radius-sm: 0.1875em; --radius-md: 0.5em; --radius-lg: 0.75em; /* Shadows */ --shadow-sm: 0 0.0625em 0.125em rgba(0, 0, 0, 0.05); --shadow-md: 0 0.25em 0.375em rgba(0, 0, 0, 0.1); --shadow-lg: 0 0.625em 0.9375em rgba(0, 0, 0, 0.1); /* MISC Colors */ --color-misc-talent-card: #8DF800; --color-misc-bonus-card: #A641D0; --color-misc-bonus-gradient: linear-gradient(0deg, #21222A 0%, #9143CB 100%); --color-misc-black-fade-0: linear-gradient(0deg, #000000 0%, rgba(9, 14, 23, 0) 100%); --color-misc-black-fade-1: linear-gradient(0deg, #101010 0%, rgba(25, 26, 31, 0) 100%); /* Gradients */ --gradient-primary: linear-gradient(90deg, #0062FF 0%, #001D6D 100%); --gradient-secondary: linear-gradient(90deg, #0C1E54 0%, #0C44A4 100%); --gradient-light: linear-gradient(90deg, #1B6AB1 0%, #7DC2FF 100%); --gradient-accent: linear-gradient(90deg, #FFEE6A 0%, #CD9A17 100%); --gradient-dark: linear-gradient(180deg, #151319 0%, #262930 100%); /* Elevation */ --elevation-0: #000000; --elevation-1: #101010; --elevation-2: #202020; --elevation-3: #282828; --elevation-4: #303030; --elevation-5: #383838; --elevation-6: #404040; /* Card Effects */ --card-effect-base: conic-gradient(from 180deg at 48.5% 50%, #989DA3 -46.16deg, #101012 130.63deg, #9DA2A9 133.38deg, #121214 311.43deg, #989DA3 313.84deg, #101012 490.63deg); --card-effect-bronze: linear-gradient(90deg, #B5947D 0%, #B6937D 6.65%, #FFECE0 8.25%, #F0CAB2 30.69%, #A47C6C 34.31%, #7F5B4A 65.92%, #AC836D 74.36%, #AB836E 91.3%, #8E6958 100%); --card-effect-silverg: linear-gradient(74.17deg, #7A7F81 13.43%, #9EA1A1 26.76%, #979E9D 47.44%, #798082 53.73%, #8E9799 77.78%, #9EA3A5 86.51%, #8A9092 95.7%); --card-effect-gold-1: conic-gradient(from 180deg at 48.5% 50%, #FFEAC2 -46.16deg, #4B2A16 130.63deg, #EAB872 133.38deg, #AE824E 204.46deg, #533018 311.43deg, #FFEAC2 313.84deg, #4B2A16 490.63deg); --card-effect-gold-2: linear-gradient(75.74deg, #C1A875 12.49%, #EAB872 26.21%, #AE824E 47.49%, #C1A875 53.96%, #C1A875 78.71%, #EAB872 87.7%, #C1A875 97.16%); --card-effect-sapphire: conic-gradient(from -1.98deg at 91% 2.08%, #52F9FF 0deg, #68E3FE 26.25deg, #2E9BFF 161.27deg, #52F9FF 176.4deg, #2E9BFF 204.68deg, #52F9FF 255deg, #2E9BFF 309.38deg, #52F9FF 360deg); } .uf-shell__content[data-v-481d6635] { --background: var(--color-background); --padding-top: env(safe-area-inset-top, 0px); padding-bottom: 0; } @media (max-width: 1024px) { .uf-shell__content[data-v-481d6635] { padding-bottom: 6.25em; } } .uf-shell__content[data-v-481d6635]::part(scroll) { padding-top: env(safe-area-inset-top, 0px); }ion-button[data-v-5a46489d] { --background: transparent; --background-activated: transparent; --background-focused: transparent; --background-hover: transparent; --border-radius: 9999px; --box-shadow: none; --ripple-color: transparent; letter-spacing: inherit; font-weight: inherit; text-transform: none; height: auto; min-height: auto; margin: 0; } ion-button[data-v-5a46489d]::part(native) { padding: 0; margin: 0; border: none; background: transparent; } .uf-button[data-v-5a46489d] { --btn-bg: transparent; --btn-color: var(--color-neutral-50); --btn-border: transparent; display: inline-flex; cursor: pointer; align-items: center; justify-content: center; border-radius: 9999px; font-weight: 500; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; background: var(--btn-bg); color: var(--btn-color); } .uf-button[data-v-5a46489d]::part(native) { display: inline-flex; cursor: pointer; align-items: center; justify-content: center; border-radius: 9999px; font-weight: 500; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; border-radius: inherit; } .uf-button[data-v-5a46489d]:hover:not(:disabled) { opacity: 0.9; } .uf-button[data-v-5a46489d]:hover:not(:disabled)::part(native) { opacity: 0.9; } .uf-button.button-disabled,.uf-button[aria-disabled='true'] { --btn-bg: var(--elevation-4); --btn-color: var(--color-neutral-600); --btn-border: transparent; opacity: 1; cursor: not-allowed; } .uf-button.button-disabled,.uf-button[aria-disabled='true'] { background: var(--elevation-4); background-color: var(--elevation-4); color: var(--color-neutral-600); border-color: transparent; opacity: 1; cursor: not-allowed; } .uf-button--size-L[data-v-5a46489d] { padding: 12px 24px; font-size: var(--text-button-2-font-size); line-height: var(--text-button-2-line-height); font-weight: var(--text-button-2-font-weight); letter-spacing: var(--text-button-2-letter-spacing); text-transform: var(--text-button-2-text-transform); font-family: var(--font-family); } .uf-button--size-L .uf-button__icon--left[data-v-5a46489d] { margin-right: 0.5rem; } .uf-button--size-L .uf-button__icon--right[data-v-5a46489d] { margin-left: 0.5rem; } .uf-button--size-L[data-v-5a46489d]::part(native) { font-size: var(--text-button-2-font-size); line-height: var(--text-button-2-line-height); font-weight: var(--text-button-2-font-weight); letter-spacing: var(--text-button-2-letter-spacing); text-transform: var(--text-button-2-text-transform); font-family: var(--font-family); } .uf-button--size-M[data-v-5a46489d] { padding: 8px 16px; font-size: var(--text-button-3-font-size); line-height: var(--text-button-3-line-height); font-weight: var(--text-button-3-font-weight); letter-spacing: var(--text-button-3-letter-spacing); text-transform: var(--text-button-3-text-transform); font-family: var(--font-family); } .uf-button--size-M .uf-button__icon--left[data-v-5a46489d] { margin-right: 0.25rem; } .uf-button--size-M .uf-button__icon--right[data-v-5a46489d] { margin-left: 0.25rem; } .uf-button--size-M[data-v-5a46489d]::part(native) { font-size: var(--text-button-3-font-size); line-height: var(--text-button-3-line-height); font-weight: var(--text-button-3-font-weight); letter-spacing: var(--text-button-3-letter-spacing); text-transform: var(--text-button-3-text-transform); font-family: var(--font-family); } .uf-button--size-S[data-v-5a46489d] { padding: 8px 16px; font-size: var(--text-button-4-font-size); line-height: var(--text-button-4-line-height); font-weight: var(--text-button-4-font-weight); letter-spacing: var(--text-button-4-letter-spacing); text-transform: var(--text-button-4-text-transform); font-family: var(--font-family); } .uf-button--size-S .uf-button__icon--left[data-v-5a46489d] { margin-right: 0.125rem; } .uf-button--size-S .uf-button__icon--right[data-v-5a46489d] { margin-left: 0.125rem; } .uf-button--size-S[data-v-5a46489d]::part(native) { font-size: var(--text-button-4-font-size); line-height: var(--text-button-4-line-height); font-weight: var(--text-button-4-font-weight); letter-spacing: var(--text-button-4-letter-spacing); text-transform: var(--text-button-4-text-transform); font-family: var(--font-family); } /* Primary styles */ .uf-button--type-primary.uf-button--style-filled[data-v-5a46489d] { --btn-bg: var(--color-primary-900); --btn-color: var(--color-accent-50); --btn-border: transparent; } .uf-button--type-primary.uf-button--style-gradient[data-v-5a46489d] { --btn-bg: linear-gradient(to right, var(--color-primary), #0F4679); --btn-color: var(--color-neutral-50); --btn-border: transparent; } .uf-button--type-primary.uf-button--style-ghost[data-v-5a46489d] { --btn-bg: var(--elevation-3); --btn-color: var(--color-primary-400); --btn-border: transparent; } .uf-button--type-primary.uf-button--style-link[data-v-5a46489d] { --btn-bg: transparent; --btn-color: var(--color-primary-200); --btn-border: transparent; } /* Secondary styles */ .uf-button--type-secondary.uf-button--style-filled[data-v-5a46489d] { --btn-bg: var(--color-secondary-700); --btn-color: var(--color-neutral-50); --btn-border: transparent; } .uf-button--type-secondary.uf-button--style-gradient[data-v-5a46489d] { --btn-bg: var(--gradient-secondary); --btn-color: var(--color-neutral-50); --btn-border: transparent; } /* Success styles */ .uf-button--type-success.uf-button--style-filled[data-v-5a46489d] { --btn-bg: var(--color-success-600); --btn-color: var(--color-neutral-50); --btn-border: transparent; } /* Error styles */ .uf-button--type-error.uf-button--style-filled[data-v-5a46489d] { --btn-bg: var(--color-error-400); --btn-color: var(--color-error-800); --btn-border: transparent; } .uf-button__label[data-v-5a46489d] { order: 0; } .uf-button__icon[data-v-5a46489d] { display: inline-flex; align-items: center; justify-content: center; line-height: 1; color: currentColor; flex-shrink: 0; } .uf-button__icon-img[data-v-5a46489d] { width: 1em; height: 1em; display: block; -o-object-fit: contain; object-fit: contain; } .uf-button__icon--left[data-v-5a46489d] { order: -1; } .uf-button__icon--right[data-v-5a46489d] { order: 1; } .uf-input[data-v-1e5c716d] { width: 100%; } .uf-input-label[data-v-1e5c716d] { display: flex; align-items: center; gap: 0.25rem; margin-bottom: 0.25em; transition: all 0.2s ease-in-out; color: var(--color-neutral-50); } .uf-input-label-text[data-v-1e5c716d] { display: inline-block; } .uf-input-label-required[data-v-1e5c716d] { color: var(--color-error-500); font-weight: 600; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .uf-input-label-optional[data-v-1e5c716d] { color: var(--color-neutral-400); } .uf-input-label-help[data-v-1e5c716d] { display: inline-flex; align-items: center; justify-content: center; width: 0.875em; height: 0.875em; color: var(--color-neutral-300); font-size: 0.75em; font-weight: 600; line-height: 1; cursor: help; -webkit-user-select: none; -moz-user-select: none; user-select: none; transition: all 0.2s ease-in-out; } .uf-input-label-help[data-v-1e5c716d]:hover { background-color: var(--color-primary-200); color: var(--color-primary-700); } .uf-input-field[data-v-1e5c716d] { position: relative; } .uf-input-prefix[data-v-1e5c716d], .uf-input-suffix[data-v-1e5c716d] { position: absolute; z-index: 3; top: 50%; transform: translateY(-50%); display: inline-flex; align-items: center; justify-content: center; color: var(--color-neutral-300); cursor: pointer; transition: color 0.2s ease-in-out; } .uf-input-prefix[data-v-1e5c716d]:hover, .uf-input-suffix[data-v-1e5c716d]:hover { color: var(--color-primary-400); } .uf-input-prefix[data-v-1e5c716d]:active, .uf-input-suffix[data-v-1e5c716d]:active { color: var(--color-primary-500); } .uf-input--disabled .uf-input-prefix[data-v-1e5c716d], .uf-input--disabled .uf-input-suffix[data-v-1e5c716d] { cursor: not-allowed; color: var(--color-neutral-600); opacity: 0.5; } .uf-input--disabled .uf-input-prefix[data-v-1e5c716d]:hover, .uf-input--disabled .uf-input-suffix[data-v-1e5c716d]:hover { color: var(--color-neutral-600); } .uf-input-prefix-size-M[data-v-1e5c716d] { left: 0.5em } .uf-input-prefix-size-L[data-v-1e5c716d] { left: 0.75em; } .uf-input-suffix-size-M[data-v-1e5c716d] { right: 0.5em; } .uf-input-suffix-size-L[data-v-1e5c716d] { right: 0.75em; } .uf-input-helper[data-v-1e5c716d] { margin-top: 0.25em; color: var(--color-neutral-300); display: flex; align-items: center; gap: 0.375rem; } .uf-input-helper-icon[data-v-1e5c716d] { max-width: 1em; max-height: 1em; } .uf-input.uf-input--error .uf-input-label[data-v-1e5c716d] { color: var(--color-error-400); } .uf-input.uf-input--error .uf-input-helper[data-v-1e5c716d] { color: var(--color-error-400); } .uf-input.uf-input--success .uf-input-label[data-v-1e5c716d] { color: var(--color-success-400); } .uf-input.uf-input--success .uf-input-helper[data-v-1e5c716d] { color: var(--color-success-400); } .uf-input.uf-input--disabled .uf-input-label[data-v-1e5c716d] { color: var(--elevation-6); } [data-v-1e5c716d] .uf-ion-input { --border-radius: var(--radius-md); --padding-top: 0; --padding-bottom: 0; --highlight-height: 0; width: 100%; background-color: var(--elevation-2); color: var(--color-neutral-50); border-radius: var(--radius-md); border: 1px solid var(--elevation-3); transition: all 0.2s ease-in-out; } [data-v-1e5c716d] .uf-ion-input .label-text { color: var(--color-neutral-50); } [data-v-1e5c716d] .uf-input-size-M { --padding-start: 0.5em; --padding-end: 0.5em; --padding-top: 0.5em; --padding-bottom: 0.5em; min-height: 2.5em; max-height: 2.5em; font-size: var(--text-body-3-font-size); line-height: var(--text-body-3-line-height); font-weight: var(--text-body-3-font-weight); letter-spacing: var(--text-body-3-letter-spacing); text-transform: var(--text-body-3-text-transform); } [data-v-1e5c716d] .uf-input-size-L { --padding-start: 1em; --padding-end: 1em; --padding-top: 0.625em; --padding-bottom: 0.75em; max-height: 3em; font-size: var(--text-body-3-font-size); line-height: var(--text-body-3-line-height); font-weight: var(--text-body-3-font-weight); letter-spacing: var(--text-body-3-letter-spacing); text-transform: var(--text-body-3-text-transform); } [data-v-1e5c716d] .uf-input-size-M.uf-ion-input--prefix { --padding-start: 2.375em; } [data-v-1e5c716d] .uf-input-size-L.uf-ion-input--prefix { --padding-start: 2.625em; } [data-v-1e5c716d] .uf-input-size-M.uf-ion-input--suffix { --padding-end: 2.375em; } [data-v-1e5c716d] .uf-input-size-L.uf-ion-input--suffix { --padding-end: 2.625em; } [data-v-1e5c716d] .uf-ion-input.has-focus { background-color: var(--elevation-3); border: 1px solid var(--color-primary-400); } [data-v-1e5c716d] .uf-ion-input.uf-ion-input--error { border: 1px solid var(--color-error-500); } [data-v-1e5c716d] .uf-ion-input.uf-ion-input--error.has-focus { border: 1px solid var(--color-error-500); box-shadow: 0 0 0 0.0625em var(--color-error-500); } [data-v-1e5c716d] .uf-ion-input.uf-ion-input--success { border: 1px solid var(--color-success-400); } [data-v-1e5c716d] .uf-ion-input.uf-ion-input--success.has-focus { border: 1px solid var(--color-success-400); box-shadow: 0 0 0 0.0625em var(--color-success-400); } .uf-input:focus-within .uf-input-label[data-v-1e5c716d] { color: var(--color-primary-400); } .uf-input.uf-input--error:focus-within .uf-input-label[data-v-1e5c716d] { color: var(--color-error-400); } .uf-input.uf-input--success:focus-within .uf-input-label[data-v-1e5c716d] { color: var(--color-success-400); } /** * SCSS Variables & CSS Custom Properties * Theme configuration - use these throughout your app */ [data-v-fc478b66]:root { /* Primary Colors */ --color-primary-900: #1B6AB1; --color-primary-800: #197EDA; --color-primary-700: #208DF0; --color-primary-600: #3DA2FF; --color-primary-500: #5CB2FF; --color-primary-400: #7DC2FF; --color-primary-300: #A5DBFF; --color-primary-200: #BBE4FF; --color-primary-100: #D4EEFF; --color-primary-50: #E7F5FF; /* Secondary Colors */ --color-secondary-900: #101B3E; --color-secondary-800: #17285E; --color-secondary-700: #173E8B; --color-secondary-600: #1C4FB4; --color-secondary-500: #2161E0; --color-secondary-400: #397BFD; --color-secondary-300: #689BFF; --color-secondary-200: #95B9FF; --color-secondary-100: #C8DAFF; --color-secondary-50: #E4EDFF; /* Accent Colors */ --color-accent-900: #7A6D05; --color-accent-800: #AB9805; --color-accent-700: #E4CD1C; --color-accent-600: #FFE51F; --color-accent-500: #FFED68; --color-accent-400: #FFF07E; --color-accent-300: #FFF28C; --color-accent-200: #FFF5AA; --color-accent-100: #FFFAD9; --color-accent-50: #FFFFF2; /* Success Colors */ --color-success-900: #02170D; --color-success-800: #074526; --color-success-700: #0C7440; --color-success-600: #11A259; --color-success-500: #16D072; --color-success-400: #2FE98C; --color-success-300: #5DEEA5; --color-success-200: #8CF3BF; --color-success-100: #BAF8D9; --color-success-50: #E8FDF2; /* Error Colors */ --color-error-900: #500910; --color-error-800: #850F1A; --color-error-700: #A0121F; --color-error-600: #D5182A; --color-error-500: #E93E4F; --color-error-400: #F07884; --color-error-300: #F49FA7; --color-error-200: #F9C5CA; --color-error-100: #FDECED; --color-error-50: #FFFAFA; /* Ionic theme variables (keeps Ionic components aligned with Tailwind palette) */ --ion-font-family: Saira, sans-serif; --ion-background-color: #000000; --ion-background-color-rgb: to-rgb-string(#000000); --ion-text-color: #ffffff; --ion-text-color-rgb: to-rgb-string(#ffffff); --ion-color-primary: #5CB2FF; --ion-color-primary-rgb: to-rgb-string(#5CB2FF); --ion-color-primary-contrast: #FFFFFF; --ion-color-primary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-primary-shade: #3DA2FF; --ion-color-primary-tint: #7DC2FF; --ion-color-secondary: #2161E0; --ion-color-secondary-rgb: to-rgb-string(#2161E0); --ion-color-secondary-contrast: #FFFFFF; --ion-color-secondary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-secondary-shade: #1C4FB4; --ion-color-secondary-tint: #397BFD; --ion-color-tertiary: #FFED68; --ion-color-tertiary-rgb: to-rgb-string(#FFED68); --ion-color-tertiary-contrast: #1C1A22; --ion-color-tertiary-contrast-rgb: to-rgb-string(#1C1A22); --ion-color-tertiary-shade: #E4CD1C; --ion-color-tertiary-tint: #FFF07E; --ion-color-success: #16D072; --ion-color-success-rgb: to-rgb-string(#16D072); --ion-color-success-contrast: #FFFFFF; --ion-color-success-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-success-shade: #11A259; --ion-color-success-tint: #2FE98C; --ion-color-danger: #E93E4F; --ion-color-danger-rgb: to-rgb-string(#E93E4F); --ion-color-danger-contrast: #FFFFFF; --ion-color-danger-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-danger-shade: #D5182A; --ion-color-danger-tint: #F07884; /* Neutral Colors */ --color-neutral-900: #1C1A22; --color-neutral-800: #312F37; --color-neutral-700: #48454F; --color-neutral-600: #605D66; --color-neutral-500: #79757F; --color-neutral-400: #9A96A2; --color-neutral-300: #C9C4CF; --color-neutral-200: #E6E1E6; --color-neutral-100: #F4EFF4; --color-neutral-50: #FFFFFF; /* Legacy color variables for backward compatibility */ --color-primary: #5CB2FF; --color-primary-dark: #208DF0; --color-primary-light: #A5DBFF; --color-secondary: #2161E0; /* Background and text */ --color-background: #000000; --color-surface: #000000; --color-text: #ffffff; --color-text-light: #C9C4CF; /* Spacing */ --spacing-xs: 0.25em; --spacing-sm: 0.5em; --spacing-md: 1em; --spacing-lg: 1.5em; --spacing-xl: 2em; /* Typography */ --font-family: Saira, sans-serif; --font-family-saira: Saira, sans-serif; --font-family-saira-condensed: Saira Condensed, sans-serif; --font-size-xs: 0.75rem; --font-size-sm: 0.875rem; --font-size-md: 1rem; --font-size-lg: 1.125rem; --font-size-xl: 1.25rem; /* Typography System - CSS Custom Properties */ --text-title-1-l-font-size: 2rem; --text-title-1-l-line-height: 2.125rem; --text-title-1-l-font-weight: 700; --text-title-1-l-letter-spacing: -0.0125em; --text-title-1-l-text-transform: none; --text-title-1-m-font-size: 2rem; --text-title-1-m-line-height: 2.125rem; --text-title-1-m-font-weight: 600; --text-title-1-m-letter-spacing: -0.0125em; --text-title-1-m-text-transform: none; --text-title-2-l-font-size: 1.75rem; --text-title-2-l-line-height: 2rem; --text-title-2-l-font-weight: 700; --text-title-2-l-letter-spacing: -0.0125em; --text-title-2-l-text-transform: none; --text-title-2-m-font-size: 1.75rem; --text-title-2-m-line-height: 2rem; --text-title-2-m-font-weight: 600; --text-title-2-m-letter-spacing: -0.0125em; --text-title-2-m-text-transform: none; --text-title-3-l-font-size: 1.625rem; --text-title-3-l-line-height: 1.75rem; --text-title-3-l-font-weight: 700; --text-title-3-l-letter-spacing: 0; --text-title-3-l-text-transform: none; --text-title-3-m-font-size: 1.625rem; --text-title-3-m-line-height: 1.75rem; --text-title-3-m-font-weight: 600; --text-title-3-m-letter-spacing: 0; --text-title-3-m-text-transform: none; --text-title-4-l-font-size: 1.375rem; --text-title-4-l-line-height: 1.5rem; --text-title-4-l-font-weight: 700; --text-title-4-l-letter-spacing: 0; --text-title-4-l-text-transform: none; --text-title-4-m-font-size: 1.375rem; --text-title-4-m-line-height: 1.5rem; --text-title-4-m-font-weight: 600; --text-title-4-m-letter-spacing: 0; --text-title-4-m-text-transform: none; --text-subtitle-1-l-font-size: 1.5rem; --text-subtitle-1-l-line-height: 2rem; --text-subtitle-1-l-font-weight: 700; --text-subtitle-1-l-letter-spacing: -0.01em; --text-subtitle-1-l-text-transform: none; --text-subtitle-1-m-font-size: 1.5rem; --text-subtitle-1-m-line-height: 2rem; --text-subtitle-1-m-font-weight: 600; --text-subtitle-1-m-letter-spacing: -0.01em; --text-subtitle-1-m-text-transform: none; --text-subtitle-2-l-font-size: 1.25rem; --text-subtitle-2-l-line-height: 1.75rem; --text-subtitle-2-l-font-weight: 700; --text-subtitle-2-l-letter-spacing: -0.01em; --text-subtitle-2-l-text-transform: none; --text-subtitle-2-m-font-size: 1.25rem; --text-subtitle-2-m-line-height: 1.75rem; --text-subtitle-2-m-font-weight: 600; --text-subtitle-2-m-letter-spacing: -0.01em; --text-subtitle-2-m-text-transform: none; --text-subtitle-3-l-font-size: 1.125rem; --text-subtitle-3-l-line-height: 1.625rem; --text-subtitle-3-l-font-weight: 700; --text-subtitle-3-l-letter-spacing: -0.01em; --text-subtitle-3-l-text-transform: none; --text-subtitle-3-m-font-size: 1.125rem; --text-subtitle-3-m-line-height: 1.625rem; --text-subtitle-3-m-font-weight: 600; --text-subtitle-3-m-letter-spacing: -0.01em; --text-subtitle-3-m-text-transform: none; --text-subtitle-4-l-font-size: 1rem; --text-subtitle-4-l-line-height: 1.5rem; --text-subtitle-4-l-font-weight: 700; --text-subtitle-4-l-letter-spacing: -0.01em; --text-subtitle-4-l-text-transform: none; --text-subtitle-4-m-font-size: 1rem; --text-subtitle-4-m-line-height: 1.5rem; --text-subtitle-4-m-font-weight: 600; --text-subtitle-4-m-letter-spacing: -0.01em; --text-subtitle-4-m-text-transform: none; --text-label-1-l-font-size: 1.125rem; --text-label-1-l-line-height: 1.375rem; --text-label-1-l-font-weight: 700; --text-label-1-l-letter-spacing: 0.0025em; --text-label-1-l-text-transform: none; --text-label-1-m-font-size: 1.125rem; --text-label-1-m-line-height: 1.375rem; --text-label-1-m-font-weight: 600; --text-label-1-m-letter-spacing: 0.0025em; --text-label-1-m-text-transform: none; --text-label-2-l-font-size: 1rem; --text-label-2-l-line-height: 1.25rem; --text-label-2-l-font-weight: 700; --text-label-2-l-letter-spacing: 0.0025em; --text-label-2-l-text-transform: none; --text-label-2-m-font-size: 1rem; --text-label-2-m-line-height: 1.25rem; --text-label-2-m-font-weight: 600; --text-label-2-m-letter-spacing: 0.0025em; --text-label-2-m-text-transform: none; --text-label-3-l-font-size: 0.875rem; --text-label-3-l-line-height: 1rem; --text-label-3-l-font-weight: 700; --text-label-3-l-letter-spacing: 0.0025em; --text-label-3-l-text-transform: none; --text-label-3-m-font-size: 0.875rem; --text-label-3-m-line-height: 1rem; --text-label-3-m-font-weight: 600; --text-label-3-m-letter-spacing: 0.0025em; --text-label-3-m-text-transform: none; --text-button-1-font-size: 1.25rem; --text-button-1-line-height: 1.5rem; --text-button-1-font-weight: 700; --text-button-1-letter-spacing: 0.005em; --text-button-1-text-transform: none; --text-button-2-font-size: 1.125rem; --text-button-2-line-height: 1.5rem; --text-button-2-font-weight: 700; --text-button-2-letter-spacing: 0.005em; --text-button-2-text-transform: none; --text-button-3-font-size: 1rem; --text-button-3-line-height: 1.45rem; --text-button-3-font-weight: 700; --text-button-3-letter-spacing: 0.005em; --text-button-3-text-transform: none; --text-button-4-font-size: 0.875rem; --text-button-4-line-height: 1rem; --text-button-4-font-weight: 700; --text-button-4-letter-spacing: 0.005em; --text-button-4-text-transform: none; --text-body-1-font-size: 1.25rem; --text-body-1-line-height: 1.5rem; --text-body-1-font-weight: 400; --text-body-1-letter-spacing: 0.005em; --text-body-1-text-transform: none; --text-body-2-font-size: 1.125rem; --text-body-2-line-height: 1.375rem; --text-body-2-font-weight: 400; --text-body-2-letter-spacing: 0.005em; --text-body-2-text-transform: none; --text-body-3-font-size: 1rem; --text-body-3-line-height: 1.25rem; --text-body-3-font-weight: 400; --text-body-3-letter-spacing: 0.005em; --text-body-3-text-transform: none; --text-body-4-font-size: 0.875rem; --text-body-4-line-height: 1.125rem; --text-body-4-font-weight: 400; --text-body-4-letter-spacing: 0.005em; --text-body-4-text-transform: none; --text-overline-1-l-font-size: 0.875rem; --text-overline-1-l-line-height: 1rem; --text-overline-1-l-font-weight: 700; --text-overline-1-l-letter-spacing: 0.05em; --text-overline-1-l-text-transform: uppercase; --text-overline-1-m-font-size: 0.875rem; --text-overline-1-m-line-height: 1rem; --text-overline-1-m-font-weight: 600; --text-overline-1-m-letter-spacing: 0.05em; --text-overline-1-m-text-transform: uppercase; --text-overline-2-l-font-size: 0.75rem; --text-overline-2-l-line-height: 0.875rem; --text-overline-2-l-font-weight: 700; --text-overline-2-l-letter-spacing: 0.05em; --text-overline-2-l-text-transform: uppercase; --text-overline-2-m-font-size: 0.75rem; --text-overline-2-m-line-height: 0.875rem; --text-overline-2-m-font-weight: 600; --text-overline-2-m-letter-spacing: 0.05em; --text-overline-2-m-text-transform: uppercase; --text-caption-1-l-font-size: 1rem; --text-caption-1-l-line-height: 1.25rem; --text-caption-1-l-font-weight: 700; --text-caption-1-l-letter-spacing: -0.01em; --text-caption-1-l-text-transform: none; --text-caption-1-m-font-size: 1rem; --text-caption-1-m-line-height: 1.25rem; --text-caption-1-m-font-weight: 600; --text-caption-1-m-letter-spacing: -0.01em; --text-caption-1-m-text-transform: none; --text-caption-2-l-font-size: 0.875rem; --text-caption-2-l-line-height: 1rem; --text-caption-2-l-font-weight: 700; --text-caption-2-l-letter-spacing: -0.01em; --text-caption-2-l-text-transform: none; --text-caption-2-m-font-size: 0.875rem; --text-caption-2-m-line-height: 1rem; --text-caption-2-m-font-weight: 600; --text-caption-2-m-letter-spacing: -0.01em; --text-caption-2-m-text-transform: none; --text-caption-3-l-font-size: 0.75rem; --text-caption-3-l-line-height: 0.875rem; --text-caption-3-l-font-weight: 700; --text-caption-3-l-letter-spacing: -0.01em; --text-caption-3-l-text-transform: none; --text-caption-3-m-font-size: 0.75rem; --text-caption-3-m-line-height: 0.875rem; --text-caption-3-m-font-weight: 600; --text-caption-3-m-letter-spacing: -0.01em; --text-caption-3-m-text-transform: none; --text-caption-4-l-font-size: 0.625rem; --text-caption-4-l-line-height: 0.625rem; --text-caption-4-l-font-weight: 700; --text-caption-4-l-letter-spacing: -0.01em; --text-caption-4-l-text-transform: none; --text-caption-4-m-font-size: 0.625rem; --text-caption-4-m-line-height: 0.625rem; --text-caption-4-m-font-weight: 600; --text-caption-4-m-letter-spacing: -0.01em; --text-caption-4-m-text-transform: none; /* Breakpoints (for use in media queries) */ --breakpoint-mobile: 1024px; --breakpoint-desktop: 1025px; /* Border radius */ --radius-sm: 0.1875em; --radius-md: 0.5em; --radius-lg: 0.75em; /* Shadows */ --shadow-sm: 0 0.0625em 0.125em rgba(0, 0, 0, 0.05); --shadow-md: 0 0.25em 0.375em rgba(0, 0, 0, 0.1); --shadow-lg: 0 0.625em 0.9375em rgba(0, 0, 0, 0.1); /* MISC Colors */ --color-misc-talent-card: #8DF800; --color-misc-bonus-card: #A641D0; --color-misc-bonus-gradient: linear-gradient(0deg, #21222A 0%, #9143CB 100%); --color-misc-black-fade-0: linear-gradient(0deg, #000000 0%, rgba(9, 14, 23, 0) 100%); --color-misc-black-fade-1: linear-gradient(0deg, #101010 0%, rgba(25, 26, 31, 0) 100%); /* Gradients */ --gradient-primary: linear-gradient(90deg, #0062FF 0%, #001D6D 100%); --gradient-secondary: linear-gradient(90deg, #0C1E54 0%, #0C44A4 100%); --gradient-light: linear-gradient(90deg, #1B6AB1 0%, #7DC2FF 100%); --gradient-accent: linear-gradient(90deg, #FFEE6A 0%, #CD9A17 100%); --gradient-dark: linear-gradient(180deg, #151319 0%, #262930 100%); /* Elevation */ --elevation-0: #000000; --elevation-1: #101010; --elevation-2: #202020; --elevation-3: #282828; --elevation-4: #303030; --elevation-5: #383838; --elevation-6: #404040; /* Card Effects */ --card-effect-base: conic-gradient(from 180deg at 48.5% 50%, #989DA3 -46.16deg, #101012 130.63deg, #9DA2A9 133.38deg, #121214 311.43deg, #989DA3 313.84deg, #101012 490.63deg); --card-effect-bronze: linear-gradient(90deg, #B5947D 0%, #B6937D 6.65%, #FFECE0 8.25%, #F0CAB2 30.69%, #A47C6C 34.31%, #7F5B4A 65.92%, #AC836D 74.36%, #AB836E 91.3%, #8E6958 100%); --card-effect-silverg: linear-gradient(74.17deg, #7A7F81 13.43%, #9EA1A1 26.76%, #979E9D 47.44%, #798082 53.73%, #8E9799 77.78%, #9EA3A5 86.51%, #8A9092 95.7%); --card-effect-gold-1: conic-gradient(from 180deg at 48.5% 50%, #FFEAC2 -46.16deg, #4B2A16 130.63deg, #EAB872 133.38deg, #AE824E 204.46deg, #533018 311.43deg, #FFEAC2 313.84deg, #4B2A16 490.63deg); --card-effect-gold-2: linear-gradient(75.74deg, #C1A875 12.49%, #EAB872 26.21%, #AE824E 47.49%, #C1A875 53.96%, #C1A875 78.71%, #EAB872 87.7%, #C1A875 97.16%); --card-effect-sapphire: conic-gradient(from -1.98deg at 91% 2.08%, #52F9FF 0deg, #68E3FE 26.25deg, #2E9BFF 161.27deg, #52F9FF 176.4deg, #2E9BFF 204.68deg, #52F9FF 255deg, #2E9BFF 309.38deg, #52F9FF 360deg); } .text-title-1-l[data-v-fc478b66] { font-size: var(--text-title-1-l-font-size); line-height: var(--text-title-1-l-line-height); font-weight: var(--text-title-1-l-font-weight); letter-spacing: var(--text-title-1-l-letter-spacing); text-transform: var(--text-title-1-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-1-m[data-v-fc478b66] { font-size: var(--text-title-1-m-font-size); line-height: var(--text-title-1-m-line-height); font-weight: var(--text-title-1-m-font-weight); letter-spacing: var(--text-title-1-m-letter-spacing); text-transform: var(--text-title-1-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-2-l[data-v-fc478b66] { font-size: var(--text-title-2-l-font-size); line-height: var(--text-title-2-l-line-height); font-weight: var(--text-title-2-l-font-weight); letter-spacing: var(--text-title-2-l-letter-spacing); text-transform: var(--text-title-2-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-2-m[data-v-fc478b66] { font-size: var(--text-title-2-m-font-size); line-height: var(--text-title-2-m-line-height); font-weight: var(--text-title-2-m-font-weight); letter-spacing: var(--text-title-2-m-letter-spacing); text-transform: var(--text-title-2-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-3-l[data-v-fc478b66] { font-size: var(--text-title-3-l-font-size); line-height: var(--text-title-3-l-line-height); font-weight: var(--text-title-3-l-font-weight); letter-spacing: var(--text-title-3-l-letter-spacing); text-transform: var(--text-title-3-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-3-m[data-v-fc478b66] { font-size: var(--text-title-3-m-font-size); line-height: var(--text-title-3-m-line-height); font-weight: var(--text-title-3-m-font-weight); letter-spacing: var(--text-title-3-m-letter-spacing); text-transform: var(--text-title-3-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-4-l[data-v-fc478b66] { font-size: var(--text-title-4-l-font-size); line-height: var(--text-title-4-l-line-height); font-weight: var(--text-title-4-l-font-weight); letter-spacing: var(--text-title-4-l-letter-spacing); text-transform: var(--text-title-4-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-4-m[data-v-fc478b66] { font-size: var(--text-title-4-m-font-size); line-height: var(--text-title-4-m-line-height); font-weight: var(--text-title-4-m-font-weight); letter-spacing: var(--text-title-4-m-letter-spacing); text-transform: var(--text-title-4-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-1-l[data-v-fc478b66] { font-size: var(--text-subtitle-1-l-font-size); line-height: var(--text-subtitle-1-l-line-height); font-weight: var(--text-subtitle-1-l-font-weight); letter-spacing: var(--text-subtitle-1-l-letter-spacing); text-transform: var(--text-subtitle-1-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-1-m[data-v-fc478b66] { font-size: var(--text-subtitle-1-m-font-size); line-height: var(--text-subtitle-1-m-line-height); font-weight: var(--text-subtitle-1-m-font-weight); letter-spacing: var(--text-subtitle-1-m-letter-spacing); text-transform: var(--text-subtitle-1-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-2-l[data-v-fc478b66] { font-size: var(--text-subtitle-2-l-font-size); line-height: var(--text-subtitle-2-l-line-height); font-weight: var(--text-subtitle-2-l-font-weight); letter-spacing: var(--text-subtitle-2-l-letter-spacing); text-transform: var(--text-subtitle-2-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-2-m[data-v-fc478b66] { font-size: var(--text-subtitle-2-m-font-size); line-height: var(--text-subtitle-2-m-line-height); font-weight: var(--text-subtitle-2-m-font-weight); letter-spacing: var(--text-subtitle-2-m-letter-spacing); text-transform: var(--text-subtitle-2-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-3-l[data-v-fc478b66],[data-v-fc478b66] .uf-ion-select::part(label) { font-size: var(--text-subtitle-3-l-font-size); line-height: var(--text-subtitle-3-l-line-height); font-weight: var(--text-subtitle-3-l-font-weight); letter-spacing: var(--text-subtitle-3-l-letter-spacing); text-transform: var(--text-subtitle-3-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-3-m[data-v-fc478b66] { font-size: var(--text-subtitle-3-m-font-size); line-height: var(--text-subtitle-3-m-line-height); font-weight: var(--text-subtitle-3-m-font-weight); letter-spacing: var(--text-subtitle-3-m-letter-spacing); text-transform: var(--text-subtitle-3-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-4-l[data-v-fc478b66] { font-size: var(--text-subtitle-4-l-font-size); line-height: var(--text-subtitle-4-l-line-height); font-weight: var(--text-subtitle-4-l-font-weight); letter-spacing: var(--text-subtitle-4-l-letter-spacing); text-transform: var(--text-subtitle-4-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-4-m[data-v-fc478b66] { font-size: var(--text-subtitle-4-m-font-size); line-height: var(--text-subtitle-4-m-line-height); font-weight: var(--text-subtitle-4-m-font-weight); letter-spacing: var(--text-subtitle-4-m-letter-spacing); text-transform: var(--text-subtitle-4-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-1-l[data-v-fc478b66] { font-size: var(--text-label-1-l-font-size); line-height: var(--text-label-1-l-line-height); font-weight: var(--text-label-1-l-font-weight); letter-spacing: var(--text-label-1-l-letter-spacing); text-transform: var(--text-label-1-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-1-m[data-v-fc478b66] { font-size: var(--text-label-1-m-font-size); line-height: var(--text-label-1-m-line-height); font-weight: var(--text-label-1-m-font-weight); letter-spacing: var(--text-label-1-m-letter-spacing); text-transform: var(--text-label-1-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-2-l[data-v-fc478b66] { font-size: var(--text-label-2-l-font-size); line-height: var(--text-label-2-l-line-height); font-weight: var(--text-label-2-l-font-weight); letter-spacing: var(--text-label-2-l-letter-spacing); text-transform: var(--text-label-2-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-2-m[data-v-fc478b66] { font-size: var(--text-label-2-m-font-size); line-height: var(--text-label-2-m-line-height); font-weight: var(--text-label-2-m-font-weight); letter-spacing: var(--text-label-2-m-letter-spacing); text-transform: var(--text-label-2-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-3-l[data-v-fc478b66] { font-size: var(--text-label-3-l-font-size); line-height: var(--text-label-3-l-line-height); font-weight: var(--text-label-3-l-font-weight); letter-spacing: var(--text-label-3-l-letter-spacing); text-transform: var(--text-label-3-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-3-m[data-v-fc478b66] { font-size: var(--text-label-3-m-font-size); line-height: var(--text-label-3-m-line-height); font-weight: var(--text-label-3-m-font-weight); letter-spacing: var(--text-label-3-m-letter-spacing); text-transform: var(--text-label-3-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-button-1[data-v-fc478b66] { font-size: var(--text-button-1-font-size); line-height: var(--text-button-1-line-height); font-weight: var(--text-button-1-font-weight); letter-spacing: var(--text-button-1-letter-spacing); text-transform: var(--text-button-1-text-transform); font-family: var(--font-family-saira-condensed); } .text-button-2[data-v-fc478b66] { font-size: var(--text-button-2-font-size); line-height: var(--text-button-2-line-height); font-weight: var(--text-button-2-font-weight); letter-spacing: var(--text-button-2-letter-spacing); text-transform: var(--text-button-2-text-transform); font-family: var(--font-family-saira-condensed); } .text-button-3[data-v-fc478b66] { font-size: var(--text-button-3-font-size); line-height: var(--text-button-3-line-height); font-weight: var(--text-button-3-font-weight); letter-spacing: var(--text-button-3-letter-spacing); text-transform: var(--text-button-3-text-transform); font-family: var(--font-family-saira-condensed); } .text-button-4[data-v-fc478b66] { font-size: var(--text-button-4-font-size); line-height: var(--text-button-4-line-height); font-weight: var(--text-button-4-font-weight); letter-spacing: var(--text-button-4-letter-spacing); text-transform: var(--text-button-4-text-transform); font-family: var(--font-family-saira-condensed); } .text-body-1[data-v-fc478b66] { font-size: var(--text-body-1-font-size); line-height: var(--text-body-1-line-height); font-weight: var(--text-body-1-font-weight); letter-spacing: var(--text-body-1-letter-spacing); text-transform: var(--text-body-1-text-transform); font-family: var(--font-family-saira); } .text-body-2[data-v-fc478b66] { font-size: var(--text-body-2-font-size); line-height: var(--text-body-2-line-height); font-weight: var(--text-body-2-font-weight); letter-spacing: var(--text-body-2-letter-spacing); text-transform: var(--text-body-2-text-transform); font-family: var(--font-family-saira); } .text-body-3[data-v-fc478b66] { font-size: var(--text-body-3-font-size); line-height: var(--text-body-3-line-height); font-weight: var(--text-body-3-font-weight); letter-spacing: var(--text-body-3-letter-spacing); text-transform: var(--text-body-3-text-transform); font-family: var(--font-family-saira); } .text-body-4[data-v-fc478b66] { font-size: var(--text-body-4-font-size); line-height: var(--text-body-4-line-height); font-weight: var(--text-body-4-font-weight); letter-spacing: var(--text-body-4-letter-spacing); text-transform: var(--text-body-4-text-transform); font-family: var(--font-family-saira); } .text-overline-1-l[data-v-fc478b66] { font-size: var(--text-overline-1-l-font-size); line-height: var(--text-overline-1-l-line-height); font-weight: var(--text-overline-1-l-font-weight); letter-spacing: var(--text-overline-1-l-letter-spacing); text-transform: var(--text-overline-1-l-text-transform); font-family: var(--font-family-saira); } .text-overline-1-m[data-v-fc478b66] { font-size: var(--text-overline-1-m-font-size); line-height: var(--text-overline-1-m-line-height); font-weight: var(--text-overline-1-m-font-weight); letter-spacing: var(--text-overline-1-m-letter-spacing); text-transform: var(--text-overline-1-m-text-transform); font-family: var(--font-family-saira); } .text-overline-2-l[data-v-fc478b66] { font-size: var(--text-overline-2-l-font-size); line-height: var(--text-overline-2-l-line-height); font-weight: var(--text-overline-2-l-font-weight); letter-spacing: var(--text-overline-2-l-letter-spacing); text-transform: var(--text-overline-2-l-text-transform); font-family: var(--font-family-saira); } .text-overline-2-m[data-v-fc478b66] { font-size: var(--text-overline-2-m-font-size); line-height: var(--text-overline-2-m-line-height); font-weight: var(--text-overline-2-m-font-weight); letter-spacing: var(--text-overline-2-m-letter-spacing); text-transform: var(--text-overline-2-m-text-transform); font-family: var(--font-family-saira); } .text-caption-1-l[data-v-fc478b66] { font-size: var(--text-caption-1-l-font-size); line-height: var(--text-caption-1-l-line-height); font-weight: var(--text-caption-1-l-font-weight); letter-spacing: var(--text-caption-1-l-letter-spacing); text-transform: var(--text-caption-1-l-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-1-m[data-v-fc478b66] { font-size: var(--text-caption-1-m-font-size); line-height: var(--text-caption-1-m-line-height); font-weight: var(--text-caption-1-m-font-weight); letter-spacing: var(--text-caption-1-m-letter-spacing); text-transform: var(--text-caption-1-m-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-2-l[data-v-fc478b66] { font-size: var(--text-caption-2-l-font-size); line-height: var(--text-caption-2-l-line-height); font-weight: var(--text-caption-2-l-font-weight); letter-spacing: var(--text-caption-2-l-letter-spacing); text-transform: var(--text-caption-2-l-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-2-m[data-v-fc478b66] { font-size: var(--text-caption-2-m-font-size); line-height: var(--text-caption-2-m-line-height); font-weight: var(--text-caption-2-m-font-weight); letter-spacing: var(--text-caption-2-m-letter-spacing); text-transform: var(--text-caption-2-m-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-3-l[data-v-fc478b66] { font-size: var(--text-caption-3-l-font-size); line-height: var(--text-caption-3-l-line-height); font-weight: var(--text-caption-3-l-font-weight); letter-spacing: var(--text-caption-3-l-letter-spacing); text-transform: var(--text-caption-3-l-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-3-m[data-v-fc478b66] { font-size: var(--text-caption-3-m-font-size); line-height: var(--text-caption-3-m-line-height); font-weight: var(--text-caption-3-m-font-weight); letter-spacing: var(--text-caption-3-m-letter-spacing); text-transform: var(--text-caption-3-m-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-4-l[data-v-fc478b66] { font-size: var(--text-caption-4-l-font-size); line-height: var(--text-caption-4-l-line-height); font-weight: var(--text-caption-4-l-font-weight); letter-spacing: var(--text-caption-4-l-letter-spacing); text-transform: var(--text-caption-4-l-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-4-m[data-v-fc478b66] { font-size: var(--text-caption-4-m-font-size); line-height: var(--text-caption-4-m-line-height); font-weight: var(--text-caption-4-m-font-weight); letter-spacing: var(--text-caption-4-m-letter-spacing); text-transform: var(--text-caption-4-m-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .uf-select[data-v-fc478b66] { width: 100%; } [data-v-fc478b66] .uf-ion-select { display: flex; flex-direction: row; align-items: center; justify-content: space-between; width: 100%; max-height: 40px; border-radius: 8px; border: 1px solid var(--color-neutral-400); padding: 0 8px; } [data-v-fc478b66] .uf-ion-select::part(icon) { color: white; width: 24px; height: 24px; } /* stylelint-disable scss/empty-ruleset */ [data-v-fc478b66] .uf-select-option { background-color: red; border: 1px solid var(--color-neutral-400); }/** * SCSS Variables & CSS Custom Properties * Theme configuration - use these throughout your app */ :root { /* Primary Colors */ --color-primary-900: #1B6AB1; --color-primary-800: #197EDA; --color-primary-700: #208DF0; --color-primary-600: #3DA2FF; --color-primary-500: #5CB2FF; --color-primary-400: #7DC2FF; --color-primary-300: #A5DBFF; --color-primary-200: #BBE4FF; --color-primary-100: #D4EEFF; --color-primary-50: #E7F5FF; /* Secondary Colors */ --color-secondary-900: #101B3E; --color-secondary-800: #17285E; --color-secondary-700: #173E8B; --color-secondary-600: #1C4FB4; --color-secondary-500: #2161E0; --color-secondary-400: #397BFD; --color-secondary-300: #689BFF; --color-secondary-200: #95B9FF; --color-secondary-100: #C8DAFF; --color-secondary-50: #E4EDFF; /* Accent Colors */ --color-accent-900: #7A6D05; --color-accent-800: #AB9805; --color-accent-700: #E4CD1C; --color-accent-600: #FFE51F; --color-accent-500: #FFED68; --color-accent-400: #FFF07E; --color-accent-300: #FFF28C; --color-accent-200: #FFF5AA; --color-accent-100: #FFFAD9; --color-accent-50: #FFFFF2; /* Success Colors */ --color-success-900: #02170D; --color-success-800: #074526; --color-success-700: #0C7440; --color-success-600: #11A259; --color-success-500: #16D072; --color-success-400: #2FE98C; --color-success-300: #5DEEA5; --color-success-200: #8CF3BF; --color-success-100: #BAF8D9; --color-success-50: #E8FDF2; /* Error Colors */ --color-error-900: #500910; --color-error-800: #850F1A; --color-error-700: #A0121F; --color-error-600: #D5182A; --color-error-500: #E93E4F; --color-error-400: #F07884; --color-error-300: #F49FA7; --color-error-200: #F9C5CA; --color-error-100: #FDECED; --color-error-50: #FFFAFA; /* Ionic theme variables (keeps Ionic components aligned with Tailwind palette) */ --ion-font-family: Saira, sans-serif; --ion-background-color: #000000; --ion-background-color-rgb: to-rgb-string(#000000); --ion-text-color: #ffffff; --ion-text-color-rgb: to-rgb-string(#ffffff); --ion-color-primary: #5CB2FF; --ion-color-primary-rgb: to-rgb-string(#5CB2FF); --ion-color-primary-contrast: #FFFFFF; --ion-color-primary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-primary-shade: #3DA2FF; --ion-color-primary-tint: #7DC2FF; --ion-color-secondary: #2161E0; --ion-color-secondary-rgb: to-rgb-string(#2161E0); --ion-color-secondary-contrast: #FFFFFF; --ion-color-secondary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-secondary-shade: #1C4FB4; --ion-color-secondary-tint: #397BFD; --ion-color-tertiary: #FFED68; --ion-color-tertiary-rgb: to-rgb-string(#FFED68); --ion-color-tertiary-contrast: #1C1A22; --ion-color-tertiary-contrast-rgb: to-rgb-string(#1C1A22); --ion-color-tertiary-shade: #E4CD1C; --ion-color-tertiary-tint: #FFF07E; --ion-color-success: #16D072; --ion-color-success-rgb: to-rgb-string(#16D072); --ion-color-success-contrast: #FFFFFF; --ion-color-success-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-success-shade: #11A259; --ion-color-success-tint: #2FE98C; --ion-color-danger: #E93E4F; --ion-color-danger-rgb: to-rgb-string(#E93E4F); --ion-color-danger-contrast: #FFFFFF; --ion-color-danger-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-danger-shade: #D5182A; --ion-color-danger-tint: #F07884; /* Neutral Colors */ --color-neutral-900: #1C1A22; --color-neutral-800: #312F37; --color-neutral-700: #48454F; --color-neutral-600: #605D66; --color-neutral-500: #79757F; --color-neutral-400: #9A96A2; --color-neutral-300: #C9C4CF; --color-neutral-200: #E6E1E6; --color-neutral-100: #F4EFF4; --color-neutral-50: #FFFFFF; /* Legacy color variables for backward compatibility */ --color-primary: #5CB2FF; --color-primary-dark: #208DF0; --color-primary-light: #A5DBFF; --color-secondary: #2161E0; /* Background and text */ --color-background: #000000; --color-surface: #000000; --color-text: #ffffff; --color-text-light: #C9C4CF; /* Spacing */ --spacing-xs: 0.25em; --spacing-sm: 0.5em; --spacing-md: 1em; --spacing-lg: 1.5em; --spacing-xl: 2em; /* Typography */ --font-family: Saira, sans-serif; --font-family-saira: Saira, sans-serif; --font-family-saira-condensed: Saira Condensed, sans-serif; --font-size-xs: 0.75rem; --font-size-sm: 0.875rem; --font-size-md: 1rem; --font-size-lg: 1.125rem; --font-size-xl: 1.25rem; /* Typography System - CSS Custom Properties */ --text-title-1-l-font-size: 2rem; --text-title-1-l-line-height: 2.125rem; --text-title-1-l-font-weight: 700; --text-title-1-l-letter-spacing: -0.0125em; --text-title-1-l-text-transform: none; --text-title-1-m-font-size: 2rem; --text-title-1-m-line-height: 2.125rem; --text-title-1-m-font-weight: 600; --text-title-1-m-letter-spacing: -0.0125em; --text-title-1-m-text-transform: none; --text-title-2-l-font-size: 1.75rem; --text-title-2-l-line-height: 2rem; --text-title-2-l-font-weight: 700; --text-title-2-l-letter-spacing: -0.0125em; --text-title-2-l-text-transform: none; --text-title-2-m-font-size: 1.75rem; --text-title-2-m-line-height: 2rem; --text-title-2-m-font-weight: 600; --text-title-2-m-letter-spacing: -0.0125em; --text-title-2-m-text-transform: none; --text-title-3-l-font-size: 1.625rem; --text-title-3-l-line-height: 1.75rem; --text-title-3-l-font-weight: 700; --text-title-3-l-letter-spacing: 0; --text-title-3-l-text-transform: none; --text-title-3-m-font-size: 1.625rem; --text-title-3-m-line-height: 1.75rem; --text-title-3-m-font-weight: 600; --text-title-3-m-letter-spacing: 0; --text-title-3-m-text-transform: none; --text-title-4-l-font-size: 1.375rem; --text-title-4-l-line-height: 1.5rem; --text-title-4-l-font-weight: 700; --text-title-4-l-letter-spacing: 0; --text-title-4-l-text-transform: none; --text-title-4-m-font-size: 1.375rem; --text-title-4-m-line-height: 1.5rem; --text-title-4-m-font-weight: 600; --text-title-4-m-letter-spacing: 0; --text-title-4-m-text-transform: none; --text-subtitle-1-l-font-size: 1.5rem; --text-subtitle-1-l-line-height: 2rem; --text-subtitle-1-l-font-weight: 700; --text-subtitle-1-l-letter-spacing: -0.01em; --text-subtitle-1-l-text-transform: none; --text-subtitle-1-m-font-size: 1.5rem; --text-subtitle-1-m-line-height: 2rem; --text-subtitle-1-m-font-weight: 600; --text-subtitle-1-m-letter-spacing: -0.01em; --text-subtitle-1-m-text-transform: none; --text-subtitle-2-l-font-size: 1.25rem; --text-subtitle-2-l-line-height: 1.75rem; --text-subtitle-2-l-font-weight: 700; --text-subtitle-2-l-letter-spacing: -0.01em; --text-subtitle-2-l-text-transform: none; --text-subtitle-2-m-font-size: 1.25rem; --text-subtitle-2-m-line-height: 1.75rem; --text-subtitle-2-m-font-weight: 600; --text-subtitle-2-m-letter-spacing: -0.01em; --text-subtitle-2-m-text-transform: none; --text-subtitle-3-l-font-size: 1.125rem; --text-subtitle-3-l-line-height: 1.625rem; --text-subtitle-3-l-font-weight: 700; --text-subtitle-3-l-letter-spacing: -0.01em; --text-subtitle-3-l-text-transform: none; --text-subtitle-3-m-font-size: 1.125rem; --text-subtitle-3-m-line-height: 1.625rem; --text-subtitle-3-m-font-weight: 600; --text-subtitle-3-m-letter-spacing: -0.01em; --text-subtitle-3-m-text-transform: none; --text-subtitle-4-l-font-size: 1rem; --text-subtitle-4-l-line-height: 1.5rem; --text-subtitle-4-l-font-weight: 700; --text-subtitle-4-l-letter-spacing: -0.01em; --text-subtitle-4-l-text-transform: none; --text-subtitle-4-m-font-size: 1rem; --text-subtitle-4-m-line-height: 1.5rem; --text-subtitle-4-m-font-weight: 600; --text-subtitle-4-m-letter-spacing: -0.01em; --text-subtitle-4-m-text-transform: none; --text-label-1-l-font-size: 1.125rem; --text-label-1-l-line-height: 1.375rem; --text-label-1-l-font-weight: 700; --text-label-1-l-letter-spacing: 0.0025em; --text-label-1-l-text-transform: none; --text-label-1-m-font-size: 1.125rem; --text-label-1-m-line-height: 1.375rem; --text-label-1-m-font-weight: 600; --text-label-1-m-letter-spacing: 0.0025em; --text-label-1-m-text-transform: none; --text-label-2-l-font-size: 1rem; --text-label-2-l-line-height: 1.25rem; --text-label-2-l-font-weight: 700; --text-label-2-l-letter-spacing: 0.0025em; --text-label-2-l-text-transform: none; --text-label-2-m-font-size: 1rem; --text-label-2-m-line-height: 1.25rem; --text-label-2-m-font-weight: 600; --text-label-2-m-letter-spacing: 0.0025em; --text-label-2-m-text-transform: none; --text-label-3-l-font-size: 0.875rem; --text-label-3-l-line-height: 1rem; --text-label-3-l-font-weight: 700; --text-label-3-l-letter-spacing: 0.0025em; --text-label-3-l-text-transform: none; --text-label-3-m-font-size: 0.875rem; --text-label-3-m-line-height: 1rem; --text-label-3-m-font-weight: 600; --text-label-3-m-letter-spacing: 0.0025em; --text-label-3-m-text-transform: none; --text-button-1-font-size: 1.25rem; --text-button-1-line-height: 1.5rem; --text-button-1-font-weight: 700; --text-button-1-letter-spacing: 0.005em; --text-button-1-text-transform: none; --text-button-2-font-size: 1.125rem; --text-button-2-line-height: 1.5rem; --text-button-2-font-weight: 700; --text-button-2-letter-spacing: 0.005em; --text-button-2-text-transform: none; --text-button-3-font-size: 1rem; --text-button-3-line-height: 1.45rem; --text-button-3-font-weight: 700; --text-button-3-letter-spacing: 0.005em; --text-button-3-text-transform: none; --text-button-4-font-size: 0.875rem; --text-button-4-line-height: 1rem; --text-button-4-font-weight: 700; --text-button-4-letter-spacing: 0.005em; --text-button-4-text-transform: none; --text-body-1-font-size: 1.25rem; --text-body-1-line-height: 1.5rem; --text-body-1-font-weight: 400; --text-body-1-letter-spacing: 0.005em; --text-body-1-text-transform: none; --text-body-2-font-size: 1.125rem; --text-body-2-line-height: 1.375rem; --text-body-2-font-weight: 400; --text-body-2-letter-spacing: 0.005em; --text-body-2-text-transform: none; --text-body-3-font-size: 1rem; --text-body-3-line-height: 1.25rem; --text-body-3-font-weight: 400; --text-body-3-letter-spacing: 0.005em; --text-body-3-text-transform: none; --text-body-4-font-size: 0.875rem; --text-body-4-line-height: 1.125rem; --text-body-4-font-weight: 400; --text-body-4-letter-spacing: 0.005em; --text-body-4-text-transform: none; --text-overline-1-l-font-size: 0.875rem; --text-overline-1-l-line-height: 1rem; --text-overline-1-l-font-weight: 700; --text-overline-1-l-letter-spacing: 0.05em; --text-overline-1-l-text-transform: uppercase; --text-overline-1-m-font-size: 0.875rem; --text-overline-1-m-line-height: 1rem; --text-overline-1-m-font-weight: 600; --text-overline-1-m-letter-spacing: 0.05em; --text-overline-1-m-text-transform: uppercase; --text-overline-2-l-font-size: 0.75rem; --text-overline-2-l-line-height: 0.875rem; --text-overline-2-l-font-weight: 700; --text-overline-2-l-letter-spacing: 0.05em; --text-overline-2-l-text-transform: uppercase; --text-overline-2-m-font-size: 0.75rem; --text-overline-2-m-line-height: 0.875rem; --text-overline-2-m-font-weight: 600; --text-overline-2-m-letter-spacing: 0.05em; --text-overline-2-m-text-transform: uppercase; --text-caption-1-l-font-size: 1rem; --text-caption-1-l-line-height: 1.25rem; --text-caption-1-l-font-weight: 700; --text-caption-1-l-letter-spacing: -0.01em; --text-caption-1-l-text-transform: none; --text-caption-1-m-font-size: 1rem; --text-caption-1-m-line-height: 1.25rem; --text-caption-1-m-font-weight: 600; --text-caption-1-m-letter-spacing: -0.01em; --text-caption-1-m-text-transform: none; --text-caption-2-l-font-size: 0.875rem; --text-caption-2-l-line-height: 1rem; --text-caption-2-l-font-weight: 700; --text-caption-2-l-letter-spacing: -0.01em; --text-caption-2-l-text-transform: none; --text-caption-2-m-font-size: 0.875rem; --text-caption-2-m-line-height: 1rem; --text-caption-2-m-font-weight: 600; --text-caption-2-m-letter-spacing: -0.01em; --text-caption-2-m-text-transform: none; --text-caption-3-l-font-size: 0.75rem; --text-caption-3-l-line-height: 0.875rem; --text-caption-3-l-font-weight: 700; --text-caption-3-l-letter-spacing: -0.01em; --text-caption-3-l-text-transform: none; --text-caption-3-m-font-size: 0.75rem; --text-caption-3-m-line-height: 0.875rem; --text-caption-3-m-font-weight: 600; --text-caption-3-m-letter-spacing: -0.01em; --text-caption-3-m-text-transform: none; --text-caption-4-l-font-size: 0.625rem; --text-caption-4-l-line-height: 0.625rem; --text-caption-4-l-font-weight: 700; --text-caption-4-l-letter-spacing: -0.01em; --text-caption-4-l-text-transform: none; --text-caption-4-m-font-size: 0.625rem; --text-caption-4-m-line-height: 0.625rem; --text-caption-4-m-font-weight: 600; --text-caption-4-m-letter-spacing: -0.01em; --text-caption-4-m-text-transform: none; /* Breakpoints (for use in media queries) */ --breakpoint-mobile: 1024px; --breakpoint-desktop: 1025px; /* Border radius */ --radius-sm: 0.1875em; --radius-md: 0.5em; --radius-lg: 0.75em; /* Shadows */ --shadow-sm: 0 0.0625em 0.125em rgba(0, 0, 0, 0.05); --shadow-md: 0 0.25em 0.375em rgba(0, 0, 0, 0.1); --shadow-lg: 0 0.625em 0.9375em rgba(0, 0, 0, 0.1); /* MISC Colors */ --color-misc-talent-card: #8DF800; --color-misc-bonus-card: #A641D0; --color-misc-bonus-gradient: linear-gradient(0deg, #21222A 0%, #9143CB 100%); --color-misc-black-fade-0: linear-gradient(0deg, #000000 0%, rgba(9, 14, 23, 0) 100%); --color-misc-black-fade-1: linear-gradient(0deg, #101010 0%, rgba(25, 26, 31, 0) 100%); /* Gradients */ --gradient-primary: linear-gradient(90deg, #0062FF 0%, #001D6D 100%); --gradient-secondary: linear-gradient(90deg, #0C1E54 0%, #0C44A4 100%); --gradient-light: linear-gradient(90deg, #1B6AB1 0%, #7DC2FF 100%); --gradient-accent: linear-gradient(90deg, #FFEE6A 0%, #CD9A17 100%); --gradient-dark: linear-gradient(180deg, #151319 0%, #262930 100%); /* Elevation */ --elevation-0: #000000; --elevation-1: #101010; --elevation-2: #202020; --elevation-3: #282828; --elevation-4: #303030; --elevation-5: #383838; --elevation-6: #404040; /* Card Effects */ --card-effect-base: conic-gradient(from 180deg at 48.5% 50%, #989DA3 -46.16deg, #101012 130.63deg, #9DA2A9 133.38deg, #121214 311.43deg, #989DA3 313.84deg, #101012 490.63deg); --card-effect-bronze: linear-gradient(90deg, #B5947D 0%, #B6937D 6.65%, #FFECE0 8.25%, #F0CAB2 30.69%, #A47C6C 34.31%, #7F5B4A 65.92%, #AC836D 74.36%, #AB836E 91.3%, #8E6958 100%); --card-effect-silverg: linear-gradient(74.17deg, #7A7F81 13.43%, #9EA1A1 26.76%, #979E9D 47.44%, #798082 53.73%, #8E9799 77.78%, #9EA3A5 86.51%, #8A9092 95.7%); --card-effect-gold-1: conic-gradient(from 180deg at 48.5% 50%, #FFEAC2 -46.16deg, #4B2A16 130.63deg, #EAB872 133.38deg, #AE824E 204.46deg, #533018 311.43deg, #FFEAC2 313.84deg, #4B2A16 490.63deg); --card-effect-gold-2: linear-gradient(75.74deg, #C1A875 12.49%, #EAB872 26.21%, #AE824E 47.49%, #C1A875 53.96%, #C1A875 78.71%, #EAB872 87.7%, #C1A875 97.16%); --card-effect-sapphire: conic-gradient(from -1.98deg at 91% 2.08%, #52F9FF 0deg, #68E3FE 26.25deg, #2E9BFF 161.27deg, #52F9FF 176.4deg, #2E9BFF 204.68deg, #52F9FF 255deg, #2E9BFF 309.38deg, #52F9FF 360deg); } .text-title-1-l { font-size: var(--text-title-1-l-font-size); line-height: var(--text-title-1-l-line-height); font-weight: var(--text-title-1-l-font-weight); letter-spacing: var(--text-title-1-l-letter-spacing); text-transform: var(--text-title-1-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-1-m { font-size: var(--text-title-1-m-font-size); line-height: var(--text-title-1-m-line-height); font-weight: var(--text-title-1-m-font-weight); letter-spacing: var(--text-title-1-m-letter-spacing); text-transform: var(--text-title-1-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-2-l { font-size: var(--text-title-2-l-font-size); line-height: var(--text-title-2-l-line-height); font-weight: var(--text-title-2-l-font-weight); letter-spacing: var(--text-title-2-l-letter-spacing); text-transform: var(--text-title-2-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-2-m { font-size: var(--text-title-2-m-font-size); line-height: var(--text-title-2-m-line-height); font-weight: var(--text-title-2-m-font-weight); letter-spacing: var(--text-title-2-m-letter-spacing); text-transform: var(--text-title-2-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-3-l { font-size: var(--text-title-3-l-font-size); line-height: var(--text-title-3-l-line-height); font-weight: var(--text-title-3-l-font-weight); letter-spacing: var(--text-title-3-l-letter-spacing); text-transform: var(--text-title-3-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-3-m { font-size: var(--text-title-3-m-font-size); line-height: var(--text-title-3-m-line-height); font-weight: var(--text-title-3-m-font-weight); letter-spacing: var(--text-title-3-m-letter-spacing); text-transform: var(--text-title-3-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-4-l { font-size: var(--text-title-4-l-font-size); line-height: var(--text-title-4-l-line-height); font-weight: var(--text-title-4-l-font-weight); letter-spacing: var(--text-title-4-l-letter-spacing); text-transform: var(--text-title-4-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-4-m { font-size: var(--text-title-4-m-font-size); line-height: var(--text-title-4-m-line-height); font-weight: var(--text-title-4-m-font-weight); letter-spacing: var(--text-title-4-m-letter-spacing); text-transform: var(--text-title-4-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-1-l { font-size: var(--text-subtitle-1-l-font-size); line-height: var(--text-subtitle-1-l-line-height); font-weight: var(--text-subtitle-1-l-font-weight); letter-spacing: var(--text-subtitle-1-l-letter-spacing); text-transform: var(--text-subtitle-1-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-1-m { font-size: var(--text-subtitle-1-m-font-size); line-height: var(--text-subtitle-1-m-line-height); font-weight: var(--text-subtitle-1-m-font-weight); letter-spacing: var(--text-subtitle-1-m-letter-spacing); text-transform: var(--text-subtitle-1-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-2-l { font-size: var(--text-subtitle-2-l-font-size); line-height: var(--text-subtitle-2-l-line-height); font-weight: var(--text-subtitle-2-l-font-weight); letter-spacing: var(--text-subtitle-2-l-letter-spacing); text-transform: var(--text-subtitle-2-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-2-m { font-size: var(--text-subtitle-2-m-font-size); line-height: var(--text-subtitle-2-m-line-height); font-weight: var(--text-subtitle-2-m-font-weight); letter-spacing: var(--text-subtitle-2-m-letter-spacing); text-transform: var(--text-subtitle-2-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-3-l, ion-popover ion-item:first-of-type ion-radio::part(label) { font-size: var(--text-subtitle-3-l-font-size); line-height: var(--text-subtitle-3-l-line-height); font-weight: var(--text-subtitle-3-l-font-weight); letter-spacing: var(--text-subtitle-3-l-letter-spacing); text-transform: var(--text-subtitle-3-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-3-m, ion-popover ion-item ion-radio::part(label) { font-size: var(--text-subtitle-3-m-font-size); line-height: var(--text-subtitle-3-m-line-height); font-weight: var(--text-subtitle-3-m-font-weight); letter-spacing: var(--text-subtitle-3-m-letter-spacing); text-transform: var(--text-subtitle-3-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-4-l { font-size: var(--text-subtitle-4-l-font-size); line-height: var(--text-subtitle-4-l-line-height); font-weight: var(--text-subtitle-4-l-font-weight); letter-spacing: var(--text-subtitle-4-l-letter-spacing); text-transform: var(--text-subtitle-4-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-4-m { font-size: var(--text-subtitle-4-m-font-size); line-height: var(--text-subtitle-4-m-line-height); font-weight: var(--text-subtitle-4-m-font-weight); letter-spacing: var(--text-subtitle-4-m-letter-spacing); text-transform: var(--text-subtitle-4-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-1-l { font-size: var(--text-label-1-l-font-size); line-height: var(--text-label-1-l-line-height); font-weight: var(--text-label-1-l-font-weight); letter-spacing: var(--text-label-1-l-letter-spacing); text-transform: var(--text-label-1-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-1-m { font-size: var(--text-label-1-m-font-size); line-height: var(--text-label-1-m-line-height); font-weight: var(--text-label-1-m-font-weight); letter-spacing: var(--text-label-1-m-letter-spacing); text-transform: var(--text-label-1-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-2-l { font-size: var(--text-label-2-l-font-size); line-height: var(--text-label-2-l-line-height); font-weight: var(--text-label-2-l-font-weight); letter-spacing: var(--text-label-2-l-letter-spacing); text-transform: var(--text-label-2-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-2-m { font-size: var(--text-label-2-m-font-size); line-height: var(--text-label-2-m-line-height); font-weight: var(--text-label-2-m-font-weight); letter-spacing: var(--text-label-2-m-letter-spacing); text-transform: var(--text-label-2-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-3-l { font-size: var(--text-label-3-l-font-size); line-height: var(--text-label-3-l-line-height); font-weight: var(--text-label-3-l-font-weight); letter-spacing: var(--text-label-3-l-letter-spacing); text-transform: var(--text-label-3-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-3-m { font-size: var(--text-label-3-m-font-size); line-height: var(--text-label-3-m-line-height); font-weight: var(--text-label-3-m-font-weight); letter-spacing: var(--text-label-3-m-letter-spacing); text-transform: var(--text-label-3-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-button-1 { font-size: var(--text-button-1-font-size); line-height: var(--text-button-1-line-height); font-weight: var(--text-button-1-font-weight); letter-spacing: var(--text-button-1-letter-spacing); text-transform: var(--text-button-1-text-transform); font-family: var(--font-family-saira-condensed); } .text-button-2 { font-size: var(--text-button-2-font-size); line-height: var(--text-button-2-line-height); font-weight: var(--text-button-2-font-weight); letter-spacing: var(--text-button-2-letter-spacing); text-transform: var(--text-button-2-text-transform); font-family: var(--font-family-saira-condensed); } .text-button-3 { font-size: var(--text-button-3-font-size); line-height: var(--text-button-3-line-height); font-weight: var(--text-button-3-font-weight); letter-spacing: var(--text-button-3-letter-spacing); text-transform: var(--text-button-3-text-transform); font-family: var(--font-family-saira-condensed); } .text-button-4 { font-size: var(--text-button-4-font-size); line-height: var(--text-button-4-line-height); font-weight: var(--text-button-4-font-weight); letter-spacing: var(--text-button-4-letter-spacing); text-transform: var(--text-button-4-text-transform); font-family: var(--font-family-saira-condensed); } .text-body-1 { font-size: var(--text-body-1-font-size); line-height: var(--text-body-1-line-height); font-weight: var(--text-body-1-font-weight); letter-spacing: var(--text-body-1-letter-spacing); text-transform: var(--text-body-1-text-transform); font-family: var(--font-family-saira); } .text-body-2 { font-size: var(--text-body-2-font-size); line-height: var(--text-body-2-line-height); font-weight: var(--text-body-2-font-weight); letter-spacing: var(--text-body-2-letter-spacing); text-transform: var(--text-body-2-text-transform); font-family: var(--font-family-saira); } .text-body-3 { font-size: var(--text-body-3-font-size); line-height: var(--text-body-3-line-height); font-weight: var(--text-body-3-font-weight); letter-spacing: var(--text-body-3-letter-spacing); text-transform: var(--text-body-3-text-transform); font-family: var(--font-family-saira); } .text-body-4 { font-size: var(--text-body-4-font-size); line-height: var(--text-body-4-line-height); font-weight: var(--text-body-4-font-weight); letter-spacing: var(--text-body-4-letter-spacing); text-transform: var(--text-body-4-text-transform); font-family: var(--font-family-saira); } .text-overline-1-l { font-size: var(--text-overline-1-l-font-size); line-height: var(--text-overline-1-l-line-height); font-weight: var(--text-overline-1-l-font-weight); letter-spacing: var(--text-overline-1-l-letter-spacing); text-transform: var(--text-overline-1-l-text-transform); font-family: var(--font-family-saira); } .text-overline-1-m { font-size: var(--text-overline-1-m-font-size); line-height: var(--text-overline-1-m-line-height); font-weight: var(--text-overline-1-m-font-weight); letter-spacing: var(--text-overline-1-m-letter-spacing); text-transform: var(--text-overline-1-m-text-transform); font-family: var(--font-family-saira); } .text-overline-2-l { font-size: var(--text-overline-2-l-font-size); line-height: var(--text-overline-2-l-line-height); font-weight: var(--text-overline-2-l-font-weight); letter-spacing: var(--text-overline-2-l-letter-spacing); text-transform: var(--text-overline-2-l-text-transform); font-family: var(--font-family-saira); } .text-overline-2-m { font-size: var(--text-overline-2-m-font-size); line-height: var(--text-overline-2-m-line-height); font-weight: var(--text-overline-2-m-font-weight); letter-spacing: var(--text-overline-2-m-letter-spacing); text-transform: var(--text-overline-2-m-text-transform); font-family: var(--font-family-saira); } .text-caption-1-l { font-size: var(--text-caption-1-l-font-size); line-height: var(--text-caption-1-l-line-height); font-weight: var(--text-caption-1-l-font-weight); letter-spacing: var(--text-caption-1-l-letter-spacing); text-transform: var(--text-caption-1-l-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-1-m { font-size: var(--text-caption-1-m-font-size); line-height: var(--text-caption-1-m-line-height); font-weight: var(--text-caption-1-m-font-weight); letter-spacing: var(--text-caption-1-m-letter-spacing); text-transform: var(--text-caption-1-m-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-2-l { font-size: var(--text-caption-2-l-font-size); line-height: var(--text-caption-2-l-line-height); font-weight: var(--text-caption-2-l-font-weight); letter-spacing: var(--text-caption-2-l-letter-spacing); text-transform: var(--text-caption-2-l-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-2-m { font-size: var(--text-caption-2-m-font-size); line-height: var(--text-caption-2-m-line-height); font-weight: var(--text-caption-2-m-font-weight); letter-spacing: var(--text-caption-2-m-letter-spacing); text-transform: var(--text-caption-2-m-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-3-l { font-size: var(--text-caption-3-l-font-size); line-height: var(--text-caption-3-l-line-height); font-weight: var(--text-caption-3-l-font-weight); letter-spacing: var(--text-caption-3-l-letter-spacing); text-transform: var(--text-caption-3-l-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-3-m { font-size: var(--text-caption-3-m-font-size); line-height: var(--text-caption-3-m-line-height); font-weight: var(--text-caption-3-m-font-weight); letter-spacing: var(--text-caption-3-m-letter-spacing); text-transform: var(--text-caption-3-m-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-4-l { font-size: var(--text-caption-4-l-font-size); line-height: var(--text-caption-4-l-line-height); font-weight: var(--text-caption-4-l-font-weight); letter-spacing: var(--text-caption-4-l-letter-spacing); text-transform: var(--text-caption-4-l-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-4-m { font-size: var(--text-caption-4-m-font-size); line-height: var(--text-caption-4-m-line-height); font-weight: var(--text-caption-4-m-font-weight); letter-spacing: var(--text-caption-4-m-letter-spacing); text-transform: var(--text-caption-4-m-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } ion-popover { --width: var(--uf-select-width, auto); --min-width: var(--uf-select-width, auto); --max-width: var(--uf-select-width, auto); } ion-popover::part(arrow) { display: none; } ion-popover::part(content) { --offset-y: 1.75em; border-radius: 0.5em; border: 1px solid var(--color-neutral-400); left: calc((100vw - var(--uf-select-width, 0px)) / 2); } ion-popover ion-item { --border-width: 0.0625em; --border-color: var(--color-neutral-800); --inner-border-width: 0; --border-radius: 0.5em; --padding-start: 0.5em; --padding-end: 0.5em; --min-height: 2.125em; } ion-popover ion-item ion-radio::part(label) { color: var(--color-neutral-300); max-height: 24px; margin: 5px 0; } ion-popover ion-item:first-of-type { --border-width: 0.0625em; } ion-popover ion-item:first-of-type ion-radio::part(label) { max-height: 24px; margin: 8px 0; }.login-page[data-v-c6ec98be] { --background: var(--color-background); } .login-page__content[data-v-c6ec98be] { min-height: 100vh; }:root{--ion-color-primary: #0054e9;--ion-color-primary-rgb: 0, 84, 233;--ion-color-primary-contrast: #fff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #004acd;--ion-color-primary-tint: #1a65eb;--ion-color-secondary: #0163aa;--ion-color-secondary-rgb: 1, 99, 170;--ion-color-secondary-contrast: #fff;--ion-color-secondary-contrast-rgb: 255, 255, 255;--ion-color-secondary-shade: #015796;--ion-color-secondary-tint: #1a73b3;--ion-color-tertiary: #6030ff;--ion-color-tertiary-rgb: 96, 48, 255;--ion-color-tertiary-contrast: #fff;--ion-color-tertiary-contrast-rgb: 255, 255, 255;--ion-color-tertiary-shade: #542ae0;--ion-color-tertiary-tint: #7045ff;--ion-color-success: #2dd55b;--ion-color-success-rgb: 45, 213, 91;--ion-color-success-contrast: #000;--ion-color-success-contrast-rgb: 0, 0, 0;--ion-color-success-shade: #28bb50;--ion-color-success-tint: #42d96b;--ion-color-warning: #ffc409;--ion-color-warning-rgb: 255, 196, 9;--ion-color-warning-contrast: #000;--ion-color-warning-contrast-rgb: 0, 0, 0;--ion-color-warning-shade: #e0ac08;--ion-color-warning-tint: #ffca22;--ion-color-danger: #c5000f;--ion-color-danger-rgb: 197, 0, 15;--ion-color-danger-contrast: #fff;--ion-color-danger-contrast-rgb: 255, 255, 255;--ion-color-danger-shade: #ad000d;--ion-color-danger-tint: #cb1a27;--ion-color-light: #f4f5f8;--ion-color-light-rgb: 244, 245, 248;--ion-color-light-contrast: #000;--ion-color-light-contrast-rgb: 0, 0, 0;--ion-color-light-shade: #d7d8da;--ion-color-light-tint: #f5f6f9;--ion-color-medium: #636469;--ion-color-medium-rgb: 99, 100, 105;--ion-color-medium-contrast: #fff;--ion-color-medium-contrast-rgb: 255, 255, 255;--ion-color-medium-shade: #57585c;--ion-color-medium-tint: #737478;--ion-color-dark: #222428;--ion-color-dark-rgb: 34, 36, 40;--ion-color-dark-contrast: #fff;--ion-color-dark-contrast-rgb: 255, 255, 255;--ion-color-dark-shade: #1e2023;--ion-color-dark-tint: #383a3e}html.ios{--ion-default-font: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Roboto", sans-serif}html.md{--ion-default-font: "Roboto", "Helvetica Neue", sans-serif}html{--ion-dynamic-font: -apple-system-body;--ion-font-family: var(--ion-default-font)}body{background:var(--ion-background-color);color:var(--ion-text-color)}body.backdrop-no-scroll{overflow:hidden}html.ios ion-modal.modal-card ion-header ion-toolbar:first-of-type,html.ios ion-modal.modal-sheet ion-header ion-toolbar:first-of-type,html.ios ion-modal ion-footer ion-toolbar:first-of-type,html.ios ion-footer.modal-footer-moving ion-toolbar:first-of-type{padding-top:6px}html.ios ion-modal.modal-card ion-header ion-toolbar:last-of-type,html.ios ion-modal.modal-sheet ion-header ion-toolbar:last-of-type{padding-bottom:6px}html.ios ion-modal ion-toolbar,html.ios .modal-footer-moving ion-toolbar{padding-right:calc(var(--ion-safe-area-right) + 8px);padding-left:calc(var(--ion-safe-area-left) + 8px)}@media screen and (min-width: 768px){html.ios ion-modal.modal-card:first-of-type{--backdrop-opacity: 0.18}}ion-modal.modal-default.show-modal~ion-modal.modal-default{--backdrop-opacity: 0;--box-shadow: none}html.ios ion-modal.modal-card .ion-page{border-top-left-radius:var(--border-radius)}.ion-color-primary{--ion-color-base: var(--ion-color-primary, #0054e9) !important;--ion-color-base-rgb: var(--ion-color-primary-rgb, 0, 84, 233) !important;--ion-color-contrast: var(--ion-color-primary-contrast, #fff) !important;--ion-color-contrast-rgb: var(--ion-color-primary-contrast-rgb, 255, 255, 255) !important;--ion-color-shade: var(--ion-color-primary-shade, #004acd) !important;--ion-color-tint: var(--ion-color-primary-tint, #1a65eb) !important}.ion-color-secondary{--ion-color-base: var(--ion-color-secondary, #0163aa) !important;--ion-color-base-rgb: var(--ion-color-secondary-rgb, 1, 99, 170) !important;--ion-color-contrast: var(--ion-color-secondary-contrast, #fff) !important;--ion-color-contrast-rgb: var(--ion-color-secondary-contrast-rgb, 255, 255, 255) !important;--ion-color-shade: var(--ion-color-secondary-shade, #015796) !important;--ion-color-tint: var(--ion-color-secondary-tint, #1a73b3) !important}.ion-color-tertiary{--ion-color-base: var(--ion-color-tertiary, #6030ff) !important;--ion-color-base-rgb: var(--ion-color-tertiary-rgb, 96, 48, 255) !important;--ion-color-contrast: var(--ion-color-tertiary-contrast, #fff) !important;--ion-color-contrast-rgb: var(--ion-color-tertiary-contrast-rgb, 255, 255, 255) !important;--ion-color-shade: var(--ion-color-tertiary-shade, #542ae0) !important;--ion-color-tint: var(--ion-color-tertiary-tint, #7045ff) !important}.ion-color-success{--ion-color-base: var(--ion-color-success, #2dd55b) !important;--ion-color-base-rgb: var(--ion-color-success-rgb, 45, 213, 91) !important;--ion-color-contrast: var(--ion-color-success-contrast, #000) !important;--ion-color-contrast-rgb: var(--ion-color-success-contrast-rgb, 0, 0, 0) !important;--ion-color-shade: var(--ion-color-success-shade, #28bb50) !important;--ion-color-tint: var(--ion-color-success-tint, #42d96b) !important}.ion-color-warning{--ion-color-base: var(--ion-color-warning, #ffc409) !important;--ion-color-base-rgb: var(--ion-color-warning-rgb, 255, 196, 9) !important;--ion-color-contrast: var(--ion-color-warning-contrast, #000) !important;--ion-color-contrast-rgb: var(--ion-color-warning-contrast-rgb, 0, 0, 0) !important;--ion-color-shade: var(--ion-color-warning-shade, #e0ac08) !important;--ion-color-tint: var(--ion-color-warning-tint, #ffca22) !important}.ion-color-danger{--ion-color-base: var(--ion-color-danger, #c5000f) !important;--ion-color-base-rgb: var(--ion-color-danger-rgb, 197, 0, 15) !important;--ion-color-contrast: var(--ion-color-danger-contrast, #fff) !important;--ion-color-contrast-rgb: var(--ion-color-danger-contrast-rgb, 255, 255, 255) !important;--ion-color-shade: var(--ion-color-danger-shade, #ad000d) !important;--ion-color-tint: var(--ion-color-danger-tint, #cb1a27) !important}.ion-color-light{--ion-color-base: var(--ion-color-light, #f4f5f8) !important;--ion-color-base-rgb: var(--ion-color-light-rgb, 244, 245, 248) !important;--ion-color-contrast: var(--ion-color-light-contrast, #000) !important;--ion-color-contrast-rgb: var(--ion-color-light-contrast-rgb, 0, 0, 0) !important;--ion-color-shade: var(--ion-color-light-shade, #d7d8da) !important;--ion-color-tint: var(--ion-color-light-tint, #f5f6f9) !important}.ion-color-medium{--ion-color-base: var(--ion-color-medium, #636469) !important;--ion-color-base-rgb: var(--ion-color-medium-rgb, 99, 100, 105) !important;--ion-color-contrast: var(--ion-color-medium-contrast, #fff) !important;--ion-color-contrast-rgb: var(--ion-color-medium-contrast-rgb, 255, 255, 255) !important;--ion-color-shade: var(--ion-color-medium-shade, #57585c) !important;--ion-color-tint: var(--ion-color-medium-tint, #737478) !important}.ion-color-dark{--ion-color-base: var(--ion-color-dark, #222428) !important;--ion-color-base-rgb: var(--ion-color-dark-rgb, 34, 36, 40) !important;--ion-color-contrast: var(--ion-color-dark-contrast, #fff) !important;--ion-color-contrast-rgb: var(--ion-color-dark-contrast-rgb, 255, 255, 255) !important;--ion-color-shade: var(--ion-color-dark-shade, #1e2023) !important;--ion-color-tint: var(--ion-color-dark-tint, #383a3e) !important}.ion-page{left:0;right:0;top:0;bottom:0;display:flex;position:absolute;flex-direction:column;justify-content:space-between;contain:layout size style;z-index:0}.ion-page.ion-page-overlay-passthrough{pointer-events:none}ion-modal>.ion-page{position:relative;contain:layout style;height:100%}.split-pane-visible>.ion-page.split-pane-main{position:relative}ion-route,ion-route-redirect,ion-router,ion-select-option,ion-nav-controller,ion-menu-controller,ion-action-sheet-controller,ion-alert-controller,ion-loading-controller,ion-modal-controller,ion-picker-controller,ion-popover-controller,ion-toast-controller,.ion-page-hidden{display:none !important}.ion-page-invisible{opacity:0}.can-go-back>ion-header ion-back-button{display:block}html.plt-ios.plt-hybrid,html.plt-ios.plt-pwa{--ion-statusbar-padding: 20px}@supports(padding-top: 20px){html{--ion-safe-area-top: var(--ion-statusbar-padding)}}@supports(padding-top: env(safe-area-inset-top)){html{--ion-safe-area-top: env(safe-area-inset-top);--ion-safe-area-bottom: env(safe-area-inset-bottom);--ion-safe-area-left: env(safe-area-inset-left);--ion-safe-area-right: env(safe-area-inset-right)}}ion-card.ion-color .ion-inherit-color,ion-card-header.ion-color .ion-inherit-color{color:inherit}.menu-content{transform:translate3d(0, 0, 0)}.menu-content-open{cursor:pointer;touch-action:manipulation;pointer-events:none;overflow-y:hidden}.menu-content-open ion-content{--overflow: hidden}.menu-content-open .ion-content-scroll-host{overflow:hidden}.ios .menu-content-reveal{box-shadow:-8px 0 42px rgba(0,0,0,.08)}[dir=rtl].ios .menu-content-reveal{box-shadow:8px 0 42px rgba(0,0,0,.08)}.md .menu-content-reveal{box-shadow:4px 0px 16px rgba(0,0,0,.18)}.md .menu-content-push{box-shadow:4px 0px 16px rgba(0,0,0,.18)}ion-accordion-group.accordion-group-expand-inset>ion-accordion:first-of-type{border-top-left-radius:8px;border-top-right-radius:8px}ion-accordion-group.accordion-group-expand-inset>ion-accordion:last-of-type{border-bottom-left-radius:8px;border-bottom-right-radius:8px}ion-accordion-group>ion-accordion:last-of-type ion-item[slot=header]{--border-width: 0px}ion-accordion.accordion-animated>[slot=header] .ion-accordion-toggle-icon{transition:300ms transform cubic-bezier(0.25, 0.8, 0.5, 1)}@media(prefers-reduced-motion: reduce){ion-accordion .ion-accordion-toggle-icon{transition:none !important}}ion-accordion.accordion-expanding>[slot=header] .ion-accordion-toggle-icon,ion-accordion.accordion-expanded>[slot=header] .ion-accordion-toggle-icon{transform:rotate(180deg)}ion-accordion-group.accordion-group-expand-inset.md>ion-accordion.accordion-previous ion-item[slot=header]{--border-width: 0px;--inner-border-width: 0px}ion-accordion-group.accordion-group-expand-inset.md>ion-accordion.accordion-expanding:first-of-type,ion-accordion-group.accordion-group-expand-inset.md>ion-accordion.accordion-expanded:first-of-type{margin-top:0}ion-input input::-webkit-date-and-time-value{text-align:start}.ion-datetime-button-overlay{--width: fit-content;--height: fit-content}.ion-datetime-button-overlay ion-datetime.datetime-grid{width:320px;min-height:320px}[ion-last-focus],header[tabindex="-1"]:focus,[role=banner][tabindex="-1"]:focus,main[tabindex="-1"]:focus,[role=main][tabindex="-1"]:focus,h1[tabindex="-1"]:focus,[role=heading][aria-level="1"][tabindex="-1"]:focus{outline:none}.popover-viewport:has(>ion-content){overflow:hidden}@supports not selector(:has(> ion-content)){.popover-viewport{overflow:hidden}} /*# sourceMappingURL=core.css.map */audio,canvas,progress,video{vertical-align:baseline}audio:not([controls]){display:none;height:0}b,strong{font-weight:bold}img{max-width:100%}hr{height:1px;border-width:0;box-sizing:content-box}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}label,input,select,textarea{font-family:inherit;line-height:normal}textarea{overflow:auto;height:auto;font:inherit;color:inherit}textarea::-moz-placeholder{padding-left:2px}textarea::placeholder{padding-left:2px}form,input,optgroup,select{margin:0;font:inherit;color:inherit}html input[type=button],input[type=reset],input[type=submit]{cursor:pointer;-webkit-appearance:button}a,a div,a span,a ion-icon,a ion-label,button,button div,button span,button ion-icon,button ion-label,.ion-tappable,[tappable],[tappable] div,[tappable] span,[tappable] ion-icon,[tappable] ion-label,input,textarea{touch-action:manipulation}a ion-label,button ion-label{pointer-events:none}button{padding:0;border:0;border-radius:0;font-family:inherit;font-style:inherit;font-variant:inherit;line-height:1;text-transform:none;cursor:pointer;-webkit-appearance:button}[tappable]{cursor:pointer}a[disabled],button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}table{border-collapse:collapse;border-spacing:0}td,th{padding:0} /*# sourceMappingURL=normalize.css.map */*{box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}html{width:100%;height:100%;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}html.ion-ce body{display:block}html.plt-pwa{height:100vh}body{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;position:fixed;width:100%;max-width:100%;height:100%;max-height:100%;transform:translateZ(0);text-rendering:optimizeLegibility;overflow:hidden;touch-action:manipulation;-webkit-user-drag:none;-ms-content-zooming:none;word-wrap:break-word;overscroll-behavior-y:none;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none} /*# sourceMappingURL=structure.css.map */html{font-family:var(--ion-font-family)}@supports(-webkit-touch-callout: none){html{font:var(--ion-dynamic-font, 16px var(--ion-font-family))}}a{background-color:transparent;color:var(--ion-color-primary, #0054e9)}h1,h2,h3,h4,h5,h6{margin-top:16px;margin-bottom:10px;font-weight:500;line-height:1.2}h1{margin-top:20px;font-size:1.625rem}h2{margin-top:18px;font-size:1.5rem}h3{font-size:1.375rem}h4{font-size:1.25rem}h5{font-size:1.125rem}h6{font-size:1rem}small{font-size:75%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em} /*# sourceMappingURL=typography.css.map */.ion-hide{display:none !important}.ion-hide-up{display:none !important}.ion-hide-down{display:none !important}@media(min-width: 576px){.ion-hide-sm-up{display:none !important}}@media(max-width: 575.98px){.ion-hide-sm-down{display:none !important}}@media(min-width: 768px){.ion-hide-md-up{display:none !important}}@media(max-width: 767.98px){.ion-hide-md-down{display:none !important}}@media(min-width: 992px){.ion-hide-lg-up{display:none !important}}@media(max-width: 991.98px){.ion-hide-lg-down{display:none !important}}@media(min-width: 1200px){.ion-hide-xl-up{display:none !important}}@media(max-width: 1199.98px){.ion-hide-xl-down{display:none !important}}.ion-display-none{display:none !important}@media(min-width: 576px){.ion-display-sm-none{display:none !important}}@media(min-width: 768px){.ion-display-md-none{display:none !important}}@media(min-width: 992px){.ion-display-lg-none{display:none !important}}@media(min-width: 1200px){.ion-display-xl-none{display:none !important}}.ion-display-inline{display:inline !important}@media(min-width: 576px){.ion-display-sm-inline{display:inline !important}}@media(min-width: 768px){.ion-display-md-inline{display:inline !important}}@media(min-width: 992px){.ion-display-lg-inline{display:inline !important}}@media(min-width: 1200px){.ion-display-xl-inline{display:inline !important}}.ion-display-inline-block{display:inline-block !important}@media(min-width: 576px){.ion-display-sm-inline-block{display:inline-block !important}}@media(min-width: 768px){.ion-display-md-inline-block{display:inline-block !important}}@media(min-width: 992px){.ion-display-lg-inline-block{display:inline-block !important}}@media(min-width: 1200px){.ion-display-xl-inline-block{display:inline-block !important}}.ion-display-block{display:block !important}@media(min-width: 576px){.ion-display-sm-block{display:block !important}}@media(min-width: 768px){.ion-display-md-block{display:block !important}}@media(min-width: 992px){.ion-display-lg-block{display:block !important}}@media(min-width: 1200px){.ion-display-xl-block{display:block !important}}.ion-display-flex{display:flex !important}@media(min-width: 576px){.ion-display-sm-flex{display:flex !important}}@media(min-width: 768px){.ion-display-md-flex{display:flex !important}}@media(min-width: 992px){.ion-display-lg-flex{display:flex !important}}@media(min-width: 1200px){.ion-display-xl-flex{display:flex !important}}.ion-display-inline-flex{display:inline-flex !important}@media(min-width: 576px){.ion-display-sm-inline-flex{display:inline-flex !important}}@media(min-width: 768px){.ion-display-md-inline-flex{display:inline-flex !important}}@media(min-width: 992px){.ion-display-lg-inline-flex{display:inline-flex !important}}@media(min-width: 1200px){.ion-display-xl-inline-flex{display:inline-flex !important}}.ion-display-grid{display:grid !important}@media(min-width: 576px){.ion-display-sm-grid{display:grid !important}}@media(min-width: 768px){.ion-display-md-grid{display:grid !important}}@media(min-width: 992px){.ion-display-lg-grid{display:grid !important}}@media(min-width: 1200px){.ion-display-xl-grid{display:grid !important}}.ion-display-inline-grid{display:inline-grid !important}@media(min-width: 576px){.ion-display-sm-inline-grid{display:inline-grid !important}}@media(min-width: 768px){.ion-display-md-inline-grid{display:inline-grid !important}}@media(min-width: 992px){.ion-display-lg-inline-grid{display:inline-grid !important}}@media(min-width: 1200px){.ion-display-xl-inline-grid{display:inline-grid !important}}.ion-display-table{display:table !important}@media(min-width: 576px){.ion-display-sm-table{display:table !important}}@media(min-width: 768px){.ion-display-md-table{display:table !important}}@media(min-width: 992px){.ion-display-lg-table{display:table !important}}@media(min-width: 1200px){.ion-display-xl-table{display:table !important}}.ion-display-table-cell{display:table-cell !important}@media(min-width: 576px){.ion-display-sm-table-cell{display:table-cell !important}}@media(min-width: 768px){.ion-display-md-table-cell{display:table-cell !important}}@media(min-width: 992px){.ion-display-lg-table-cell{display:table-cell !important}}@media(min-width: 1200px){.ion-display-xl-table-cell{display:table-cell !important}}.ion-display-table-row{display:table-row !important}@media(min-width: 576px){.ion-display-sm-table-row{display:table-row !important}}@media(min-width: 768px){.ion-display-md-table-row{display:table-row !important}}@media(min-width: 992px){.ion-display-lg-table-row{display:table-row !important}}@media(min-width: 1200px){.ion-display-xl-table-row{display:table-row !important}} /*# sourceMappingURL=display.css.map */.ion-no-padding{--padding-start: 0;--padding-end: 0;--padding-top: 0;--padding-bottom: 0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}.ion-padding{--padding-start: var(--ion-padding, 16px);--padding-end: var(--ion-padding, 16px);--padding-top: var(--ion-padding, 16px);--padding-bottom: var(--ion-padding, 16px);padding-inline-start:var(--ion-padding, 16px);padding-inline-end:var(--ion-padding, 16px);padding-top:var(--ion-padding, 16px);padding-bottom:var(--ion-padding, 16px)}.ion-padding-top{--padding-top: var(--ion-padding, 16px);padding-top:var(--ion-padding, 16px)}.ion-padding-start{--padding-start: var(--ion-padding, 16px);padding-inline-start:var(--ion-padding, 16px)}.ion-padding-end{--padding-end: var(--ion-padding, 16px);padding-inline-end:var(--ion-padding, 16px)}.ion-padding-bottom{--padding-bottom: var(--ion-padding, 16px);padding-bottom:var(--ion-padding, 16px)}.ion-padding-vertical{--padding-top: var(--ion-padding, 16px);--padding-bottom: var(--ion-padding, 16px);padding-top:var(--ion-padding, 16px);padding-bottom:var(--ion-padding, 16px)}.ion-padding-horizontal{--padding-start: var(--ion-padding, 16px);--padding-end: var(--ion-padding, 16px);padding-inline-start:var(--ion-padding, 16px);padding-inline-end:var(--ion-padding, 16px)}.ion-no-margin{--margin-start: 0;--margin-end: 0;--margin-top: 0;--margin-bottom: 0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.ion-margin{--margin-start: var(--ion-margin, 16px);--margin-end: var(--ion-margin, 16px);--margin-top: var(--ion-margin, 16px);--margin-bottom: var(--ion-margin, 16px);margin-inline-start:var(--ion-margin, 16px);margin-inline-end:var(--ion-margin, 16px);margin-top:var(--ion-margin, 16px);margin-bottom:var(--ion-margin, 16px)}.ion-margin-top{--margin-top: var(--ion-margin, 16px);margin-top:var(--ion-margin, 16px)}.ion-margin-start{--margin-start: var(--ion-margin, 16px);margin-inline-start:var(--ion-margin, 16px)}.ion-margin-end{--margin-end: var(--ion-margin, 16px);margin-inline-end:var(--ion-margin, 16px)}.ion-margin-bottom{--margin-bottom: var(--ion-margin, 16px);margin-bottom:var(--ion-margin, 16px)}.ion-margin-vertical{--margin-top: var(--ion-margin, 16px);--margin-bottom: var(--ion-margin, 16px);margin-top:var(--ion-margin, 16px);margin-bottom:var(--ion-margin, 16px)}.ion-margin-horizontal{--margin-start: var(--ion-margin, 16px);--margin-end: var(--ion-margin, 16px);margin-inline-start:var(--ion-margin, 16px);margin-inline-end:var(--ion-margin, 16px)} /*# sourceMappingURL=padding.css.map */.ion-float-left{float:left !important}.ion-float-right{float:right !important}.ion-float-start{float:left !important}:host-context([dir=rtl]) .ion-float-start{float:right !important}[dir=rtl] .ion-float-start{float:right !important}@supports selector(:dir(rtl)){.ion-float-start:dir(rtl){float:right !important}}.ion-float-end{float:right !important}:host-context([dir=rtl]) .ion-float-end{float:left !important}[dir=rtl] .ion-float-end{float:left !important}@supports selector(:dir(rtl)){.ion-float-end:dir(rtl){float:left !important}}@media(min-width: 576px){.ion-float-sm-left{float:left !important}.ion-float-sm-right{float:right !important}.ion-float-sm-start{float:left !important}:host-context([dir=rtl]) .ion-float-sm-start{float:right !important}[dir=rtl] .ion-float-sm-start{float:right !important}@supports selector(:dir(rtl)){.ion-float-sm-start:dir(rtl){float:right !important}}.ion-float-sm-end{float:right !important}:host-context([dir=rtl]) .ion-float-sm-end{float:left !important}[dir=rtl] .ion-float-sm-end{float:left !important}@supports selector(:dir(rtl)){.ion-float-sm-end:dir(rtl){float:left !important}}}@media(min-width: 768px){.ion-float-md-left{float:left !important}.ion-float-md-right{float:right !important}.ion-float-md-start{float:left !important}:host-context([dir=rtl]) .ion-float-md-start{float:right !important}[dir=rtl] .ion-float-md-start{float:right !important}@supports selector(:dir(rtl)){.ion-float-md-start:dir(rtl){float:right !important}}.ion-float-md-end{float:right !important}:host-context([dir=rtl]) .ion-float-md-end{float:left !important}[dir=rtl] .ion-float-md-end{float:left !important}@supports selector(:dir(rtl)){.ion-float-md-end:dir(rtl){float:left !important}}}@media(min-width: 992px){.ion-float-lg-left{float:left !important}.ion-float-lg-right{float:right !important}.ion-float-lg-start{float:left !important}:host-context([dir=rtl]) .ion-float-lg-start{float:right !important}[dir=rtl] .ion-float-lg-start{float:right !important}@supports selector(:dir(rtl)){.ion-float-lg-start:dir(rtl){float:right !important}}.ion-float-lg-end{float:right !important}:host-context([dir=rtl]) .ion-float-lg-end{float:left !important}[dir=rtl] .ion-float-lg-end{float:left !important}@supports selector(:dir(rtl)){.ion-float-lg-end:dir(rtl){float:left !important}}}@media(min-width: 1200px){.ion-float-xl-left{float:left !important}.ion-float-xl-right{float:right !important}.ion-float-xl-start{float:left !important}:host-context([dir=rtl]) .ion-float-xl-start{float:right !important}[dir=rtl] .ion-float-xl-start{float:right !important}@supports selector(:dir(rtl)){.ion-float-xl-start:dir(rtl){float:right !important}}.ion-float-xl-end{float:right !important}:host-context([dir=rtl]) .ion-float-xl-end{float:left !important}[dir=rtl] .ion-float-xl-end{float:left !important}@supports selector(:dir(rtl)){.ion-float-xl-end:dir(rtl){float:left !important}}} /*# sourceMappingURL=float-elements.css.map */.ion-text-center{text-align:center !important}.ion-text-justify{text-align:justify !important}.ion-text-start{text-align:start !important}.ion-text-end{text-align:end !important}.ion-text-left{text-align:left !important}.ion-text-right{text-align:right !important}.ion-text-nowrap{white-space:nowrap !important}.ion-text-wrap{white-space:normal !important}@media(min-width: 576px){.ion-text-sm-center{text-align:center !important}.ion-text-sm-justify{text-align:justify !important}.ion-text-sm-start{text-align:start !important}.ion-text-sm-end{text-align:end !important}.ion-text-sm-left{text-align:left !important}.ion-text-sm-right{text-align:right !important}.ion-text-sm-nowrap{white-space:nowrap !important}.ion-text-sm-wrap{white-space:normal !important}}@media(min-width: 768px){.ion-text-md-center{text-align:center !important}.ion-text-md-justify{text-align:justify !important}.ion-text-md-start{text-align:start !important}.ion-text-md-end{text-align:end !important}.ion-text-md-left{text-align:left !important}.ion-text-md-right{text-align:right !important}.ion-text-md-nowrap{white-space:nowrap !important}.ion-text-md-wrap{white-space:normal !important}}@media(min-width: 992px){.ion-text-lg-center{text-align:center !important}.ion-text-lg-justify{text-align:justify !important}.ion-text-lg-start{text-align:start !important}.ion-text-lg-end{text-align:end !important}.ion-text-lg-left{text-align:left !important}.ion-text-lg-right{text-align:right !important}.ion-text-lg-nowrap{white-space:nowrap !important}.ion-text-lg-wrap{white-space:normal !important}}@media(min-width: 1200px){.ion-text-xl-center{text-align:center !important}.ion-text-xl-justify{text-align:justify !important}.ion-text-xl-start{text-align:start !important}.ion-text-xl-end{text-align:end !important}.ion-text-xl-left{text-align:left !important}.ion-text-xl-right{text-align:right !important}.ion-text-xl-nowrap{white-space:nowrap !important}.ion-text-xl-wrap{white-space:normal !important}} /*# sourceMappingURL=text-alignment.css.map */.ion-text-uppercase{text-transform:uppercase !important}.ion-text-lowercase{text-transform:lowercase !important}.ion-text-capitalize{text-transform:capitalize !important}@media(min-width: 576px){.ion-text-sm-uppercase{text-transform:uppercase !important}.ion-text-sm-lowercase{text-transform:lowercase !important}.ion-text-sm-capitalize{text-transform:capitalize !important}}@media(min-width: 768px){.ion-text-md-uppercase{text-transform:uppercase !important}.ion-text-md-lowercase{text-transform:lowercase !important}.ion-text-md-capitalize{text-transform:capitalize !important}}@media(min-width: 992px){.ion-text-lg-uppercase{text-transform:uppercase !important}.ion-text-lg-lowercase{text-transform:lowercase !important}.ion-text-lg-capitalize{text-transform:capitalize !important}}@media(min-width: 1200px){.ion-text-xl-uppercase{text-transform:uppercase !important}.ion-text-xl-lowercase{text-transform:lowercase !important}.ion-text-xl-capitalize{text-transform:capitalize !important}} /*# sourceMappingURL=text-transformation.css.map */.ion-align-content-start{align-content:flex-start !important}.ion-align-content-end{align-content:flex-end !important}.ion-align-content-center{align-content:center !important}.ion-align-content-between{align-content:space-between !important}.ion-align-content-around{align-content:space-around !important}.ion-align-content-stretch{align-content:stretch !important}@media(min-width: 576px){.ion-align-content-sm-start{align-content:flex-start !important}.ion-align-content-sm-end{align-content:flex-end !important}.ion-align-content-sm-center{align-content:center !important}.ion-align-content-sm-between{align-content:space-between !important}.ion-align-content-sm-around{align-content:space-around !important}.ion-align-content-sm-stretch{align-content:stretch !important}}@media(min-width: 768px){.ion-align-content-md-start{align-content:flex-start !important}.ion-align-content-md-end{align-content:flex-end !important}.ion-align-content-md-center{align-content:center !important}.ion-align-content-md-between{align-content:space-between !important}.ion-align-content-md-around{align-content:space-around !important}.ion-align-content-md-stretch{align-content:stretch !important}}@media(min-width: 992px){.ion-align-content-lg-start{align-content:flex-start !important}.ion-align-content-lg-end{align-content:flex-end !important}.ion-align-content-lg-center{align-content:center !important}.ion-align-content-lg-between{align-content:space-between !important}.ion-align-content-lg-around{align-content:space-around !important}.ion-align-content-lg-stretch{align-content:stretch !important}}@media(min-width: 1200px){.ion-align-content-xl-start{align-content:flex-start !important}.ion-align-content-xl-end{align-content:flex-end !important}.ion-align-content-xl-center{align-content:center !important}.ion-align-content-xl-between{align-content:space-between !important}.ion-align-content-xl-around{align-content:space-around !important}.ion-align-content-xl-stretch{align-content:stretch !important}}.ion-align-items-start{align-items:start !important}.ion-align-items-end{align-items:end !important}.ion-align-items-center{align-items:center !important}.ion-align-items-stretch{align-items:stretch !important}.ion-align-items-baseline{align-items:baseline !important}@media(min-width: 576px){.ion-align-items-sm-start{align-items:start !important}.ion-align-items-sm-end{align-items:end !important}.ion-align-items-sm-center{align-items:center !important}.ion-align-items-sm-stretch{align-items:stretch !important}.ion-align-items-sm-baseline{align-items:baseline !important}}@media(min-width: 768px){.ion-align-items-md-start{align-items:start !important}.ion-align-items-md-end{align-items:end !important}.ion-align-items-md-center{align-items:center !important}.ion-align-items-md-stretch{align-items:stretch !important}.ion-align-items-md-baseline{align-items:baseline !important}}@media(min-width: 992px){.ion-align-items-lg-start{align-items:start !important}.ion-align-items-lg-end{align-items:end !important}.ion-align-items-lg-center{align-items:center !important}.ion-align-items-lg-stretch{align-items:stretch !important}.ion-align-items-lg-baseline{align-items:baseline !important}}@media(min-width: 1200px){.ion-align-items-xl-start{align-items:start !important}.ion-align-items-xl-end{align-items:end !important}.ion-align-items-xl-center{align-items:center !important}.ion-align-items-xl-stretch{align-items:stretch !important}.ion-align-items-xl-baseline{align-items:baseline !important}}.ion-align-self-start{align-self:start !important}.ion-align-self-end{align-self:end !important}.ion-align-self-center{align-self:center !important}.ion-align-self-stretch{align-self:stretch !important}.ion-align-self-baseline{align-self:baseline !important}.ion-align-self-auto{align-self:auto !important}@media(min-width: 576px){.ion-align-self-sm-start{align-self:start !important}.ion-align-self-sm-end{align-self:end !important}.ion-align-self-sm-center{align-self:center !important}.ion-align-self-sm-stretch{align-self:stretch !important}.ion-align-self-sm-baseline{align-self:baseline !important}.ion-align-self-sm-auto{align-self:auto !important}}@media(min-width: 768px){.ion-align-self-md-start{align-self:start !important}.ion-align-self-md-end{align-self:end !important}.ion-align-self-md-center{align-self:center !important}.ion-align-self-md-stretch{align-self:stretch !important}.ion-align-self-md-baseline{align-self:baseline !important}.ion-align-self-md-auto{align-self:auto !important}}@media(min-width: 992px){.ion-align-self-lg-start{align-self:start !important}.ion-align-self-lg-end{align-self:end !important}.ion-align-self-lg-center{align-self:center !important}.ion-align-self-lg-stretch{align-self:stretch !important}.ion-align-self-lg-baseline{align-self:baseline !important}.ion-align-self-lg-auto{align-self:auto !important}}@media(min-width: 1200px){.ion-align-self-xl-start{align-self:start !important}.ion-align-self-xl-end{align-self:end !important}.ion-align-self-xl-center{align-self:center !important}.ion-align-self-xl-stretch{align-self:stretch !important}.ion-align-self-xl-baseline{align-self:baseline !important}.ion-align-self-xl-auto{align-self:auto !important}}.ion-justify-content-start{justify-content:flex-start !important}.ion-justify-content-end{justify-content:flex-end !important}.ion-justify-content-center{justify-content:center !important}.ion-justify-content-between{justify-content:space-between !important}.ion-justify-content-around{justify-content:space-around !important}.ion-justify-content-evenly{justify-content:space-evenly !important}@media(min-width: 576px){.ion-justify-content-sm-start{justify-content:flex-start !important}.ion-justify-content-sm-end{justify-content:flex-end !important}.ion-justify-content-sm-center{justify-content:center !important}.ion-justify-content-sm-between{justify-content:space-between !important}.ion-justify-content-sm-around{justify-content:space-around !important}.ion-justify-content-sm-evenly{justify-content:space-evenly !important}}@media(min-width: 768px){.ion-justify-content-md-start{justify-content:flex-start !important}.ion-justify-content-md-end{justify-content:flex-end !important}.ion-justify-content-md-center{justify-content:center !important}.ion-justify-content-md-between{justify-content:space-between !important}.ion-justify-content-md-around{justify-content:space-around !important}.ion-justify-content-md-evenly{justify-content:space-evenly !important}}@media(min-width: 992px){.ion-justify-content-lg-start{justify-content:flex-start !important}.ion-justify-content-lg-end{justify-content:flex-end !important}.ion-justify-content-lg-center{justify-content:center !important}.ion-justify-content-lg-between{justify-content:space-between !important}.ion-justify-content-lg-around{justify-content:space-around !important}.ion-justify-content-lg-evenly{justify-content:space-evenly !important}}@media(min-width: 1200px){.ion-justify-content-xl-start{justify-content:flex-start !important}.ion-justify-content-xl-end{justify-content:flex-end !important}.ion-justify-content-xl-center{justify-content:center !important}.ion-justify-content-xl-between{justify-content:space-between !important}.ion-justify-content-xl-around{justify-content:space-around !important}.ion-justify-content-xl-evenly{justify-content:space-evenly !important}}.ion-flex-row{flex-direction:row !important}.ion-flex-row-reverse{flex-direction:row-reverse !important}.ion-flex-column{flex-direction:column !important}.ion-flex-column-reverse{flex-direction:column-reverse !important}@media(min-width: 576px){.ion-flex-sm-row{flex-direction:row !important}.ion-flex-sm-row-reverse{flex-direction:row-reverse !important}.ion-flex-sm-column{flex-direction:column !important}.ion-flex-sm-column-reverse{flex-direction:column-reverse !important}}@media(min-width: 768px){.ion-flex-md-row{flex-direction:row !important}.ion-flex-md-row-reverse{flex-direction:row-reverse !important}.ion-flex-md-column{flex-direction:column !important}.ion-flex-md-column-reverse{flex-direction:column-reverse !important}}@media(min-width: 992px){.ion-flex-lg-row{flex-direction:row !important}.ion-flex-lg-row-reverse{flex-direction:row-reverse !important}.ion-flex-lg-column{flex-direction:column !important}.ion-flex-lg-column-reverse{flex-direction:column-reverse !important}}@media(min-width: 1200px){.ion-flex-xl-row{flex-direction:row !important}.ion-flex-xl-row-reverse{flex-direction:row-reverse !important}.ion-flex-xl-column{flex-direction:column !important}.ion-flex-xl-column-reverse{flex-direction:column-reverse !important}}.ion-wrap{flex-wrap:wrap !important}.ion-nowrap{flex-wrap:nowrap !important}.ion-wrap-reverse{flex-wrap:wrap-reverse !important}.ion-flex-wrap{flex-wrap:wrap !important}.ion-flex-nowrap{flex-wrap:nowrap !important}.ion-flex-wrap-reverse{flex-wrap:wrap-reverse !important}@media(min-width: 576px){.ion-flex-sm-wrap{flex-wrap:wrap !important}.ion-flex-sm-nowrap{flex-wrap:nowrap !important}.ion-flex-sm-wrap-reverse{flex-wrap:wrap-reverse !important}}@media(min-width: 768px){.ion-flex-md-wrap{flex-wrap:wrap !important}.ion-flex-md-nowrap{flex-wrap:nowrap !important}.ion-flex-md-wrap-reverse{flex-wrap:wrap-reverse !important}}@media(min-width: 992px){.ion-flex-lg-wrap{flex-wrap:wrap !important}.ion-flex-lg-nowrap{flex-wrap:nowrap !important}.ion-flex-lg-wrap-reverse{flex-wrap:wrap-reverse !important}}@media(min-width: 1200px){.ion-flex-xl-wrap{flex-wrap:wrap !important}.ion-flex-xl-nowrap{flex-wrap:nowrap !important}.ion-flex-xl-wrap-reverse{flex-wrap:wrap-reverse !important}}.ion-flex-1{flex:1 !important}.ion-flex-auto{flex:auto !important}.ion-flex-initial{flex:initial !important}.ion-flex-none{flex:none !important}@media(min-width: 576px){.ion-flex-sm-1{flex:1 !important}.ion-flex-sm-auto{flex:auto !important}.ion-flex-sm-initial{flex:initial !important}.ion-flex-sm-none{flex:none !important}}@media(min-width: 768px){.ion-flex-md-1{flex:1 !important}.ion-flex-md-auto{flex:auto !important}.ion-flex-md-initial{flex:initial !important}.ion-flex-md-none{flex:none !important}}@media(min-width: 992px){.ion-flex-lg-1{flex:1 !important}.ion-flex-lg-auto{flex:auto !important}.ion-flex-lg-initial{flex:initial !important}.ion-flex-lg-none{flex:none !important}}@media(min-width: 1200px){.ion-flex-xl-1{flex:1 !important}.ion-flex-xl-auto{flex:auto !important}.ion-flex-xl-initial{flex:initial !important}.ion-flex-xl-none{flex:none !important}}.ion-flex-grow-0{flex-grow:0 !important}.ion-flex-grow-1{flex-grow:1 !important}.ion-flex-shrink-0{flex-shrink:0 !important}.ion-flex-shrink-1{flex-shrink:1 !important}@media(min-width: 576px){.ion-flex-sm-grow-0{flex-grow:0 !important}.ion-flex-sm-grow-1{flex-grow:1 !important}.ion-flex-sm-shrink-0{flex-shrink:0 !important}.ion-flex-sm-shrink-1{flex-shrink:1 !important}}@media(min-width: 768px){.ion-flex-md-grow-0{flex-grow:0 !important}.ion-flex-md-grow-1{flex-grow:1 !important}.ion-flex-md-shrink-0{flex-shrink:0 !important}.ion-flex-md-shrink-1{flex-shrink:1 !important}}@media(min-width: 992px){.ion-flex-lg-grow-0{flex-grow:0 !important}.ion-flex-lg-grow-1{flex-grow:1 !important}.ion-flex-lg-shrink-0{flex-shrink:0 !important}.ion-flex-lg-shrink-1{flex-shrink:1 !important}}@media(min-width: 1200px){.ion-flex-xl-grow-0{flex-grow:0 !important}.ion-flex-xl-grow-1{flex-grow:1 !important}.ion-flex-xl-shrink-0{flex-shrink:0 !important}.ion-flex-xl-shrink-1{flex-shrink:1 !important}}.ion-order-first{order:-1 !important}.ion-order-0{order:0 !important}.ion-order-1{order:1 !important}.ion-order-2{order:2 !important}.ion-order-3{order:3 !important}.ion-order-4{order:4 !important}.ion-order-5{order:5 !important}.ion-order-6{order:6 !important}.ion-order-7{order:7 !important}.ion-order-8{order:8 !important}.ion-order-9{order:9 !important}.ion-order-10{order:10 !important}.ion-order-11{order:11 !important}.ion-order-12{order:12 !important}.ion-order-last{order:13 !important}@media(min-width: 576px){.ion-order-sm-first{order:-1 !important}.ion-order-sm-0{order:0 !important}.ion-order-sm-1{order:1 !important}.ion-order-sm-2{order:2 !important}.ion-order-sm-3{order:3 !important}.ion-order-sm-4{order:4 !important}.ion-order-sm-5{order:5 !important}.ion-order-sm-6{order:6 !important}.ion-order-sm-7{order:7 !important}.ion-order-sm-8{order:8 !important}.ion-order-sm-9{order:9 !important}.ion-order-sm-10{order:10 !important}.ion-order-sm-11{order:11 !important}.ion-order-sm-12{order:12 !important}.ion-order-sm-last{order:13 !important}}@media(min-width: 768px){.ion-order-md-first{order:-1 !important}.ion-order-md-0{order:0 !important}.ion-order-md-1{order:1 !important}.ion-order-md-2{order:2 !important}.ion-order-md-3{order:3 !important}.ion-order-md-4{order:4 !important}.ion-order-md-5{order:5 !important}.ion-order-md-6{order:6 !important}.ion-order-md-7{order:7 !important}.ion-order-md-8{order:8 !important}.ion-order-md-9{order:9 !important}.ion-order-md-10{order:10 !important}.ion-order-md-11{order:11 !important}.ion-order-md-12{order:12 !important}.ion-order-md-last{order:13 !important}}@media(min-width: 992px){.ion-order-lg-first{order:-1 !important}.ion-order-lg-0{order:0 !important}.ion-order-lg-1{order:1 !important}.ion-order-lg-2{order:2 !important}.ion-order-lg-3{order:3 !important}.ion-order-lg-4{order:4 !important}.ion-order-lg-5{order:5 !important}.ion-order-lg-6{order:6 !important}.ion-order-lg-7{order:7 !important}.ion-order-lg-8{order:8 !important}.ion-order-lg-9{order:9 !important}.ion-order-lg-10{order:10 !important}.ion-order-lg-11{order:11 !important}.ion-order-lg-12{order:12 !important}.ion-order-lg-last{order:13 !important}}@media(min-width: 1200px){.ion-order-xl-first{order:-1 !important}.ion-order-xl-0{order:0 !important}.ion-order-xl-1{order:1 !important}.ion-order-xl-2{order:2 !important}.ion-order-xl-3{order:3 !important}.ion-order-xl-4{order:4 !important}.ion-order-xl-5{order:5 !important}.ion-order-xl-6{order:6 !important}.ion-order-xl-7{order:7 !important}.ion-order-xl-8{order:8 !important}.ion-order-xl-9{order:9 !important}.ion-order-xl-10{order:10 !important}.ion-order-xl-11{order:11 !important}.ion-order-xl-12{order:12 !important}.ion-order-xl-last{order:13 !important}} /*# sourceMappingURL=flex-utils.css.map */:root{--ion-color-primary:#0054e9;--ion-color-primary-rgb:0,84,233;--ion-color-primary-contrast:#fff;--ion-color-primary-contrast-rgb:255,255,255;--ion-color-primary-shade:#004acd;--ion-color-primary-tint:#1a65eb;--ion-color-secondary:#0163aa;--ion-color-secondary-rgb:1,99,170;--ion-color-secondary-contrast:#fff;--ion-color-secondary-contrast-rgb:255,255,255;--ion-color-secondary-shade:#015796;--ion-color-secondary-tint:#1a73b3;--ion-color-tertiary:#6030ff;--ion-color-tertiary-rgb:96,48,255;--ion-color-tertiary-contrast:#fff;--ion-color-tertiary-contrast-rgb:255,255,255;--ion-color-tertiary-shade:#542ae0;--ion-color-tertiary-tint:#7045ff;--ion-color-success:#2dd55b;--ion-color-success-rgb:45,213,91;--ion-color-success-contrast:#000;--ion-color-success-contrast-rgb:0,0,0;--ion-color-success-shade:#28bb50;--ion-color-success-tint:#42d96b;--ion-color-warning:#ffc409;--ion-color-warning-rgb:255,196,9;--ion-color-warning-contrast:#000;--ion-color-warning-contrast-rgb:0,0,0;--ion-color-warning-shade:#e0ac08;--ion-color-warning-tint:#ffca22;--ion-color-danger:#c5000f;--ion-color-danger-rgb:197,0,15;--ion-color-danger-contrast:#fff;--ion-color-danger-contrast-rgb:255,255,255;--ion-color-danger-shade:#ad000d;--ion-color-danger-tint:#cb1a27;--ion-color-light:#f4f5f8;--ion-color-light-rgb:244,245,248;--ion-color-light-contrast:#000;--ion-color-light-contrast-rgb:0,0,0;--ion-color-light-shade:#d7d8da;--ion-color-light-tint:#f5f6f9;--ion-color-medium:#636469;--ion-color-medium-rgb:99,100,105;--ion-color-medium-contrast:#fff;--ion-color-medium-contrast-rgb:255,255,255;--ion-color-medium-shade:#57585c;--ion-color-medium-tint:#737478;--ion-color-dark:#222428;--ion-color-dark-rgb:34,36,40;--ion-color-dark-contrast:#fff;--ion-color-dark-contrast-rgb:255,255,255;--ion-color-dark-shade:#1e2023;--ion-color-dark-tint:#383a3e}html.ios{--ion-default-font:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Roboto",sans-serif}html.md{--ion-default-font:"Roboto","Helvetica Neue",sans-serif}body.backdrop-no-scroll{overflow:hidden}html.ios ion-footer.modal-footer-moving ion-toolbar:first-of-type,html.ios ion-modal ion-footer ion-toolbar:first-of-type,html.ios ion-modal.modal-card ion-header ion-toolbar:first-of-type,html.ios ion-modal.modal-sheet ion-header ion-toolbar:first-of-type{padding-top:6px}html.ios ion-modal.modal-card ion-header ion-toolbar:last-of-type,html.ios ion-modal.modal-sheet ion-header ion-toolbar:last-of-type{padding-bottom:6px}html.ios .modal-footer-moving ion-toolbar,html.ios ion-modal ion-toolbar{padding-right:calc(var(--ion-safe-area-right) + 8px);padding-left:calc(var(--ion-safe-area-left) + 8px)}@media screen and (min-width:768px){html.ios ion-modal.modal-card:first-of-type{--backdrop-opacity:0.18}}ion-modal.modal-default.show-modal~ion-modal.modal-default{--backdrop-opacity:0;--box-shadow:none}html.ios ion-modal.modal-card .ion-page{border-top-left-radius:var(--border-radius)}.ion-color-primary{--ion-color-base:var(--ion-color-primary, #0054e9)!important;--ion-color-base-rgb:var(--ion-color-primary-rgb, 0, 84, 233)!important;--ion-color-contrast:var(--ion-color-primary-contrast, #fff)!important;--ion-color-contrast-rgb:var(--ion-color-primary-contrast-rgb, 255, 255, 255)!important;--ion-color-shade:var(--ion-color-primary-shade, #004acd)!important;--ion-color-tint:var(--ion-color-primary-tint, #1a65eb)!important}.ion-color-secondary{--ion-color-base:var(--ion-color-secondary, #0163aa)!important;--ion-color-base-rgb:var(--ion-color-secondary-rgb, 1, 99, 170)!important;--ion-color-contrast:var(--ion-color-secondary-contrast, #fff)!important;--ion-color-contrast-rgb:var(--ion-color-secondary-contrast-rgb, 255, 255, 255)!important;--ion-color-shade:var(--ion-color-secondary-shade, #015796)!important;--ion-color-tint:var(--ion-color-secondary-tint, #1a73b3)!important}.ion-color-tertiary{--ion-color-base:var(--ion-color-tertiary, #6030ff)!important;--ion-color-base-rgb:var(--ion-color-tertiary-rgb, 96, 48, 255)!important;--ion-color-contrast:var(--ion-color-tertiary-contrast, #fff)!important;--ion-color-contrast-rgb:var(--ion-color-tertiary-contrast-rgb, 255, 255, 255)!important;--ion-color-shade:var(--ion-color-tertiary-shade, #542ae0)!important;--ion-color-tint:var(--ion-color-tertiary-tint, #7045ff)!important}.ion-color-success{--ion-color-base:var(--ion-color-success, #2dd55b)!important;--ion-color-base-rgb:var(--ion-color-success-rgb, 45, 213, 91)!important;--ion-color-contrast:var(--ion-color-success-contrast, #000)!important;--ion-color-contrast-rgb:var(--ion-color-success-contrast-rgb, 0, 0, 0)!important;--ion-color-shade:var(--ion-color-success-shade, #28bb50)!important;--ion-color-tint:var(--ion-color-success-tint, #42d96b)!important}.ion-color-warning{--ion-color-base:var(--ion-color-warning, #ffc409)!important;--ion-color-base-rgb:var(--ion-color-warning-rgb, 255, 196, 9)!important;--ion-color-contrast:var(--ion-color-warning-contrast, #000)!important;--ion-color-contrast-rgb:var(--ion-color-warning-contrast-rgb, 0, 0, 0)!important;--ion-color-shade:var(--ion-color-warning-shade, #e0ac08)!important;--ion-color-tint:var(--ion-color-warning-tint, #ffca22)!important}.ion-color-danger{--ion-color-base:var(--ion-color-danger, #c5000f)!important;--ion-color-base-rgb:var(--ion-color-danger-rgb, 197, 0, 15)!important;--ion-color-contrast:var(--ion-color-danger-contrast, #fff)!important;--ion-color-contrast-rgb:var(--ion-color-danger-contrast-rgb, 255, 255, 255)!important;--ion-color-shade:var(--ion-color-danger-shade, #ad000d)!important;--ion-color-tint:var(--ion-color-danger-tint, #cb1a27)!important}.ion-color-light{--ion-color-base:var(--ion-color-light, #f4f5f8)!important;--ion-color-base-rgb:var(--ion-color-light-rgb, 244, 245, 248)!important;--ion-color-contrast:var(--ion-color-light-contrast, #000)!important;--ion-color-contrast-rgb:var(--ion-color-light-contrast-rgb, 0, 0, 0)!important;--ion-color-shade:var(--ion-color-light-shade, #d7d8da)!important;--ion-color-tint:var(--ion-color-light-tint, #f5f6f9)!important}.ion-color-medium{--ion-color-base:var(--ion-color-medium, #636469)!important;--ion-color-base-rgb:var(--ion-color-medium-rgb, 99, 100, 105)!important;--ion-color-contrast:var(--ion-color-medium-contrast, #fff)!important;--ion-color-contrast-rgb:var(--ion-color-medium-contrast-rgb, 255, 255, 255)!important;--ion-color-shade:var(--ion-color-medium-shade, #57585c)!important;--ion-color-tint:var(--ion-color-medium-tint, #737478)!important}.ion-color-dark{--ion-color-base:var(--ion-color-dark, #222428)!important;--ion-color-base-rgb:var(--ion-color-dark-rgb, 34, 36, 40)!important;--ion-color-contrast:var(--ion-color-dark-contrast, #fff)!important;--ion-color-contrast-rgb:var(--ion-color-dark-contrast-rgb, 255, 255, 255)!important;--ion-color-shade:var(--ion-color-dark-shade, #1e2023)!important;--ion-color-tint:var(--ion-color-dark-tint, #383a3e)!important}.ion-page{left:0;right:0;top:0;bottom:0;display:flex;position:absolute;flex-direction:column;justify-content:space-between;contain:layout size style;z-index:0}.ion-page.ion-page-overlay-passthrough{pointer-events:none}ion-modal>.ion-page{position:relative;contain:layout style;height:100%}.split-pane-visible>.ion-page.split-pane-main{position:relative}.ion-page-hidden,ion-action-sheet-controller,ion-alert-controller,ion-loading-controller,ion-menu-controller,ion-modal-controller,ion-nav-controller,ion-picker-controller,ion-popover-controller,ion-route,ion-route-redirect,ion-router,ion-select-option,ion-toast-controller{display:none!important}.ion-page-invisible{opacity:0}.can-go-back>ion-header ion-back-button{display:block}html.plt-ios.plt-hybrid,html.plt-ios.plt-pwa{--ion-statusbar-padding:20px}@supports(padding-top:20px){html{--ion-safe-area-top:var(--ion-statusbar-padding)}}@supports(padding-top:env(safe-area-inset-top)){html{--ion-safe-area-top:env(safe-area-inset-top);--ion-safe-area-bottom:env(safe-area-inset-bottom);--ion-safe-area-left:env(safe-area-inset-left);--ion-safe-area-right:env(safe-area-inset-right)}}ion-card-header.ion-color .ion-inherit-color,ion-card.ion-color .ion-inherit-color{color:inherit}.menu-content{transform:translate3d(0,0,0)}.menu-content-open{cursor:pointer;touch-action:manipulation;pointer-events:none;overflow-y:hidden}.menu-content-open ion-content{--overflow:hidden}.menu-content-open .ion-content-scroll-host{overflow:hidden}.ios .menu-content-reveal{box-shadow:-8px 0 42px rgba(0,0,0,.08)}[dir=rtl].ios .menu-content-reveal{box-shadow:8px 0 42px rgba(0,0,0,.08)}.md .menu-content-push,.md .menu-content-reveal{box-shadow:4px 0 16px rgba(0,0,0,.18)}ion-accordion-group.accordion-group-expand-inset>ion-accordion:first-of-type{border-top-left-radius:8px;border-top-right-radius:8px}ion-accordion-group.accordion-group-expand-inset>ion-accordion:last-of-type{border-bottom-left-radius:8px;border-bottom-right-radius:8px}ion-accordion-group>ion-accordion:last-of-type ion-item[slot=header]{--border-width:0px}ion-accordion.accordion-animated>[slot=header] .ion-accordion-toggle-icon{transition:transform .3s cubic-bezier(.25, .8, .5, 1)}@media(prefers-reduced-motion:reduce){ion-accordion .ion-accordion-toggle-icon{transition:none!important}}ion-accordion.accordion-expanded>[slot=header] .ion-accordion-toggle-icon,ion-accordion.accordion-expanding>[slot=header] .ion-accordion-toggle-icon{transform:rotate(180deg)}ion-accordion-group.accordion-group-expand-inset.md>ion-accordion.accordion-previous ion-item[slot=header]{--border-width:0px;--inner-border-width:0px}ion-accordion-group.accordion-group-expand-inset.md>ion-accordion.accordion-expanded:first-of-type,ion-accordion-group.accordion-group-expand-inset.md>ion-accordion.accordion-expanding:first-of-type{margin-top:0}ion-input input::-webkit-date-and-time-value{text-align:start}.ion-datetime-button-overlay{--width:fit-content;--height:fit-content}.ion-datetime-button-overlay ion-datetime.datetime-grid{width:320px;min-height:320px}[ion-last-focus],[role=banner][tabindex="-1"]:focus,[role=heading][aria-level="1"][tabindex="-1"]:focus,[role=main][tabindex="-1"]:focus,h1[tabindex="-1"]:focus,header[tabindex="-1"]:focus,main[tabindex="-1"]:focus{outline:0}.popover-viewport:has(>ion-content){overflow:hidden}@supports not selector(:has(> ion-content)){.popover-viewport{overflow:hidden}}audio,canvas,progress,video{vertical-align:baseline}audio:not([controls]){display:none;height:0}b,strong{font-weight:700}img{max-width:100%}hr{height:1px;border-width:0;box-sizing:content-box}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}input,label,select,textarea{font-family:inherit;line-height:normal}textarea{overflow:auto;height:auto;font:inherit;color:inherit}textarea::-moz-placeholder{padding-left:2px}textarea::placeholder{padding-left:2px}form,input,optgroup,select{margin:0;font:inherit;color:inherit}html input[type=button],input[type=reset],input[type=submit]{cursor:pointer;-webkit-appearance:button}.ion-tappable,[tappable],[tappable] div,[tappable] ion-icon,[tappable] ion-label,[tappable] span,a,a div,a ion-icon,a ion-label,a span,button,button div,button ion-icon,button ion-label,button span,input,textarea{touch-action:manipulation}a ion-label,button ion-label{pointer-events:none}button{padding:0;border:0;border-radius:0;font-family:inherit;font-style:inherit;font-variant:inherit;line-height:1;text-transform:none;cursor:pointer;-webkit-appearance:button}[tappable]{cursor:pointer}a[disabled],button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}html{--ion-dynamic-font:-apple-system-body;--ion-font-family:var(--ion-default-font);width:100%;height:100%;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;font-family:var(--ion-font-family)}html.ion-ce body{display:block}html.plt-pwa{height:100vh}body{background:var(--ion-background-color);color:var(--ion-text-color);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin:0;padding:0;position:fixed;width:100%;max-width:100%;height:100%;max-height:100%;transform:translateZ(0);text-rendering:optimizeLegibility;overflow:hidden;touch-action:manipulation;-webkit-user-drag:none;-ms-content-zooming:none;word-wrap:break-word;overscroll-behavior-y:none;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none}@supports(-webkit-touch-callout:none){html{font:var(--ion-dynamic-font, 16px var(--ion-font-family))}}a{background-color:transparent;color:var(--ion-color-primary,#0054e9)}h1,h2,h3,h4,h5,h6{margin-top:16px;margin-bottom:10px;font-weight:500;line-height:1.2}h1{margin-top:20px;font-size:1.625rem}h2{margin-top:18px;font-size:1.5rem}h3{font-size:1.375rem}h4{font-size:1.25rem}h5{font-size:1.125rem}h6{font-size:1rem}small{font-size:75%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}.ion-no-padding{--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;padding:0}.ion-padding{--padding-start:var(--ion-padding, 16px);--padding-end:var(--ion-padding, 16px);--padding-top:var(--ion-padding, 16px);--padding-bottom:var(--ion-padding, 16px);padding-inline-start:var(--ion-padding,16px);padding-inline-end:var(--ion-padding,16px);padding-top:var(--ion-padding,16px);padding-bottom:var(--ion-padding,16px)}.ion-padding-top{--padding-top:var(--ion-padding, 16px);padding-top:var(--ion-padding,16px)}.ion-padding-start{--padding-start:var(--ion-padding, 16px);padding-inline-start:var(--ion-padding,16px)}.ion-padding-end{--padding-end:var(--ion-padding, 16px);padding-inline-end:var(--ion-padding,16px)}.ion-padding-bottom{--padding-bottom:var(--ion-padding, 16px);padding-bottom:var(--ion-padding,16px)}.ion-padding-vertical{--padding-top:var(--ion-padding, 16px);--padding-bottom:var(--ion-padding, 16px);padding-top:var(--ion-padding,16px);padding-bottom:var(--ion-padding,16px)}.ion-padding-horizontal{--padding-start:var(--ion-padding, 16px);--padding-end:var(--ion-padding, 16px);padding-inline-start:var(--ion-padding,16px);padding-inline-end:var(--ion-padding,16px)}.ion-no-margin{--margin-start:0;--margin-end:0;--margin-top:0;--margin-bottom:0;margin:0}.ion-margin{--margin-start:var(--ion-margin, 16px);--margin-end:var(--ion-margin, 16px);--margin-top:var(--ion-margin, 16px);--margin-bottom:var(--ion-margin, 16px);margin-inline-start:var(--ion-margin,16px);margin-inline-end:var(--ion-margin,16px);margin-top:var(--ion-margin,16px);margin-bottom:var(--ion-margin,16px)}.ion-margin-top{--margin-top:var(--ion-margin, 16px);margin-top:var(--ion-margin,16px)}.ion-margin-start{--margin-start:var(--ion-margin, 16px);margin-inline-start:var(--ion-margin,16px)}.ion-margin-end{--margin-end:var(--ion-margin, 16px);margin-inline-end:var(--ion-margin,16px)}.ion-margin-bottom{--margin-bottom:var(--ion-margin, 16px);margin-bottom:var(--ion-margin,16px)}.ion-margin-vertical{--margin-top:var(--ion-margin, 16px);--margin-bottom:var(--ion-margin, 16px);margin-top:var(--ion-margin,16px);margin-bottom:var(--ion-margin,16px)}.ion-margin-horizontal{--margin-start:var(--ion-margin, 16px);--margin-end:var(--ion-margin, 16px);margin-inline-start:var(--ion-margin,16px);margin-inline-end:var(--ion-margin,16px)}.ion-float-left{float:left!important}.ion-float-right{float:right!important}.ion-float-start{float:left!important}:host-context([dir=rtl]) .ion-float-start{float:right!important}[dir=rtl] .ion-float-start{float:right!important}@supports selector(:dir(rtl)){.ion-float-start:dir(rtl){float:right!important}.ion-float-end:dir(rtl){float:left!important}}.ion-float-end{float:right!important}:host-context([dir=rtl]) .ion-float-end{float:left!important}[dir=rtl] .ion-float-end{float:left!important}.ion-text-center{text-align:center!important}.ion-text-justify{text-align:justify!important}.ion-text-start{text-align:start!important}.ion-text-end{text-align:end!important}.ion-text-left{text-align:left!important}.ion-text-right{text-align:right!important}.ion-text-nowrap{white-space:nowrap!important}.ion-text-wrap{white-space:normal!important}.ion-text-uppercase{text-transform:uppercase!important}.ion-text-lowercase{text-transform:lowercase!important}.ion-text-capitalize{text-transform:capitalize!important}.ion-align-content-start{align-content:flex-start!important}.ion-align-content-end{align-content:flex-end!important}.ion-align-content-center{align-content:center!important}.ion-align-content-between{align-content:space-between!important}.ion-align-content-around{align-content:space-around!important}.ion-align-content-stretch{align-content:stretch!important}.ion-align-items-start{align-items:start!important}.ion-align-items-end{align-items:end!important}.ion-align-items-center{align-items:center!important}.ion-align-items-stretch{align-items:stretch!important}.ion-align-items-baseline{align-items:baseline!important}.ion-align-self-start{align-self:start!important}.ion-align-self-end{align-self:end!important}.ion-align-self-center{align-self:center!important}.ion-align-self-stretch{align-self:stretch!important}.ion-align-self-baseline{align-self:baseline!important}.ion-align-self-auto{align-self:auto!important}@media(min-width:576px){.ion-float-sm-left{float:left!important}.ion-float-sm-right{float:right!important}.ion-float-sm-start{float:left!important}:host-context([dir=rtl]) .ion-float-sm-start{float:right!important}[dir=rtl] .ion-float-sm-start{float:right!important}@supports selector(:dir(rtl)){.ion-float-sm-start:dir(rtl){float:right!important}.ion-float-sm-end:dir(rtl){float:left!important}}.ion-float-sm-end{float:right!important}:host-context([dir=rtl]) .ion-float-sm-end{float:left!important}[dir=rtl] .ion-float-sm-end{float:left!important}.ion-text-sm-center{text-align:center!important}.ion-text-sm-justify{text-align:justify!important}.ion-text-sm-start{text-align:start!important}.ion-text-sm-end{text-align:end!important}.ion-text-sm-left{text-align:left!important}.ion-text-sm-right{text-align:right!important}.ion-text-sm-nowrap{white-space:nowrap!important}.ion-text-sm-wrap{white-space:normal!important}.ion-text-sm-uppercase{text-transform:uppercase!important}.ion-text-sm-lowercase{text-transform:lowercase!important}.ion-text-sm-capitalize{text-transform:capitalize!important}.ion-align-content-sm-start{align-content:flex-start!important}.ion-align-content-sm-end{align-content:flex-end!important}.ion-align-content-sm-center{align-content:center!important}.ion-align-content-sm-between{align-content:space-between!important}.ion-align-content-sm-around{align-content:space-around!important}.ion-align-content-sm-stretch{align-content:stretch!important}.ion-align-items-sm-start{align-items:start!important}.ion-align-items-sm-end{align-items:end!important}.ion-align-items-sm-center{align-items:center!important}.ion-align-items-sm-stretch{align-items:stretch!important}.ion-align-items-sm-baseline{align-items:baseline!important}.ion-align-self-sm-start{align-self:start!important}.ion-align-self-sm-end{align-self:end!important}.ion-align-self-sm-center{align-self:center!important}.ion-align-self-sm-stretch{align-self:stretch!important}.ion-align-self-sm-baseline{align-self:baseline!important}.ion-align-self-sm-auto{align-self:auto!important}}@media(min-width:768px){.ion-float-md-left{float:left!important}.ion-float-md-right{float:right!important}.ion-float-md-start{float:left!important}:host-context([dir=rtl]) .ion-float-md-start{float:right!important}[dir=rtl] .ion-float-md-start{float:right!important}@supports selector(:dir(rtl)){.ion-float-md-start:dir(rtl){float:right!important}.ion-float-md-end:dir(rtl){float:left!important}}.ion-float-md-end{float:right!important}:host-context([dir=rtl]) .ion-float-md-end{float:left!important}[dir=rtl] .ion-float-md-end{float:left!important}.ion-text-md-center{text-align:center!important}.ion-text-md-justify{text-align:justify!important}.ion-text-md-start{text-align:start!important}.ion-text-md-end{text-align:end!important}.ion-text-md-left{text-align:left!important}.ion-text-md-right{text-align:right!important}.ion-text-md-nowrap{white-space:nowrap!important}.ion-text-md-wrap{white-space:normal!important}.ion-text-md-uppercase{text-transform:uppercase!important}.ion-text-md-lowercase{text-transform:lowercase!important}.ion-text-md-capitalize{text-transform:capitalize!important}.ion-align-content-md-start{align-content:flex-start!important}.ion-align-content-md-end{align-content:flex-end!important}.ion-align-content-md-center{align-content:center!important}.ion-align-content-md-between{align-content:space-between!important}.ion-align-content-md-around{align-content:space-around!important}.ion-align-content-md-stretch{align-content:stretch!important}.ion-align-items-md-start{align-items:start!important}.ion-align-items-md-end{align-items:end!important}.ion-align-items-md-center{align-items:center!important}.ion-align-items-md-stretch{align-items:stretch!important}.ion-align-items-md-baseline{align-items:baseline!important}.ion-align-self-md-start{align-self:start!important}.ion-align-self-md-end{align-self:end!important}.ion-align-self-md-center{align-self:center!important}.ion-align-self-md-stretch{align-self:stretch!important}.ion-align-self-md-baseline{align-self:baseline!important}.ion-align-self-md-auto{align-self:auto!important}}@media(min-width:992px){.ion-float-lg-left{float:left!important}.ion-float-lg-right{float:right!important}.ion-float-lg-start{float:left!important}:host-context([dir=rtl]) .ion-float-lg-start{float:right!important}[dir=rtl] .ion-float-lg-start{float:right!important}@supports selector(:dir(rtl)){.ion-float-lg-start:dir(rtl){float:right!important}.ion-float-lg-end:dir(rtl){float:left!important}}.ion-float-lg-end{float:right!important}:host-context([dir=rtl]) .ion-float-lg-end{float:left!important}[dir=rtl] .ion-float-lg-end{float:left!important}.ion-text-lg-center{text-align:center!important}.ion-text-lg-justify{text-align:justify!important}.ion-text-lg-start{text-align:start!important}.ion-text-lg-end{text-align:end!important}.ion-text-lg-left{text-align:left!important}.ion-text-lg-right{text-align:right!important}.ion-text-lg-nowrap{white-space:nowrap!important}.ion-text-lg-wrap{white-space:normal!important}.ion-text-lg-uppercase{text-transform:uppercase!important}.ion-text-lg-lowercase{text-transform:lowercase!important}.ion-text-lg-capitalize{text-transform:capitalize!important}.ion-align-content-lg-start{align-content:flex-start!important}.ion-align-content-lg-end{align-content:flex-end!important}.ion-align-content-lg-center{align-content:center!important}.ion-align-content-lg-between{align-content:space-between!important}.ion-align-content-lg-around{align-content:space-around!important}.ion-align-content-lg-stretch{align-content:stretch!important}.ion-align-items-lg-start{align-items:start!important}.ion-align-items-lg-end{align-items:end!important}.ion-align-items-lg-center{align-items:center!important}.ion-align-items-lg-stretch{align-items:stretch!important}.ion-align-items-lg-baseline{align-items:baseline!important}.ion-align-self-lg-start{align-self:start!important}.ion-align-self-lg-end{align-self:end!important}.ion-align-self-lg-center{align-self:center!important}.ion-align-self-lg-stretch{align-self:stretch!important}.ion-align-self-lg-baseline{align-self:baseline!important}.ion-align-self-lg-auto{align-self:auto!important}}@media(min-width:1200px){.ion-float-xl-left{float:left!important}.ion-float-xl-right{float:right!important}.ion-float-xl-start{float:left!important}:host-context([dir=rtl]) .ion-float-xl-start{float:right!important}[dir=rtl] .ion-float-xl-start{float:right!important}@supports selector(:dir(rtl)){.ion-float-xl-start:dir(rtl){float:right!important}.ion-float-xl-end:dir(rtl){float:left!important}}.ion-float-xl-end{float:right!important}:host-context([dir=rtl]) .ion-float-xl-end{float:left!important}[dir=rtl] .ion-float-xl-end{float:left!important}.ion-text-xl-center{text-align:center!important}.ion-text-xl-justify{text-align:justify!important}.ion-text-xl-start{text-align:start!important}.ion-text-xl-end{text-align:end!important}.ion-text-xl-left{text-align:left!important}.ion-text-xl-right{text-align:right!important}.ion-text-xl-nowrap{white-space:nowrap!important}.ion-text-xl-wrap{white-space:normal!important}.ion-text-xl-uppercase{text-transform:uppercase!important}.ion-text-xl-lowercase{text-transform:lowercase!important}.ion-text-xl-capitalize{text-transform:capitalize!important}.ion-align-content-xl-start{align-content:flex-start!important}.ion-align-content-xl-end{align-content:flex-end!important}.ion-align-content-xl-center{align-content:center!important}.ion-align-content-xl-between{align-content:space-between!important}.ion-align-content-xl-around{align-content:space-around!important}.ion-align-content-xl-stretch{align-content:stretch!important}.ion-align-items-xl-start{align-items:start!important}.ion-align-items-xl-end{align-items:end!important}.ion-align-items-xl-center{align-items:center!important}.ion-align-items-xl-stretch{align-items:stretch!important}.ion-align-items-xl-baseline{align-items:baseline!important}.ion-align-self-xl-start{align-self:start!important}.ion-align-self-xl-end{align-self:end!important}.ion-align-self-xl-center{align-self:center!important}.ion-align-self-xl-stretch{align-self:stretch!important}.ion-align-self-xl-baseline{align-self:baseline!important}.ion-align-self-xl-auto{align-self:auto!important}}.ion-justify-content-start{justify-content:flex-start!important}.ion-justify-content-end{justify-content:flex-end!important}.ion-justify-content-center{justify-content:center!important}.ion-justify-content-between{justify-content:space-between!important}.ion-justify-content-around{justify-content:space-around!important}.ion-justify-content-evenly{justify-content:space-evenly!important}@media(min-width:576px){.ion-justify-content-sm-start{justify-content:flex-start!important}.ion-justify-content-sm-end{justify-content:flex-end!important}.ion-justify-content-sm-center{justify-content:center!important}.ion-justify-content-sm-between{justify-content:space-between!important}.ion-justify-content-sm-around{justify-content:space-around!important}.ion-justify-content-sm-evenly{justify-content:space-evenly!important}}@media(min-width:768px){.ion-justify-content-md-start{justify-content:flex-start!important}.ion-justify-content-md-end{justify-content:flex-end!important}.ion-justify-content-md-center{justify-content:center!important}.ion-justify-content-md-between{justify-content:space-between!important}.ion-justify-content-md-around{justify-content:space-around!important}.ion-justify-content-md-evenly{justify-content:space-evenly!important}}@media(min-width:992px){.ion-justify-content-lg-start{justify-content:flex-start!important}.ion-justify-content-lg-end{justify-content:flex-end!important}.ion-justify-content-lg-center{justify-content:center!important}.ion-justify-content-lg-between{justify-content:space-between!important}.ion-justify-content-lg-around{justify-content:space-around!important}.ion-justify-content-lg-evenly{justify-content:space-evenly!important}}@media(min-width:1200px){.ion-justify-content-xl-start{justify-content:flex-start!important}.ion-justify-content-xl-end{justify-content:flex-end!important}.ion-justify-content-xl-center{justify-content:center!important}.ion-justify-content-xl-between{justify-content:space-between!important}.ion-justify-content-xl-around{justify-content:space-around!important}.ion-justify-content-xl-evenly{justify-content:space-evenly!important}}.ion-flex-row{flex-direction:row!important}.ion-flex-row-reverse{flex-direction:row-reverse!important}.ion-flex-column{flex-direction:column!important}.ion-flex-column-reverse{flex-direction:column-reverse!important}@media(min-width:576px){.ion-flex-sm-row{flex-direction:row!important}.ion-flex-sm-row-reverse{flex-direction:row-reverse!important}.ion-flex-sm-column{flex-direction:column!important}.ion-flex-sm-column-reverse{flex-direction:column-reverse!important}}@media(min-width:768px){.ion-flex-md-row{flex-direction:row!important}.ion-flex-md-row-reverse{flex-direction:row-reverse!important}.ion-flex-md-column{flex-direction:column!important}.ion-flex-md-column-reverse{flex-direction:column-reverse!important}}@media(min-width:992px){.ion-flex-lg-row{flex-direction:row!important}.ion-flex-lg-row-reverse{flex-direction:row-reverse!important}.ion-flex-lg-column{flex-direction:column!important}.ion-flex-lg-column-reverse{flex-direction:column-reverse!important}}@media(min-width:1200px){.ion-flex-xl-row{flex-direction:row!important}.ion-flex-xl-row-reverse{flex-direction:row-reverse!important}.ion-flex-xl-column{flex-direction:column!important}.ion-flex-xl-column-reverse{flex-direction:column-reverse!important}}.ion-wrap{flex-wrap:wrap!important}.ion-nowrap{flex-wrap:nowrap!important}.ion-wrap-reverse{flex-wrap:wrap-reverse!important}.ion-flex-wrap{flex-wrap:wrap!important}.ion-flex-nowrap{flex-wrap:nowrap!important}.ion-flex-wrap-reverse{flex-wrap:wrap-reverse!important}@media(min-width:576px){.ion-flex-sm-wrap{flex-wrap:wrap!important}.ion-flex-sm-nowrap{flex-wrap:nowrap!important}.ion-flex-sm-wrap-reverse{flex-wrap:wrap-reverse!important}}@media(min-width:768px){.ion-flex-md-wrap{flex-wrap:wrap!important}.ion-flex-md-nowrap{flex-wrap:nowrap!important}.ion-flex-md-wrap-reverse{flex-wrap:wrap-reverse!important}}@media(min-width:992px){.ion-flex-lg-wrap{flex-wrap:wrap!important}.ion-flex-lg-nowrap{flex-wrap:nowrap!important}.ion-flex-lg-wrap-reverse{flex-wrap:wrap-reverse!important}}@media(min-width:1200px){.ion-flex-xl-wrap{flex-wrap:wrap!important}.ion-flex-xl-nowrap{flex-wrap:nowrap!important}.ion-flex-xl-wrap-reverse{flex-wrap:wrap-reverse!important}}.ion-flex-1{flex:1!important}.ion-flex-auto{flex:auto!important}.ion-flex-initial{flex:initial!important}.ion-flex-none{flex:none!important}@media(min-width:576px){.ion-flex-sm-1{flex:1!important}.ion-flex-sm-auto{flex:auto!important}.ion-flex-sm-initial{flex:initial!important}.ion-flex-sm-none{flex:none!important}}@media(min-width:768px){.ion-flex-md-1{flex:1!important}.ion-flex-md-auto{flex:auto!important}.ion-flex-md-initial{flex:initial!important}.ion-flex-md-none{flex:none!important}}@media(min-width:992px){.ion-flex-lg-1{flex:1!important}.ion-flex-lg-auto{flex:auto!important}.ion-flex-lg-initial{flex:initial!important}.ion-flex-lg-none{flex:none!important}}@media(min-width:1200px){.ion-flex-xl-1{flex:1!important}.ion-flex-xl-auto{flex:auto!important}.ion-flex-xl-initial{flex:initial!important}.ion-flex-xl-none{flex:none!important}}.ion-flex-grow-0{flex-grow:0!important}.ion-flex-grow-1{flex-grow:1!important}.ion-flex-shrink-0{flex-shrink:0!important}.ion-flex-shrink-1{flex-shrink:1!important}.ion-order-first{order:-1!important}.ion-order-0{order:0!important}.ion-order-1{order:1!important}.ion-order-2{order:2!important}.ion-order-3{order:3!important}.ion-order-4{order:4!important}.ion-order-5{order:5!important}.ion-order-6{order:6!important}.ion-order-7{order:7!important}.ion-order-8{order:8!important}.ion-order-9{order:9!important}.ion-order-10{order:10!important}.ion-order-11{order:11!important}.ion-order-12{order:12!important}.ion-order-last{order:13!important}.ion-hide,.ion-hide-down,.ion-hide-up{display:none!important}@media(max-width:575.98px){.ion-hide-sm-down{display:none!important}}@media(max-width:767.98px){.ion-hide-md-down{display:none!important}}@media(max-width:991.98px){.ion-hide-lg-down{display:none!important}}@media(max-width:1199.98px){.ion-hide-xl-down{display:none!important}}.ion-display-none{display:none!important}@media(min-width:576px){.ion-flex-sm-grow-0{flex-grow:0!important}.ion-flex-sm-grow-1{flex-grow:1!important}.ion-flex-sm-shrink-0{flex-shrink:0!important}.ion-flex-sm-shrink-1{flex-shrink:1!important}.ion-order-sm-first{order:-1!important}.ion-order-sm-0{order:0!important}.ion-order-sm-1{order:1!important}.ion-order-sm-2{order:2!important}.ion-order-sm-3{order:3!important}.ion-order-sm-4{order:4!important}.ion-order-sm-5{order:5!important}.ion-order-sm-6{order:6!important}.ion-order-sm-7{order:7!important}.ion-order-sm-8{order:8!important}.ion-order-sm-9{order:9!important}.ion-order-sm-10{order:10!important}.ion-order-sm-11{order:11!important}.ion-order-sm-12{order:12!important}.ion-order-sm-last{order:13!important}.ion-display-sm-none,.ion-hide-sm-up{display:none!important}}@media(min-width:768px){.ion-flex-md-grow-0{flex-grow:0!important}.ion-flex-md-grow-1{flex-grow:1!important}.ion-flex-md-shrink-0{flex-shrink:0!important}.ion-flex-md-shrink-1{flex-shrink:1!important}.ion-order-md-first{order:-1!important}.ion-order-md-0{order:0!important}.ion-order-md-1{order:1!important}.ion-order-md-2{order:2!important}.ion-order-md-3{order:3!important}.ion-order-md-4{order:4!important}.ion-order-md-5{order:5!important}.ion-order-md-6{order:6!important}.ion-order-md-7{order:7!important}.ion-order-md-8{order:8!important}.ion-order-md-9{order:9!important}.ion-order-md-10{order:10!important}.ion-order-md-11{order:11!important}.ion-order-md-12{order:12!important}.ion-order-md-last{order:13!important}.ion-display-md-none,.ion-hide-md-up{display:none!important}}@media(min-width:992px){.ion-flex-lg-grow-0{flex-grow:0!important}.ion-flex-lg-grow-1{flex-grow:1!important}.ion-flex-lg-shrink-0{flex-shrink:0!important}.ion-flex-lg-shrink-1{flex-shrink:1!important}.ion-order-lg-first{order:-1!important}.ion-order-lg-0{order:0!important}.ion-order-lg-1{order:1!important}.ion-order-lg-2{order:2!important}.ion-order-lg-3{order:3!important}.ion-order-lg-4{order:4!important}.ion-order-lg-5{order:5!important}.ion-order-lg-6{order:6!important}.ion-order-lg-7{order:7!important}.ion-order-lg-8{order:8!important}.ion-order-lg-9{order:9!important}.ion-order-lg-10{order:10!important}.ion-order-lg-11{order:11!important}.ion-order-lg-12{order:12!important}.ion-order-lg-last{order:13!important}.ion-display-lg-none,.ion-hide-lg-up{display:none!important}}@media(min-width:1200px){.ion-flex-xl-grow-0{flex-grow:0!important}.ion-flex-xl-grow-1{flex-grow:1!important}.ion-flex-xl-shrink-0{flex-shrink:0!important}.ion-flex-xl-shrink-1{flex-shrink:1!important}.ion-order-xl-first{order:-1!important}.ion-order-xl-0{order:0!important}.ion-order-xl-1{order:1!important}.ion-order-xl-2{order:2!important}.ion-order-xl-3{order:3!important}.ion-order-xl-4{order:4!important}.ion-order-xl-5{order:5!important}.ion-order-xl-6{order:6!important}.ion-order-xl-7{order:7!important}.ion-order-xl-8{order:8!important}.ion-order-xl-9{order:9!important}.ion-order-xl-10{order:10!important}.ion-order-xl-11{order:11!important}.ion-order-xl-12{order:12!important}.ion-order-xl-last{order:13!important}.ion-display-xl-none,.ion-hide-xl-up{display:none!important}.ion-display-xl-inline{display:inline!important}}.ion-display-inline{display:inline!important}@media(min-width:576px){.ion-display-sm-inline{display:inline!important}}@media(min-width:768px){.ion-display-md-inline{display:inline!important}}@media(min-width:992px){.ion-display-lg-inline{display:inline!important}.ion-display-lg-inline-block{display:inline-block!important}}.ion-display-inline-block{display:inline-block!important}@media(min-width:576px){.ion-display-sm-inline-block{display:inline-block!important}}@media(min-width:768px){.ion-display-md-inline-block{display:inline-block!important}}@media(min-width:1200px){.ion-display-xl-inline-block{display:inline-block!important}.ion-display-xl-block{display:block!important}}.ion-display-block{display:block!important}@media(min-width:576px){.ion-display-sm-block{display:block!important}}@media(min-width:768px){.ion-display-md-block{display:block!important}}@media(min-width:992px){.ion-display-lg-block{display:block!important}.ion-display-lg-flex{display:flex!important}}.ion-display-flex{display:flex!important}@media(min-width:576px){.ion-display-sm-flex{display:flex!important}}@media(min-width:768px){.ion-display-md-flex{display:flex!important}}@media(min-width:1200px){.ion-display-xl-flex{display:flex!important}.ion-display-xl-inline-flex{display:inline-flex!important}}.ion-display-inline-flex{display:inline-flex!important}@media(min-width:576px){.ion-display-sm-inline-flex{display:inline-flex!important}}@media(min-width:768px){.ion-display-md-inline-flex{display:inline-flex!important}}@media(min-width:992px){.ion-display-lg-inline-flex{display:inline-flex!important}.ion-display-lg-grid{display:grid!important}}.ion-display-grid{display:grid!important}@media(min-width:576px){.ion-display-sm-grid{display:grid!important}}@media(min-width:768px){.ion-display-md-grid{display:grid!important}}@media(min-width:1200px){.ion-display-xl-grid{display:grid!important}.ion-display-xl-inline-grid{display:inline-grid!important}}.ion-display-inline-grid{display:inline-grid!important}@media(min-width:576px){.ion-display-sm-inline-grid{display:inline-grid!important}}@media(min-width:768px){.ion-display-md-inline-grid{display:inline-grid!important}}@media(min-width:992px){.ion-display-lg-inline-grid{display:inline-grid!important}.ion-display-lg-table{display:table!important}}.ion-display-table{display:table!important}@media(min-width:576px){.ion-display-sm-table{display:table!important}}@media(min-width:768px){.ion-display-md-table{display:table!important}}@media(min-width:1200px){.ion-display-xl-table{display:table!important}.ion-display-xl-table-cell{display:table-cell!important}}.ion-display-table-cell{display:table-cell!important}@media(min-width:576px){.ion-display-sm-table-cell{display:table-cell!important}}@media(min-width:768px){.ion-display-md-table-cell{display:table-cell!important}}@media(min-width:992px){.ion-display-lg-table-cell{display:table-cell!important}.ion-display-lg-table-row{display:table-row!important}}.ion-display-table-row{display:table-row!important}@media(min-width:576px){.ion-display-sm-table-row{display:table-row!important}}@media(min-width:768px){.ion-display-md-table-row{display:table-row!important}}@media(min-width:1200px){.ion-display-xl-table-row{display:table-row!important}}/** * Main stylesheet - imports Tailwind and all custom styles */ /** * SCSS Variables & CSS Custom Properties * Theme configuration - use these throughout your app */ :root { /* Primary Colors */ --color-primary-900: #1B6AB1; --color-primary-800: #197EDA; --color-primary-700: #208DF0; --color-primary-600: #3DA2FF; --color-primary-500: #5CB2FF; --color-primary-400: #7DC2FF; --color-primary-300: #A5DBFF; --color-primary-200: #BBE4FF; --color-primary-100: #D4EEFF; --color-primary-50: #E7F5FF; /* Secondary Colors */ --color-secondary-900: #101B3E; --color-secondary-800: #17285E; --color-secondary-700: #173E8B; --color-secondary-600: #1C4FB4; --color-secondary-500: #2161E0; --color-secondary-400: #397BFD; --color-secondary-300: #689BFF; --color-secondary-200: #95B9FF; --color-secondary-100: #C8DAFF; --color-secondary-50: #E4EDFF; /* Accent Colors */ --color-accent-900: #7A6D05; --color-accent-800: #AB9805; --color-accent-700: #E4CD1C; --color-accent-600: #FFE51F; --color-accent-500: #FFED68; --color-accent-400: #FFF07E; --color-accent-300: #FFF28C; --color-accent-200: #FFF5AA; --color-accent-100: #FFFAD9; --color-accent-50: #FFFFF2; /* Success Colors */ --color-success-900: #02170D; --color-success-800: #074526; --color-success-700: #0C7440; --color-success-600: #11A259; --color-success-500: #16D072; --color-success-400: #2FE98C; --color-success-300: #5DEEA5; --color-success-200: #8CF3BF; --color-success-100: #BAF8D9; --color-success-50: #E8FDF2; /* Error Colors */ --color-error-900: #500910; --color-error-800: #850F1A; --color-error-700: #A0121F; --color-error-600: #D5182A; --color-error-500: #E93E4F; --color-error-400: #F07884; --color-error-300: #F49FA7; --color-error-200: #F9C5CA; --color-error-100: #FDECED; --color-error-50: #FFFAFA; /* Ionic theme variables (keeps Ionic components aligned with Tailwind palette) */ --ion-font-family: Saira, sans-serif; --ion-background-color: #000000; --ion-background-color-rgb: to-rgb-string(#000000); --ion-text-color: #ffffff; --ion-text-color-rgb: to-rgb-string(#ffffff); --ion-color-primary: #5CB2FF; --ion-color-primary-rgb: to-rgb-string(#5CB2FF); --ion-color-primary-contrast: #FFFFFF; --ion-color-primary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-primary-shade: #3DA2FF; --ion-color-primary-tint: #7DC2FF; --ion-color-secondary: #2161E0; --ion-color-secondary-rgb: to-rgb-string(#2161E0); --ion-color-secondary-contrast: #FFFFFF; --ion-color-secondary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-secondary-shade: #1C4FB4; --ion-color-secondary-tint: #397BFD; --ion-color-tertiary: #FFED68; --ion-color-tertiary-rgb: to-rgb-string(#FFED68); --ion-color-tertiary-contrast: #1C1A22; --ion-color-tertiary-contrast-rgb: to-rgb-string(#1C1A22); --ion-color-tertiary-shade: #E4CD1C; --ion-color-tertiary-tint: #FFF07E; --ion-color-success: #16D072; --ion-color-success-rgb: to-rgb-string(#16D072); --ion-color-success-contrast: #FFFFFF; --ion-color-success-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-success-shade: #11A259; --ion-color-success-tint: #2FE98C; --ion-color-danger: #E93E4F; --ion-color-danger-rgb: to-rgb-string(#E93E4F); --ion-color-danger-contrast: #FFFFFF; --ion-color-danger-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-danger-shade: #D5182A; --ion-color-danger-tint: #F07884; /* Neutral Colors */ --color-neutral-900: #1C1A22; --color-neutral-800: #312F37; --color-neutral-700: #48454F; --color-neutral-600: #605D66; --color-neutral-500: #79757F; --color-neutral-400: #9A96A2; --color-neutral-300: #C9C4CF; --color-neutral-200: #E6E1E6; --color-neutral-100: #F4EFF4; --color-neutral-50: #FFFFFF; /* Legacy color variables for backward compatibility */ --color-primary: #5CB2FF; --color-primary-dark: #208DF0; --color-primary-light: #A5DBFF; --color-secondary: #2161E0; /* Background and text */ --color-background: #000000; --color-surface: #000000; --color-text: #ffffff; --color-text-light: #C9C4CF; /* Spacing */ --spacing-xs: 0.25em; --spacing-sm: 0.5em; --spacing-md: 1em; --spacing-lg: 1.5em; --spacing-xl: 2em; /* Typography */ --font-family: Saira, sans-serif; --font-family-saira: Saira, sans-serif; --font-family-saira-condensed: Saira Condensed, sans-serif; --font-size-xs: 0.75rem; --font-size-sm: 0.875rem; --font-size-md: 1rem; --font-size-lg: 1.125rem; --font-size-xl: 1.25rem; /* Typography System - CSS Custom Properties */ --text-title-1-l-font-size: 2rem; --text-title-1-l-line-height: 2.125rem; --text-title-1-l-font-weight: 700; --text-title-1-l-letter-spacing: -0.0125em; --text-title-1-l-text-transform: none; --text-title-1-m-font-size: 2rem; --text-title-1-m-line-height: 2.125rem; --text-title-1-m-font-weight: 600; --text-title-1-m-letter-spacing: -0.0125em; --text-title-1-m-text-transform: none; --text-title-2-l-font-size: 1.75rem; --text-title-2-l-line-height: 2rem; --text-title-2-l-font-weight: 700; --text-title-2-l-letter-spacing: -0.0125em; --text-title-2-l-text-transform: none; --text-title-2-m-font-size: 1.75rem; --text-title-2-m-line-height: 2rem; --text-title-2-m-font-weight: 600; --text-title-2-m-letter-spacing: -0.0125em; --text-title-2-m-text-transform: none; --text-title-3-l-font-size: 1.625rem; --text-title-3-l-line-height: 1.75rem; --text-title-3-l-font-weight: 700; --text-title-3-l-letter-spacing: 0; --text-title-3-l-text-transform: none; --text-title-3-m-font-size: 1.625rem; --text-title-3-m-line-height: 1.75rem; --text-title-3-m-font-weight: 600; --text-title-3-m-letter-spacing: 0; --text-title-3-m-text-transform: none; --text-title-4-l-font-size: 1.375rem; --text-title-4-l-line-height: 1.5rem; --text-title-4-l-font-weight: 700; --text-title-4-l-letter-spacing: 0; --text-title-4-l-text-transform: none; --text-title-4-m-font-size: 1.375rem; --text-title-4-m-line-height: 1.5rem; --text-title-4-m-font-weight: 600; --text-title-4-m-letter-spacing: 0; --text-title-4-m-text-transform: none; --text-subtitle-1-l-font-size: 1.5rem; --text-subtitle-1-l-line-height: 2rem; --text-subtitle-1-l-font-weight: 700; --text-subtitle-1-l-letter-spacing: -0.01em; --text-subtitle-1-l-text-transform: none; --text-subtitle-1-m-font-size: 1.5rem; --text-subtitle-1-m-line-height: 2rem; --text-subtitle-1-m-font-weight: 600; --text-subtitle-1-m-letter-spacing: -0.01em; --text-subtitle-1-m-text-transform: none; --text-subtitle-2-l-font-size: 1.25rem; --text-subtitle-2-l-line-height: 1.75rem; --text-subtitle-2-l-font-weight: 700; --text-subtitle-2-l-letter-spacing: -0.01em; --text-subtitle-2-l-text-transform: none; --text-subtitle-2-m-font-size: 1.25rem; --text-subtitle-2-m-line-height: 1.75rem; --text-subtitle-2-m-font-weight: 600; --text-subtitle-2-m-letter-spacing: -0.01em; --text-subtitle-2-m-text-transform: none; --text-subtitle-3-l-font-size: 1.125rem; --text-subtitle-3-l-line-height: 1.625rem; --text-subtitle-3-l-font-weight: 700; --text-subtitle-3-l-letter-spacing: -0.01em; --text-subtitle-3-l-text-transform: none; --text-subtitle-3-m-font-size: 1.125rem; --text-subtitle-3-m-line-height: 1.625rem; --text-subtitle-3-m-font-weight: 600; --text-subtitle-3-m-letter-spacing: -0.01em; --text-subtitle-3-m-text-transform: none; --text-subtitle-4-l-font-size: 1rem; --text-subtitle-4-l-line-height: 1.5rem; --text-subtitle-4-l-font-weight: 700; --text-subtitle-4-l-letter-spacing: -0.01em; --text-subtitle-4-l-text-transform: none; --text-subtitle-4-m-font-size: 1rem; --text-subtitle-4-m-line-height: 1.5rem; --text-subtitle-4-m-font-weight: 600; --text-subtitle-4-m-letter-spacing: -0.01em; --text-subtitle-4-m-text-transform: none; --text-label-1-l-font-size: 1.125rem; --text-label-1-l-line-height: 1.375rem; --text-label-1-l-font-weight: 700; --text-label-1-l-letter-spacing: 0.0025em; --text-label-1-l-text-transform: none; --text-label-1-m-font-size: 1.125rem; --text-label-1-m-line-height: 1.375rem; --text-label-1-m-font-weight: 600; --text-label-1-m-letter-spacing: 0.0025em; --text-label-1-m-text-transform: none; --text-label-2-l-font-size: 1rem; --text-label-2-l-line-height: 1.25rem; --text-label-2-l-font-weight: 700; --text-label-2-l-letter-spacing: 0.0025em; --text-label-2-l-text-transform: none; --text-label-2-m-font-size: 1rem; --text-label-2-m-line-height: 1.25rem; --text-label-2-m-font-weight: 600; --text-label-2-m-letter-spacing: 0.0025em; --text-label-2-m-text-transform: none; --text-label-3-l-font-size: 0.875rem; --text-label-3-l-line-height: 1rem; --text-label-3-l-font-weight: 700; --text-label-3-l-letter-spacing: 0.0025em; --text-label-3-l-text-transform: none; --text-label-3-m-font-size: 0.875rem; --text-label-3-m-line-height: 1rem; --text-label-3-m-font-weight: 600; --text-label-3-m-letter-spacing: 0.0025em; --text-label-3-m-text-transform: none; --text-button-1-font-size: 1.25rem; --text-button-1-line-height: 1.5rem; --text-button-1-font-weight: 700; --text-button-1-letter-spacing: 0.005em; --text-button-1-text-transform: none; --text-button-2-font-size: 1.125rem; --text-button-2-line-height: 1.5rem; --text-button-2-font-weight: 700; --text-button-2-letter-spacing: 0.005em; --text-button-2-text-transform: none; --text-button-3-font-size: 1rem; --text-button-3-line-height: 1.45rem; --text-button-3-font-weight: 700; --text-button-3-letter-spacing: 0.005em; --text-button-3-text-transform: none; --text-button-4-font-size: 0.875rem; --text-button-4-line-height: 1rem; --text-button-4-font-weight: 700; --text-button-4-letter-spacing: 0.005em; --text-button-4-text-transform: none; --text-body-1-font-size: 1.25rem; --text-body-1-line-height: 1.5rem; --text-body-1-font-weight: 400; --text-body-1-letter-spacing: 0.005em; --text-body-1-text-transform: none; --text-body-2-font-size: 1.125rem; --text-body-2-line-height: 1.375rem; --text-body-2-font-weight: 400; --text-body-2-letter-spacing: 0.005em; --text-body-2-text-transform: none; --text-body-3-font-size: 1rem; --text-body-3-line-height: 1.25rem; --text-body-3-font-weight: 400; --text-body-3-letter-spacing: 0.005em; --text-body-3-text-transform: none; --text-body-4-font-size: 0.875rem; --text-body-4-line-height: 1.125rem; --text-body-4-font-weight: 400; --text-body-4-letter-spacing: 0.005em; --text-body-4-text-transform: none; --text-overline-1-l-font-size: 0.875rem; --text-overline-1-l-line-height: 1rem; --text-overline-1-l-font-weight: 700; --text-overline-1-l-letter-spacing: 0.05em; --text-overline-1-l-text-transform: uppercase; --text-overline-1-m-font-size: 0.875rem; --text-overline-1-m-line-height: 1rem; --text-overline-1-m-font-weight: 600; --text-overline-1-m-letter-spacing: 0.05em; --text-overline-1-m-text-transform: uppercase; --text-overline-2-l-font-size: 0.75rem; --text-overline-2-l-line-height: 0.875rem; --text-overline-2-l-font-weight: 700; --text-overline-2-l-letter-spacing: 0.05em; --text-overline-2-l-text-transform: uppercase; --text-overline-2-m-font-size: 0.75rem; --text-overline-2-m-line-height: 0.875rem; --text-overline-2-m-font-weight: 600; --text-overline-2-m-letter-spacing: 0.05em; --text-overline-2-m-text-transform: uppercase; --text-caption-1-l-font-size: 1rem; --text-caption-1-l-line-height: 1.25rem; --text-caption-1-l-font-weight: 700; --text-caption-1-l-letter-spacing: -0.01em; --text-caption-1-l-text-transform: none; --text-caption-1-m-font-size: 1rem; --text-caption-1-m-line-height: 1.25rem; --text-caption-1-m-font-weight: 600; --text-caption-1-m-letter-spacing: -0.01em; --text-caption-1-m-text-transform: none; --text-caption-2-l-font-size: 0.875rem; --text-caption-2-l-line-height: 1rem; --text-caption-2-l-font-weight: 700; --text-caption-2-l-letter-spacing: -0.01em; --text-caption-2-l-text-transform: none; --text-caption-2-m-font-size: 0.875rem; --text-caption-2-m-line-height: 1rem; --text-caption-2-m-font-weight: 600; --text-caption-2-m-letter-spacing: -0.01em; --text-caption-2-m-text-transform: none; --text-caption-3-l-font-size: 0.75rem; --text-caption-3-l-line-height: 0.875rem; --text-caption-3-l-font-weight: 700; --text-caption-3-l-letter-spacing: -0.01em; --text-caption-3-l-text-transform: none; --text-caption-3-m-font-size: 0.75rem; --text-caption-3-m-line-height: 0.875rem; --text-caption-3-m-font-weight: 600; --text-caption-3-m-letter-spacing: -0.01em; --text-caption-3-m-text-transform: none; --text-caption-4-l-font-size: 0.625rem; --text-caption-4-l-line-height: 0.625rem; --text-caption-4-l-font-weight: 700; --text-caption-4-l-letter-spacing: -0.01em; --text-caption-4-l-text-transform: none; --text-caption-4-m-font-size: 0.625rem; --text-caption-4-m-line-height: 0.625rem; --text-caption-4-m-font-weight: 600; --text-caption-4-m-letter-spacing: -0.01em; --text-caption-4-m-text-transform: none; /* Breakpoints (for use in media queries) */ --breakpoint-mobile: 1024px; --breakpoint-desktop: 1025px; /* Border radius */ --radius-sm: 0.1875em; --radius-md: 0.5em; --radius-lg: 0.75em; /* Shadows */ --shadow-sm: 0 0.0625em 0.125em rgba(0, 0, 0, 0.05); --shadow-md: 0 0.25em 0.375em rgba(0, 0, 0, 0.1); --shadow-lg: 0 0.625em 0.9375em rgba(0, 0, 0, 0.1); /* MISC Colors */ --color-misc-talent-card: #8DF800; --color-misc-bonus-card: #A641D0; --color-misc-bonus-gradient: linear-gradient(0deg, #21222A 0%, #9143CB 100%); --color-misc-black-fade-0: linear-gradient(0deg, #000000 0%, rgba(9, 14, 23, 0) 100%); --color-misc-black-fade-1: linear-gradient(0deg, #101010 0%, rgba(25, 26, 31, 0) 100%); /* Gradients */ --gradient-primary: linear-gradient(90deg, #0062FF 0%, #001D6D 100%); --gradient-secondary: linear-gradient(90deg, #0C1E54 0%, #0C44A4 100%); --gradient-light: linear-gradient(90deg, #1B6AB1 0%, #7DC2FF 100%); --gradient-accent: linear-gradient(90deg, #FFEE6A 0%, #CD9A17 100%); --gradient-dark: linear-gradient(180deg, #151319 0%, #262930 100%); /* Elevation */ --elevation-0: #000000; --elevation-1: #101010; --elevation-2: #202020; --elevation-3: #282828; --elevation-4: #303030; --elevation-5: #383838; --elevation-6: #404040; /* Card Effects */ --card-effect-base: conic-gradient(from 180deg at 48.5% 50%, #989DA3 -46.16deg, #101012 130.63deg, #9DA2A9 133.38deg, #121214 311.43deg, #989DA3 313.84deg, #101012 490.63deg); --card-effect-bronze: linear-gradient(90deg, #B5947D 0%, #B6937D 6.65%, #FFECE0 8.25%, #F0CAB2 30.69%, #A47C6C 34.31%, #7F5B4A 65.92%, #AC836D 74.36%, #AB836E 91.3%, #8E6958 100%); --card-effect-silverg: linear-gradient(74.17deg, #7A7F81 13.43%, #9EA1A1 26.76%, #979E9D 47.44%, #798082 53.73%, #8E9799 77.78%, #9EA3A5 86.51%, #8A9092 95.7%); --card-effect-gold-1: conic-gradient(from 180deg at 48.5% 50%, #FFEAC2 -46.16deg, #4B2A16 130.63deg, #EAB872 133.38deg, #AE824E 204.46deg, #533018 311.43deg, #FFEAC2 313.84deg, #4B2A16 490.63deg); --card-effect-gold-2: linear-gradient(75.74deg, #C1A875 12.49%, #EAB872 26.21%, #AE824E 47.49%, #C1A875 53.96%, #C1A875 78.71%, #EAB872 87.7%, #C1A875 97.16%); --card-effect-sapphire: conic-gradient(from -1.98deg at 91% 2.08%, #52F9FF 0deg, #68E3FE 26.25deg, #2E9BFF 161.27deg, #52F9FF 176.4deg, #2E9BFF 204.68deg, #52F9FF 255deg, #2E9BFF 309.38deg, #52F9FF 360deg); } /** * CSS Reset - normalize browser defaults */ * { box-sizing: border-box; margin: 0; padding: 0; } html, body { padding: 0; margin: 0; } /** * Base styles - global element styles */ html { font-size: 1em; } html, body { font-family: var(--font-family); color: var(--color-text); background-color: var(--color-background); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #app { width: 100%; min-height: 100vh; background-color: var(--color-background); } a { color: var(--color-primary); text-decoration: none; } a:hover { text-decoration: underline; } button { font-family: inherit; cursor: pointer; border: none; outline: none; } button:disabled { opacity: 0.6; cursor: not-allowed; } img { max-width: 100%; height: auto; } html.status-bar-gradient { position: relative; } html.status-bar-gradient::before { content: ""; position: fixed; top: 0; left: 0; right: 0; height: calc(env(safe-area-inset-top, 0px) + 2.75em); background: linear-gradient(to bottom, #000000 0%, rgba(0, 0, 0, 0) 100%); pointer-events: none; z-index: 9999; } html.status-bar-gradient body { background: linear-gradient(to bottom, #000000 0%, rgba(0, 0, 0, 0.8) calc(env(safe-area-inset-top, 0px) + 1.25em), rgba(0, 0, 0, 0) calc(env(safe-area-inset-top, 0px) + 3.75em), var(--color-background) calc(env(safe-area-inset-top, 0px) + 6.25em)); background-attachment: fixed; } /** * SCSS Variables & CSS Custom Properties * Theme configuration - use these throughout your app */ :root { /* Primary Colors */ --color-primary-900: #1B6AB1; --color-primary-800: #197EDA; --color-primary-700: #208DF0; --color-primary-600: #3DA2FF; --color-primary-500: #5CB2FF; --color-primary-400: #7DC2FF; --color-primary-300: #A5DBFF; --color-primary-200: #BBE4FF; --color-primary-100: #D4EEFF; --color-primary-50: #E7F5FF; /* Secondary Colors */ --color-secondary-900: #101B3E; --color-secondary-800: #17285E; --color-secondary-700: #173E8B; --color-secondary-600: #1C4FB4; --color-secondary-500: #2161E0; --color-secondary-400: #397BFD; --color-secondary-300: #689BFF; --color-secondary-200: #95B9FF; --color-secondary-100: #C8DAFF; --color-secondary-50: #E4EDFF; /* Accent Colors */ --color-accent-900: #7A6D05; --color-accent-800: #AB9805; --color-accent-700: #E4CD1C; --color-accent-600: #FFE51F; --color-accent-500: #FFED68; --color-accent-400: #FFF07E; --color-accent-300: #FFF28C; --color-accent-200: #FFF5AA; --color-accent-100: #FFFAD9; --color-accent-50: #FFFFF2; /* Success Colors */ --color-success-900: #02170D; --color-success-800: #074526; --color-success-700: #0C7440; --color-success-600: #11A259; --color-success-500: #16D072; --color-success-400: #2FE98C; --color-success-300: #5DEEA5; --color-success-200: #8CF3BF; --color-success-100: #BAF8D9; --color-success-50: #E8FDF2; /* Error Colors */ --color-error-900: #500910; --color-error-800: #850F1A; --color-error-700: #A0121F; --color-error-600: #D5182A; --color-error-500: #E93E4F; --color-error-400: #F07884; --color-error-300: #F49FA7; --color-error-200: #F9C5CA; --color-error-100: #FDECED; --color-error-50: #FFFAFA; /* Ionic theme variables (keeps Ionic components aligned with Tailwind palette) */ --ion-font-family: Saira, sans-serif; --ion-background-color: #000000; --ion-background-color-rgb: to-rgb-string(#000000); --ion-text-color: #ffffff; --ion-text-color-rgb: to-rgb-string(#ffffff); --ion-color-primary: #5CB2FF; --ion-color-primary-rgb: to-rgb-string(#5CB2FF); --ion-color-primary-contrast: #FFFFFF; --ion-color-primary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-primary-shade: #3DA2FF; --ion-color-primary-tint: #7DC2FF; --ion-color-secondary: #2161E0; --ion-color-secondary-rgb: to-rgb-string(#2161E0); --ion-color-secondary-contrast: #FFFFFF; --ion-color-secondary-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-secondary-shade: #1C4FB4; --ion-color-secondary-tint: #397BFD; --ion-color-tertiary: #FFED68; --ion-color-tertiary-rgb: to-rgb-string(#FFED68); --ion-color-tertiary-contrast: #1C1A22; --ion-color-tertiary-contrast-rgb: to-rgb-string(#1C1A22); --ion-color-tertiary-shade: #E4CD1C; --ion-color-tertiary-tint: #FFF07E; --ion-color-success: #16D072; --ion-color-success-rgb: to-rgb-string(#16D072); --ion-color-success-contrast: #FFFFFF; --ion-color-success-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-success-shade: #11A259; --ion-color-success-tint: #2FE98C; --ion-color-danger: #E93E4F; --ion-color-danger-rgb: to-rgb-string(#E93E4F); --ion-color-danger-contrast: #FFFFFF; --ion-color-danger-contrast-rgb: to-rgb-string(#FFFFFF); --ion-color-danger-shade: #D5182A; --ion-color-danger-tint: #F07884; /* Neutral Colors */ --color-neutral-900: #1C1A22; --color-neutral-800: #312F37; --color-neutral-700: #48454F; --color-neutral-600: #605D66; --color-neutral-500: #79757F; --color-neutral-400: #9A96A2; --color-neutral-300: #C9C4CF; --color-neutral-200: #E6E1E6; --color-neutral-100: #F4EFF4; --color-neutral-50: #FFFFFF; /* Legacy color variables for backward compatibility */ --color-primary: #5CB2FF; --color-primary-dark: #208DF0; --color-primary-light: #A5DBFF; --color-secondary: #2161E0; /* Background and text */ --color-background: #000000; --color-surface: #000000; --color-text: #ffffff; --color-text-light: #C9C4CF; /* Spacing */ --spacing-xs: 0.25em; --spacing-sm: 0.5em; --spacing-md: 1em; --spacing-lg: 1.5em; --spacing-xl: 2em; /* Typography */ --font-family: Saira, sans-serif; --font-family-saira: Saira, sans-serif; --font-family-saira-condensed: Saira Condensed, sans-serif; --font-size-xs: 0.75rem; --font-size-sm: 0.875rem; --font-size-md: 1rem; --font-size-lg: 1.125rem; --font-size-xl: 1.25rem; /* Typography System - CSS Custom Properties */ --text-title-1-l-font-size: 2rem; --text-title-1-l-line-height: 2.125rem; --text-title-1-l-font-weight: 700; --text-title-1-l-letter-spacing: -0.0125em; --text-title-1-l-text-transform: none; --text-title-1-m-font-size: 2rem; --text-title-1-m-line-height: 2.125rem; --text-title-1-m-font-weight: 600; --text-title-1-m-letter-spacing: -0.0125em; --text-title-1-m-text-transform: none; --text-title-2-l-font-size: 1.75rem; --text-title-2-l-line-height: 2rem; --text-title-2-l-font-weight: 700; --text-title-2-l-letter-spacing: -0.0125em; --text-title-2-l-text-transform: none; --text-title-2-m-font-size: 1.75rem; --text-title-2-m-line-height: 2rem; --text-title-2-m-font-weight: 600; --text-title-2-m-letter-spacing: -0.0125em; --text-title-2-m-text-transform: none; --text-title-3-l-font-size: 1.625rem; --text-title-3-l-line-height: 1.75rem; --text-title-3-l-font-weight: 700; --text-title-3-l-letter-spacing: 0; --text-title-3-l-text-transform: none; --text-title-3-m-font-size: 1.625rem; --text-title-3-m-line-height: 1.75rem; --text-title-3-m-font-weight: 600; --text-title-3-m-letter-spacing: 0; --text-title-3-m-text-transform: none; --text-title-4-l-font-size: 1.375rem; --text-title-4-l-line-height: 1.5rem; --text-title-4-l-font-weight: 700; --text-title-4-l-letter-spacing: 0; --text-title-4-l-text-transform: none; --text-title-4-m-font-size: 1.375rem; --text-title-4-m-line-height: 1.5rem; --text-title-4-m-font-weight: 600; --text-title-4-m-letter-spacing: 0; --text-title-4-m-text-transform: none; --text-subtitle-1-l-font-size: 1.5rem; --text-subtitle-1-l-line-height: 2rem; --text-subtitle-1-l-font-weight: 700; --text-subtitle-1-l-letter-spacing: -0.01em; --text-subtitle-1-l-text-transform: none; --text-subtitle-1-m-font-size: 1.5rem; --text-subtitle-1-m-line-height: 2rem; --text-subtitle-1-m-font-weight: 600; --text-subtitle-1-m-letter-spacing: -0.01em; --text-subtitle-1-m-text-transform: none; --text-subtitle-2-l-font-size: 1.25rem; --text-subtitle-2-l-line-height: 1.75rem; --text-subtitle-2-l-font-weight: 700; --text-subtitle-2-l-letter-spacing: -0.01em; --text-subtitle-2-l-text-transform: none; --text-subtitle-2-m-font-size: 1.25rem; --text-subtitle-2-m-line-height: 1.75rem; --text-subtitle-2-m-font-weight: 600; --text-subtitle-2-m-letter-spacing: -0.01em; --text-subtitle-2-m-text-transform: none; --text-subtitle-3-l-font-size: 1.125rem; --text-subtitle-3-l-line-height: 1.625rem; --text-subtitle-3-l-font-weight: 700; --text-subtitle-3-l-letter-spacing: -0.01em; --text-subtitle-3-l-text-transform: none; --text-subtitle-3-m-font-size: 1.125rem; --text-subtitle-3-m-line-height: 1.625rem; --text-subtitle-3-m-font-weight: 600; --text-subtitle-3-m-letter-spacing: -0.01em; --text-subtitle-3-m-text-transform: none; --text-subtitle-4-l-font-size: 1rem; --text-subtitle-4-l-line-height: 1.5rem; --text-subtitle-4-l-font-weight: 700; --text-subtitle-4-l-letter-spacing: -0.01em; --text-subtitle-4-l-text-transform: none; --text-subtitle-4-m-font-size: 1rem; --text-subtitle-4-m-line-height: 1.5rem; --text-subtitle-4-m-font-weight: 600; --text-subtitle-4-m-letter-spacing: -0.01em; --text-subtitle-4-m-text-transform: none; --text-label-1-l-font-size: 1.125rem; --text-label-1-l-line-height: 1.375rem; --text-label-1-l-font-weight: 700; --text-label-1-l-letter-spacing: 0.0025em; --text-label-1-l-text-transform: none; --text-label-1-m-font-size: 1.125rem; --text-label-1-m-line-height: 1.375rem; --text-label-1-m-font-weight: 600; --text-label-1-m-letter-spacing: 0.0025em; --text-label-1-m-text-transform: none; --text-label-2-l-font-size: 1rem; --text-label-2-l-line-height: 1.25rem; --text-label-2-l-font-weight: 700; --text-label-2-l-letter-spacing: 0.0025em; --text-label-2-l-text-transform: none; --text-label-2-m-font-size: 1rem; --text-label-2-m-line-height: 1.25rem; --text-label-2-m-font-weight: 600; --text-label-2-m-letter-spacing: 0.0025em; --text-label-2-m-text-transform: none; --text-label-3-l-font-size: 0.875rem; --text-label-3-l-line-height: 1rem; --text-label-3-l-font-weight: 700; --text-label-3-l-letter-spacing: 0.0025em; --text-label-3-l-text-transform: none; --text-label-3-m-font-size: 0.875rem; --text-label-3-m-line-height: 1rem; --text-label-3-m-font-weight: 600; --text-label-3-m-letter-spacing: 0.0025em; --text-label-3-m-text-transform: none; --text-button-1-font-size: 1.25rem; --text-button-1-line-height: 1.5rem; --text-button-1-font-weight: 700; --text-button-1-letter-spacing: 0.005em; --text-button-1-text-transform: none; --text-button-2-font-size: 1.125rem; --text-button-2-line-height: 1.5rem; --text-button-2-font-weight: 700; --text-button-2-letter-spacing: 0.005em; --text-button-2-text-transform: none; --text-button-3-font-size: 1rem; --text-button-3-line-height: 1.45rem; --text-button-3-font-weight: 700; --text-button-3-letter-spacing: 0.005em; --text-button-3-text-transform: none; --text-button-4-font-size: 0.875rem; --text-button-4-line-height: 1rem; --text-button-4-font-weight: 700; --text-button-4-letter-spacing: 0.005em; --text-button-4-text-transform: none; --text-body-1-font-size: 1.25rem; --text-body-1-line-height: 1.5rem; --text-body-1-font-weight: 400; --text-body-1-letter-spacing: 0.005em; --text-body-1-text-transform: none; --text-body-2-font-size: 1.125rem; --text-body-2-line-height: 1.375rem; --text-body-2-font-weight: 400; --text-body-2-letter-spacing: 0.005em; --text-body-2-text-transform: none; --text-body-3-font-size: 1rem; --text-body-3-line-height: 1.25rem; --text-body-3-font-weight: 400; --text-body-3-letter-spacing: 0.005em; --text-body-3-text-transform: none; --text-body-4-font-size: 0.875rem; --text-body-4-line-height: 1.125rem; --text-body-4-font-weight: 400; --text-body-4-letter-spacing: 0.005em; --text-body-4-text-transform: none; --text-overline-1-l-font-size: 0.875rem; --text-overline-1-l-line-height: 1rem; --text-overline-1-l-font-weight: 700; --text-overline-1-l-letter-spacing: 0.05em; --text-overline-1-l-text-transform: uppercase; --text-overline-1-m-font-size: 0.875rem; --text-overline-1-m-line-height: 1rem; --text-overline-1-m-font-weight: 600; --text-overline-1-m-letter-spacing: 0.05em; --text-overline-1-m-text-transform: uppercase; --text-overline-2-l-font-size: 0.75rem; --text-overline-2-l-line-height: 0.875rem; --text-overline-2-l-font-weight: 700; --text-overline-2-l-letter-spacing: 0.05em; --text-overline-2-l-text-transform: uppercase; --text-overline-2-m-font-size: 0.75rem; --text-overline-2-m-line-height: 0.875rem; --text-overline-2-m-font-weight: 600; --text-overline-2-m-letter-spacing: 0.05em; --text-overline-2-m-text-transform: uppercase; --text-caption-1-l-font-size: 1rem; --text-caption-1-l-line-height: 1.25rem; --text-caption-1-l-font-weight: 700; --text-caption-1-l-letter-spacing: -0.01em; --text-caption-1-l-text-transform: none; --text-caption-1-m-font-size: 1rem; --text-caption-1-m-line-height: 1.25rem; --text-caption-1-m-font-weight: 600; --text-caption-1-m-letter-spacing: -0.01em; --text-caption-1-m-text-transform: none; --text-caption-2-l-font-size: 0.875rem; --text-caption-2-l-line-height: 1rem; --text-caption-2-l-font-weight: 700; --text-caption-2-l-letter-spacing: -0.01em; --text-caption-2-l-text-transform: none; --text-caption-2-m-font-size: 0.875rem; --text-caption-2-m-line-height: 1rem; --text-caption-2-m-font-weight: 600; --text-caption-2-m-letter-spacing: -0.01em; --text-caption-2-m-text-transform: none; --text-caption-3-l-font-size: 0.75rem; --text-caption-3-l-line-height: 0.875rem; --text-caption-3-l-font-weight: 700; --text-caption-3-l-letter-spacing: -0.01em; --text-caption-3-l-text-transform: none; --text-caption-3-m-font-size: 0.75rem; --text-caption-3-m-line-height: 0.875rem; --text-caption-3-m-font-weight: 600; --text-caption-3-m-letter-spacing: -0.01em; --text-caption-3-m-text-transform: none; --text-caption-4-l-font-size: 0.625rem; --text-caption-4-l-line-height: 0.625rem; --text-caption-4-l-font-weight: 700; --text-caption-4-l-letter-spacing: -0.01em; --text-caption-4-l-text-transform: none; --text-caption-4-m-font-size: 0.625rem; --text-caption-4-m-line-height: 0.625rem; --text-caption-4-m-font-weight: 600; --text-caption-4-m-letter-spacing: -0.01em; --text-caption-4-m-text-transform: none; /* Breakpoints (for use in media queries) */ --breakpoint-mobile: 1024px; --breakpoint-desktop: 1025px; /* Border radius */ --radius-sm: 0.1875em; --radius-md: 0.5em; --radius-lg: 0.75em; /* Shadows */ --shadow-sm: 0 0.0625em 0.125em rgba(0, 0, 0, 0.05); --shadow-md: 0 0.25em 0.375em rgba(0, 0, 0, 0.1); --shadow-lg: 0 0.625em 0.9375em rgba(0, 0, 0, 0.1); /* MISC Colors */ --color-misc-talent-card: #8DF800; --color-misc-bonus-card: #A641D0; --color-misc-bonus-gradient: linear-gradient(0deg, #21222A 0%, #9143CB 100%); --color-misc-black-fade-0: linear-gradient(0deg, #000000 0%, rgba(9, 14, 23, 0) 100%); --color-misc-black-fade-1: linear-gradient(0deg, #101010 0%, rgba(25, 26, 31, 0) 100%); /* Gradients */ --gradient-primary: linear-gradient(90deg, #0062FF 0%, #001D6D 100%); --gradient-secondary: linear-gradient(90deg, #0C1E54 0%, #0C44A4 100%); --gradient-light: linear-gradient(90deg, #1B6AB1 0%, #7DC2FF 100%); --gradient-accent: linear-gradient(90deg, #FFEE6A 0%, #CD9A17 100%); --gradient-dark: linear-gradient(180deg, #151319 0%, #262930 100%); /* Elevation */ --elevation-0: #000000; --elevation-1: #101010; --elevation-2: #202020; --elevation-3: #282828; --elevation-4: #303030; --elevation-5: #383838; --elevation-6: #404040; /* Card Effects */ --card-effect-base: conic-gradient(from 180deg at 48.5% 50%, #989DA3 -46.16deg, #101012 130.63deg, #9DA2A9 133.38deg, #121214 311.43deg, #989DA3 313.84deg, #101012 490.63deg); --card-effect-bronze: linear-gradient(90deg, #B5947D 0%, #B6937D 6.65%, #FFECE0 8.25%, #F0CAB2 30.69%, #A47C6C 34.31%, #7F5B4A 65.92%, #AC836D 74.36%, #AB836E 91.3%, #8E6958 100%); --card-effect-silverg: linear-gradient(74.17deg, #7A7F81 13.43%, #9EA1A1 26.76%, #979E9D 47.44%, #798082 53.73%, #8E9799 77.78%, #9EA3A5 86.51%, #8A9092 95.7%); --card-effect-gold-1: conic-gradient(from 180deg at 48.5% 50%, #FFEAC2 -46.16deg, #4B2A16 130.63deg, #EAB872 133.38deg, #AE824E 204.46deg, #533018 311.43deg, #FFEAC2 313.84deg, #4B2A16 490.63deg); --card-effect-gold-2: linear-gradient(75.74deg, #C1A875 12.49%, #EAB872 26.21%, #AE824E 47.49%, #C1A875 53.96%, #C1A875 78.71%, #EAB872 87.7%, #C1A875 97.16%); --card-effect-sapphire: conic-gradient(from -1.98deg at 91% 2.08%, #52F9FF 0deg, #68E3FE 26.25deg, #2E9BFF 161.27deg, #52F9FF 176.4deg, #2E9BFF 204.68deg, #52F9FF 255deg, #2E9BFF 309.38deg, #52F9FF 360deg); } .text-title-1-l { font-size: var(--text-title-1-l-font-size); line-height: var(--text-title-1-l-line-height); font-weight: var(--text-title-1-l-font-weight); letter-spacing: var(--text-title-1-l-letter-spacing); text-transform: var(--text-title-1-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-1-m { font-size: var(--text-title-1-m-font-size); line-height: var(--text-title-1-m-line-height); font-weight: var(--text-title-1-m-font-weight); letter-spacing: var(--text-title-1-m-letter-spacing); text-transform: var(--text-title-1-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-2-l { font-size: var(--text-title-2-l-font-size); line-height: var(--text-title-2-l-line-height); font-weight: var(--text-title-2-l-font-weight); letter-spacing: var(--text-title-2-l-letter-spacing); text-transform: var(--text-title-2-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-2-m { font-size: var(--text-title-2-m-font-size); line-height: var(--text-title-2-m-line-height); font-weight: var(--text-title-2-m-font-weight); letter-spacing: var(--text-title-2-m-letter-spacing); text-transform: var(--text-title-2-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-3-l { font-size: var(--text-title-3-l-font-size); line-height: var(--text-title-3-l-line-height); font-weight: var(--text-title-3-l-font-weight); letter-spacing: var(--text-title-3-l-letter-spacing); text-transform: var(--text-title-3-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-3-m { font-size: var(--text-title-3-m-font-size); line-height: var(--text-title-3-m-line-height); font-weight: var(--text-title-3-m-font-weight); letter-spacing: var(--text-title-3-m-letter-spacing); text-transform: var(--text-title-3-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-4-l { font-size: var(--text-title-4-l-font-size); line-height: var(--text-title-4-l-line-height); font-weight: var(--text-title-4-l-font-weight); letter-spacing: var(--text-title-4-l-letter-spacing); text-transform: var(--text-title-4-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-title-4-m { font-size: var(--text-title-4-m-font-size); line-height: var(--text-title-4-m-line-height); font-weight: var(--text-title-4-m-font-weight); letter-spacing: var(--text-title-4-m-letter-spacing); text-transform: var(--text-title-4-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-1-l { font-size: var(--text-subtitle-1-l-font-size); line-height: var(--text-subtitle-1-l-line-height); font-weight: var(--text-subtitle-1-l-font-weight); letter-spacing: var(--text-subtitle-1-l-letter-spacing); text-transform: var(--text-subtitle-1-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-1-m { font-size: var(--text-subtitle-1-m-font-size); line-height: var(--text-subtitle-1-m-line-height); font-weight: var(--text-subtitle-1-m-font-weight); letter-spacing: var(--text-subtitle-1-m-letter-spacing); text-transform: var(--text-subtitle-1-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-2-l { font-size: var(--text-subtitle-2-l-font-size); line-height: var(--text-subtitle-2-l-line-height); font-weight: var(--text-subtitle-2-l-font-weight); letter-spacing: var(--text-subtitle-2-l-letter-spacing); text-transform: var(--text-subtitle-2-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-2-m { font-size: var(--text-subtitle-2-m-font-size); line-height: var(--text-subtitle-2-m-line-height); font-weight: var(--text-subtitle-2-m-font-weight); letter-spacing: var(--text-subtitle-2-m-letter-spacing); text-transform: var(--text-subtitle-2-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-3-l { font-size: var(--text-subtitle-3-l-font-size); line-height: var(--text-subtitle-3-l-line-height); font-weight: var(--text-subtitle-3-l-font-weight); letter-spacing: var(--text-subtitle-3-l-letter-spacing); text-transform: var(--text-subtitle-3-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-3-m { font-size: var(--text-subtitle-3-m-font-size); line-height: var(--text-subtitle-3-m-line-height); font-weight: var(--text-subtitle-3-m-font-weight); letter-spacing: var(--text-subtitle-3-m-letter-spacing); text-transform: var(--text-subtitle-3-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-4-l { font-size: var(--text-subtitle-4-l-font-size); line-height: var(--text-subtitle-4-l-line-height); font-weight: var(--text-subtitle-4-l-font-weight); letter-spacing: var(--text-subtitle-4-l-letter-spacing); text-transform: var(--text-subtitle-4-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-subtitle-4-m { font-size: var(--text-subtitle-4-m-font-size); line-height: var(--text-subtitle-4-m-line-height); font-weight: var(--text-subtitle-4-m-font-weight); letter-spacing: var(--text-subtitle-4-m-letter-spacing); text-transform: var(--text-subtitle-4-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-1-l { font-size: var(--text-label-1-l-font-size); line-height: var(--text-label-1-l-line-height); font-weight: var(--text-label-1-l-font-weight); letter-spacing: var(--text-label-1-l-letter-spacing); text-transform: var(--text-label-1-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-1-m { font-size: var(--text-label-1-m-font-size); line-height: var(--text-label-1-m-line-height); font-weight: var(--text-label-1-m-font-weight); letter-spacing: var(--text-label-1-m-letter-spacing); text-transform: var(--text-label-1-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-2-l { font-size: var(--text-label-2-l-font-size); line-height: var(--text-label-2-l-line-height); font-weight: var(--text-label-2-l-font-weight); letter-spacing: var(--text-label-2-l-letter-spacing); text-transform: var(--text-label-2-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-2-m { font-size: var(--text-label-2-m-font-size); line-height: var(--text-label-2-m-line-height); font-weight: var(--text-label-2-m-font-weight); letter-spacing: var(--text-label-2-m-letter-spacing); text-transform: var(--text-label-2-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-3-l { font-size: var(--text-label-3-l-font-size); line-height: var(--text-label-3-l-line-height); font-weight: var(--text-label-3-l-font-weight); letter-spacing: var(--text-label-3-l-letter-spacing); text-transform: var(--text-label-3-l-text-transform); font-family: var(--font-family-saira-condensed); } .text-label-3-m { font-size: var(--text-label-3-m-font-size); line-height: var(--text-label-3-m-line-height); font-weight: var(--text-label-3-m-font-weight); letter-spacing: var(--text-label-3-m-letter-spacing); text-transform: var(--text-label-3-m-text-transform); font-family: var(--font-family-saira-condensed); } .text-button-1 { font-size: var(--text-button-1-font-size); line-height: var(--text-button-1-line-height); font-weight: var(--text-button-1-font-weight); letter-spacing: var(--text-button-1-letter-spacing); text-transform: var(--text-button-1-text-transform); font-family: var(--font-family-saira-condensed); } .text-button-2 { font-size: var(--text-button-2-font-size); line-height: var(--text-button-2-line-height); font-weight: var(--text-button-2-font-weight); letter-spacing: var(--text-button-2-letter-spacing); text-transform: var(--text-button-2-text-transform); font-family: var(--font-family-saira-condensed); } .text-button-3 { font-size: var(--text-button-3-font-size); line-height: var(--text-button-3-line-height); font-weight: var(--text-button-3-font-weight); letter-spacing: var(--text-button-3-letter-spacing); text-transform: var(--text-button-3-text-transform); font-family: var(--font-family-saira-condensed); } .text-button-4 { font-size: var(--text-button-4-font-size); line-height: var(--text-button-4-line-height); font-weight: var(--text-button-4-font-weight); letter-spacing: var(--text-button-4-letter-spacing); text-transform: var(--text-button-4-text-transform); font-family: var(--font-family-saira-condensed); } .text-body-1 { font-size: var(--text-body-1-font-size); line-height: var(--text-body-1-line-height); font-weight: var(--text-body-1-font-weight); letter-spacing: var(--text-body-1-letter-spacing); text-transform: var(--text-body-1-text-transform); font-family: var(--font-family-saira); } .text-body-2 { font-size: var(--text-body-2-font-size); line-height: var(--text-body-2-line-height); font-weight: var(--text-body-2-font-weight); letter-spacing: var(--text-body-2-letter-spacing); text-transform: var(--text-body-2-text-transform); font-family: var(--font-family-saira); } .text-body-3 { font-size: var(--text-body-3-font-size); line-height: var(--text-body-3-line-height); font-weight: var(--text-body-3-font-weight); letter-spacing: var(--text-body-3-letter-spacing); text-transform: var(--text-body-3-text-transform); font-family: var(--font-family-saira); } .text-body-4 { font-size: var(--text-body-4-font-size); line-height: var(--text-body-4-line-height); font-weight: var(--text-body-4-font-weight); letter-spacing: var(--text-body-4-letter-spacing); text-transform: var(--text-body-4-text-transform); font-family: var(--font-family-saira); } .text-overline-1-l { font-size: var(--text-overline-1-l-font-size); line-height: var(--text-overline-1-l-line-height); font-weight: var(--text-overline-1-l-font-weight); letter-spacing: var(--text-overline-1-l-letter-spacing); text-transform: var(--text-overline-1-l-text-transform); font-family: var(--font-family-saira); } .text-overline-1-m { font-size: var(--text-overline-1-m-font-size); line-height: var(--text-overline-1-m-line-height); font-weight: var(--text-overline-1-m-font-weight); letter-spacing: var(--text-overline-1-m-letter-spacing); text-transform: var(--text-overline-1-m-text-transform); font-family: var(--font-family-saira); } .text-overline-2-l { font-size: var(--text-overline-2-l-font-size); line-height: var(--text-overline-2-l-line-height); font-weight: var(--text-overline-2-l-font-weight); letter-spacing: var(--text-overline-2-l-letter-spacing); text-transform: var(--text-overline-2-l-text-transform); font-family: var(--font-family-saira); } .text-overline-2-m { font-size: var(--text-overline-2-m-font-size); line-height: var(--text-overline-2-m-line-height); font-weight: var(--text-overline-2-m-font-weight); letter-spacing: var(--text-overline-2-m-letter-spacing); text-transform: var(--text-overline-2-m-text-transform); font-family: var(--font-family-saira); } .text-caption-1-l { font-size: var(--text-caption-1-l-font-size); line-height: var(--text-caption-1-l-line-height); font-weight: var(--text-caption-1-l-font-weight); letter-spacing: var(--text-caption-1-l-letter-spacing); text-transform: var(--text-caption-1-l-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-1-m { font-size: var(--text-caption-1-m-font-size); line-height: var(--text-caption-1-m-line-height); font-weight: var(--text-caption-1-m-font-weight); letter-spacing: var(--text-caption-1-m-letter-spacing); text-transform: var(--text-caption-1-m-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-2-l { font-size: var(--text-caption-2-l-font-size); line-height: var(--text-caption-2-l-line-height); font-weight: var(--text-caption-2-l-font-weight); letter-spacing: var(--text-caption-2-l-letter-spacing); text-transform: var(--text-caption-2-l-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-2-m { font-size: var(--text-caption-2-m-font-size); line-height: var(--text-caption-2-m-line-height); font-weight: var(--text-caption-2-m-font-weight); letter-spacing: var(--text-caption-2-m-letter-spacing); text-transform: var(--text-caption-2-m-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-3-l { font-size: var(--text-caption-3-l-font-size); line-height: var(--text-caption-3-l-line-height); font-weight: var(--text-caption-3-l-font-weight); letter-spacing: var(--text-caption-3-l-letter-spacing); text-transform: var(--text-caption-3-l-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-3-m { font-size: var(--text-caption-3-m-font-size); line-height: var(--text-caption-3-m-line-height); font-weight: var(--text-caption-3-m-font-weight); letter-spacing: var(--text-caption-3-m-letter-spacing); text-transform: var(--text-caption-3-m-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-4-l { font-size: var(--text-caption-4-l-font-size); line-height: var(--text-caption-4-l-line-height); font-weight: var(--text-caption-4-l-font-weight); letter-spacing: var(--text-caption-4-l-letter-spacing); text-transform: var(--text-caption-4-l-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } .text-caption-4-m { font-size: var(--text-caption-4-m-font-size); line-height: var(--text-caption-4-m-line-height); font-weight: var(--text-caption-4-m-font-weight); letter-spacing: var(--text-caption-4-m-letter-spacing); text-transform: var(--text-caption-4-m-text-transform); font-family: var(--font-family-saira-condensed); color: var(--color-text-light); } /** * Toast Component Styles * * Custom styles for Ionic toast notifications using the 'uf-toast' class. * These styles override Ionic's default toast appearance to match the app's design system. */ ion-toast.uf-toast, .uf-toast { --background: #343434; --color: var(--color-text, #ffffff); --border-radius: 0.5em; --box-shadow: 0 0.25em 1em rgba(0, 0, 0, 0.3); --padding-start: 1em; --padding-end: 1em; --padding-top: 0.5em; --padding-bottom: 0.5em; font-family: var(--font-family, "Saira", sans-serif); font-size: 0.875em; font-weight: 400; line-height: 1.5; min-width: 17.5em; max-width: 90%; } ion-toast.uf-toast ion-icon, .uf-toast ion-icon { font-size: 1.25em; margin-inline-end: 0.5em; } ion-toast.uf-toast .toast-button, .uf-toast .toast-button { font-weight: 500; text-transform: uppercase; letter-spacing: 0.03125em; } ion-toast.uf-toast .toast-button.uf-toast-icon-indicator, .uf-toast .toast-button.uf-toast-icon-indicator { pointer-events: none; opacity: 0.9; padding-inline-start: 0.625em; padding-inline-end: 0.375em; } ion-toast.uf-toast::part(container), ion-toast.uf-toast::part(wrapper) { display: flex; flex-direction: row-reverse; } ion-toast.uf-toast::part(header) { font-size: var(--text-label-1-l-font-size); line-height: var(--text-label-1-l-line-height); font-weight: var(--text-label-1-l-font-weight); letter-spacing: var(--text-label-1-l-letter-spacing); text-transform: var(--text-label-1-l-text-transform); font-family: var(--font-family-saira-condensed); } ion-toast.uf-toast::part(message) { font-size: var(--text-body-4-font-size); line-height: var(--text-body-4-line-height); font-weight: var(--text-body-4-font-weight); letter-spacing: var(--text-body-4-letter-spacing); text-transform: var(--text-body-4-text-transform); font-family: var(--font-family-saira); } ion-toast.uf-toast.ion-color-primary, .uf-toast.ion-color-primary, .uf-toast[class*=color-primary] { --background: #343434 !important; --ion-color-primary: var(--elevation-5) !important; --ion-color-primary-rgb: 52, 52, 52 !important; --ion-color-primary-contrast: var(--color-text, #ffffff) !important; } ion-toast.uf-toast.ion-color-primary::part(container), ion-toast.uf-toast.ion-color-primary::part(wrapper), .uf-toast.ion-color-primary::part(container), .uf-toast.ion-color-primary::part(wrapper) { color: var(--color-neutral-400, #ffffff) !important; border-radius: 0.5em; border: 1px solid #2f2e3b !important; } ion-toast.uf-toast.ion-color-primary::part(icon) { margin: 0px; height: 2rem; width: 2rem; padding-right: 0.5rem; color: var(--color-neutral-400, #ffffff) !important; } ion-toast.uf-toast.ion-color-secondary, .uf-toast.ion-color-secondary, .uf-toast[class*=color-secondary] { --background: var(--elevation-4, #303030) !important; --ion-color-secondary: var(--elevation-4, #303030) !important; --ion-color-secondary-rgb: 48, 48, 48 !important; --ion-color-secondary-contrast: var(--color-text, #ffffff) !important; } ion-toast.uf-toast.ion-color-secondary::part(container), ion-toast.uf-toast.ion-color-secondary::part(wrapper), .uf-toast.ion-color-secondary::part(container), .uf-toast.ion-color-secondary::part(wrapper) { color: var(--color-neutral-50, #ffffff) !important; border-radius: 0.5em; border: 1px solid var(--elevation-6, #404040) !important; } ion-toast.uf-toast.ion-color-secondary::part(icon) { margin: 0px; height: 3rem; width: 3rem; padding-right: 0.5rem; color: var(--color-neutral-50, #ffffff) !important; } ion-toast.uf-toast.ion-color-tertiary, .uf-toast.ion-color-tertiary, .uf-toast[class*=color-tertiary] { --background: var(--elevation-2, #202020) !important; --ion-color-tertiary: var(--elevation-2, #202020) !important; --ion-color-tertiary-rgb: 32, 32, 32 !important; --ion-color-tertiary-contrast: var(--color-text, #ffffff) !important; } ion-toast.uf-toast.ion-color-tertiary::part(container), ion-toast.uf-toast.ion-color-tertiary::part(wrapper), .uf-toast.ion-color-tertiary::part(container), .uf-toast.ion-color-tertiary::part(wrapper) { color: var(--color-error-400, #ffffff) !important; border-radius: 0.5em; border: 1px solid var(--color-error-400, #E93E4F) !important; } ion-toast.uf-toast.ion-color-tertiary::part(icon) { margin: 0px; height: 3rem; width: 3rem; padding-right: 0.5rem; color: var(--color-error-400, #ffffff) !important; } ion-toast.uf-toast.ion-color-success, .uf-toast.ion-color-success, .uf-toast[class*=color-success] { --background: #343434 !important; --color: var(--color-neutral-400, #ffffff) !important; --ion-color-success: #343434 !important; --ion-color-success-rgb: 52, 52, 52 !important; --ion-color-success-contrast: var(--color-text, #ffffff) !important; } ion-toast.uf-toast.ion-color-success::part(container), ion-toast.uf-toast.ion-color-success::part(wrapper), .uf-toast.ion-color-success::part(container), .uf-toast.ion-color-success::part(wrapper) { border-radius: 0.5em; border: 1px solid #2f2e3b !important; } .uf-toast.ion-color-danger, .uf-toast[class*=color-danger] { --background: var(--ion-color-danger); --color: var(--ion-color-danger-contrast); } .uf-toast[class*=toast-top] { top: calc(env(safe-area-inset-top, 0px) + 1em); } .uf-toast[class*=toast-bottom] { bottom: calc(env(safe-area-inset-bottom, 0px) + 1em); } @media (prefers-color-scheme: dark) { .uf-toast { --background: var(--elevation-2, #202020); --box-shadow: 0 0.25em 1em rgba(0, 0, 0, 0.5); } } @media (max-width: 576px) { .uf-toast { min-width: calc(100% - 2em); max-width: calc(100% - 2em); margin: 0 1em; } } *, ::before, ::after { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(59 130 246 / 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: ; } ::backdrop { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(59 130 246 / 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: ; } /*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com */ /* 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4) 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116) */ *, ::before, ::after { box-sizing: border-box; /* 1 */ border-width: 0; /* 2 */ border-style: solid; /* 2 */ border-color: #e5e7eb; /* 2 */ } ::before, ::after { --tw-content: ''; } /* 1. Use a consistent sensible line-height in all browsers. 2. Prevent adjustments of font size after orientation changes in iOS. 3. Use a more readable tab size. 4. Use the user's configured `sans` font-family by default. 5. Use the user's configured `sans` font-feature-settings by default. 6. Use the user's configured `sans` font-variation-settings by default. 7. Disable tap highlights on iOS */ html, :host { line-height: 1.5; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ -moz-tab-size: 4; /* 3 */ -o-tab-size: 4; tab-size: 4; /* 3 */ font-family: var(--font-family), sans-serif; /* 4 */ font-feature-settings: normal; /* 5 */ font-variation-settings: normal; /* 6 */ -webkit-tap-highlight-color: transparent; /* 7 */ } /* 1. Remove the margin in all browsers. 2. Inherit line-height from `html` so users can set them as a class directly on the `html` element. */ body { margin: 0; /* 1 */ line-height: inherit; /* 2 */ } /* 1. Add the correct height in Firefox. 2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655) 3. Ensure horizontal rules are visible by default. */ hr { height: 0; /* 1 */ color: inherit; /* 2 */ border-top-width: 1px; /* 3 */ } /* Add the correct text decoration in Chrome, Edge, and Safari. */ abbr:where([title]) { -webkit-text-decoration: underline dotted; text-decoration: underline dotted; } /* Remove the default font size and weight for headings. */ h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; } /* Reset links to optimize for opt-in styling instead of opt-out. */ a { color: inherit; text-decoration: inherit; } /* Add the correct font weight in Edge and Safari. */ b, strong { font-weight: bolder; } /* 1. Use the user's configured `mono` font-family by default. 2. Use the user's configured `mono` font-feature-settings by default. 3. Use the user's configured `mono` font-variation-settings by default. 4. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp, pre { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */ font-feature-settings: normal; /* 2 */ font-variation-settings: normal; /* 3 */ font-size: 1em; /* 4 */ } /* Add the correct font size in all browsers. */ small { font-size: 80%; } /* Prevent `sub` and `sup` elements from affecting the line height in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* 1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297) 2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016) 3. Remove gaps between table borders by default. */ table { text-indent: 0; /* 1 */ border-color: inherit; /* 2 */ border-collapse: collapse; /* 3 */ } /* 1. Change the font styles in all browsers. 2. Remove the margin in Firefox and Safari. 3. Remove default padding in all browsers. */ button, input, optgroup, select, textarea { font-family: inherit; /* 1 */ font-feature-settings: inherit; /* 1 */ font-variation-settings: inherit; /* 1 */ font-size: 100%; /* 1 */ font-weight: inherit; /* 1 */ line-height: inherit; /* 1 */ letter-spacing: inherit; /* 1 */ color: inherit; /* 1 */ margin: 0; /* 2 */ padding: 0; /* 3 */ } /* Remove the inheritance of text transform in Edge and Firefox. */ button, select { text-transform: none; } /* 1. Correct the inability to style clickable types in iOS and Safari. 2. Remove default button styles. */ button, input:where([type='button']), input:where([type='reset']), input:where([type='submit']) { -webkit-appearance: button; /* 1 */ background-color: transparent; /* 2 */ background-image: none; /* 2 */ } /* Use the modern Firefox focus style for all focusable elements. */ :-moz-focusring { outline: auto; } /* Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737) */ :-moz-ui-invalid { box-shadow: none; } /* Add the correct vertical alignment in Chrome and Firefox. */ progress { vertical-align: baseline; } /* Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /* 1. Correct the odd appearance in Chrome and Safari. 2. Correct the outline style in Safari. */ [type='search'] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /* Remove the inner padding in Chrome and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /* 1. Correct the inability to style clickable types in iOS and Safari. 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Add the correct display in Chrome and Safari. */ summary { display: list-item; } /* Removes the default spacing and border for appropriate elements. */ blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre { margin: 0; } fieldset { margin: 0; padding: 0; } legend { padding: 0; } ol, ul, menu { list-style: none; margin: 0; padding: 0; } /* Reset default styling for dialogs. */ dialog { padding: 0; } /* Prevent resizing textareas horizontally by default. */ textarea { resize: vertical; } /* 1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300) 2. Set the default placeholder color to the user's configured gray 400 color. */ input::-moz-placeholder, textarea::-moz-placeholder { opacity: 1; /* 1 */ color: #9ca3af; /* 2 */ } input::placeholder, textarea::placeholder { opacity: 1; /* 1 */ color: #9ca3af; /* 2 */ } /* Set the default cursor for buttons. */ button, [role="button"] { cursor: pointer; } /* Make sure disabled buttons don't get the pointer cursor. */ :disabled { cursor: default; } /* 1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14) 2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210) This can trigger a poorly considered lint error in some tools but is included by design. */ img, svg, video, canvas, audio, iframe, embed, object { display: block; /* 1 */ vertical-align: middle; /* 2 */ } /* Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14) */ img, video { max-width: 100%; height: auto; } /* Make elements with the HTML hidden attribute stay hidden by default */ [hidden]:where(:not([hidden="until-found"])) { display: none; } .container { width: 100%; } @media (min-width: 640px) { .container { max-width: 640px; } } @media (min-width: 768px) { .container { max-width: 768px; } } @media (min-width: 1024px) { .container { max-width: 1024px; } } @media (min-width: 1025px) { .container { max-width: 1025px; } } @media (min-width: 1280px) { .container { max-width: 1280px; } } @media (min-width: 1536px) { .container { max-width: 1536px; } } .visible { visibility: visible; } .fixed { position: fixed; } .absolute { position: absolute; } .relative { position: relative; } .sticky { position: sticky; } .inset-0 { inset: 0px; } .-top-1 { top: -0.25rem; } .bottom-0 { bottom: 0px; } .left-0 { left: 0px; } .right-0 { right: 0px; } .top-0 { top: 0px; } .top-1\/2 { top: 50%; } .top-1\/4 { top: 25%; } .top-2 { top: 0.5rem; } .z-\[11\] { z-index: 11; } .ml-auto { margin-left: auto; } .mt-3 { margin-top: 0.75rem; } .block { display: block; } .flex { display: flex; } .inline-flex { display: inline-flex; } .grid { display: grid; } .hidden { display: none; } .h-1 { height: 0.25rem; } .h-1\/2 { height: 50%; } .h-1\/3 { height: 33.333333%; } .h-12 { height: 3rem; } .h-20 { height: 5rem; } .h-24 { height: 6rem; } .h-4 { height: 1rem; } .h-5 { height: 1.25rem; } .h-6 { height: 1.5rem; } .h-\[3\.75em\] { height: 3.75em; } .h-\[60px\] { height: 60px; } .h-\[78px\] { height: 78px; } .h-\[99\%\] { height: 99%; } .h-auto { height: auto; } .h-full { height: 100%; } .max-h-6 { max-height: 1.5rem; } .max-h-\[60px\] { max-height: 60px; } .min-h-screen { min-height: 100vh; } .w-12 { width: 3rem; } .w-14 { width: 3.5rem; } .w-4 { width: 1rem; } .w-5 { width: 1.25rem; } .w-6 { width: 1.5rem; } .w-\[99\%\] { width: 99%; } .w-full { width: 100%; } .min-w-0 { min-width: 0px; } .min-w-\[3\.125em\] { min-width: 3.125em; } .min-w-\[50px\] { min-width: 50px; } .max-w-\[16\.25em\] { max-width: 16.25em; } .max-w-\[4\.8125em\] { max-width: 4.8125em; } .max-w-\[5\.875em\] { max-width: 5.875em; } .max-w-\[77px\] { max-width: 77px; } .max-w-\[94px\] { max-width: 94px; } .max-w-md { max-width: 28rem; } .flex-1 { flex: 1 1 0%; } .flex-shrink { flex-shrink: 1; } .-translate-y-1\/2 { --tw-translate-y: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .transform { transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .cursor-pointer { cursor: pointer; } .resize { resize: both; } .flex-row { flex-direction: row; } .flex-col { flex-direction: column; } .flex-wrap { flex-wrap: wrap; } .items-start { align-items: flex-start; } .items-center { align-items: center; } .justify-start { justify-content: flex-start; } .justify-center { justify-content: center; } .justify-between { justify-content: space-between; } .gap-1 { gap: 0.25rem; } .gap-2 { gap: 0.5rem; } .gap-3 { gap: 0.75rem; } .gap-4 { gap: 1rem; } .gap-x-3 { -moz-column-gap: 0.75rem; column-gap: 0.75rem; } .gap-y-1 { row-gap: 0.25rem; } .space-x-1 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(0.25rem * var(--tw-space-x-reverse)); margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse))); } .space-x-2 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(0.5rem * var(--tw-space-x-reverse)); margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse))); } .space-x-\[2px\] > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(2px * var(--tw-space-x-reverse)); margin-left: calc(2px * calc(1 - var(--tw-space-x-reverse))); } .space-x-\[5px\] > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(5px * var(--tw-space-x-reverse)); margin-left: calc(5px * calc(1 - var(--tw-space-x-reverse))); } .space-y-1 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(0.25rem * var(--tw-space-y-reverse)); } .space-y-2 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(0.5rem * var(--tw-space-y-reverse)); } .space-y-3 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(0.75rem * var(--tw-space-y-reverse)); } .space-y-4 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(1rem * var(--tw-space-y-reverse)); } .space-y-6 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(1.5rem * var(--tw-space-y-reverse)); } .space-y-8 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(2rem * var(--tw-space-y-reverse)); } .overflow-hidden { overflow: hidden; } .overflow-x-auto { overflow-x: auto; } .overflow-y-hidden { overflow-y: hidden; } .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .text-ellipsis { text-overflow: ellipsis; } .whitespace-nowrap { white-space: nowrap; } .rounded { border-radius: 0.25rem; } .rounded-\[0\.25em\] { border-radius: 0.25em; } .rounded-\[4px\] { border-radius: 4px; } .rounded-full { border-radius: 9999px; } .rounded-lg { border-radius: 0.5rem; } .rounded-md { border-radius: 0.375rem; } .rounded-xl { border-radius: 0.75rem; } .border { border-width: 1px; } .border-neutral-700 { --tw-border-opacity: 1; border-color: rgb(72 69 79 / var(--tw-border-opacity, 1)); } .p-1 { padding: 0.25rem; } .p-3 { padding: 0.75rem; } .p-4 { padding: 1rem; } .p-6 { padding: 1.5rem; } .px-1 { padding-left: 0.25rem; padding-right: 0.25rem; } .px-2 { padding-left: 0.5rem; padding-right: 0.5rem; } .px-4 { padding-left: 1rem; padding-right: 1rem; } .py-0 { padding-top: 0px; padding-bottom: 0px; } .py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; } .py-1\.5 { padding-top: 0.375rem; padding-bottom: 0.375rem; } .py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; } .py-3\.5 { padding-top: 0.875rem; padding-bottom: 0.875rem; } .py-4 { padding-top: 1rem; padding-bottom: 1rem; } .py-5 { padding-top: 1.25rem; padding-bottom: 1.25rem; } .py-\[1px\] { padding-top: 1px; padding-bottom: 1px; } .pl-2 { padding-left: 0.5rem; } .pl-\[84px\] { padding-left: 84px; } .pr-1 { padding-right: 0.25rem; } .pt-14 { padding-top: 3.5rem; } .pt-2 { padding-top: 0.5rem; } .pt-5 { padding-top: 1.25rem; } .pt-8 { padding-top: 2rem; } .text-center { text-align: center; } .font-saira { font-family: var(--font-family-saira), sans-serif; } .font-saira-condensed { font-family: var(--font-family-saira-condensed), sans-serif; } .text-2xl { font-size: 1.5rem; line-height: 2rem; } .text-3xl { font-size: 1.875rem; line-height: 2.25rem; } .text-4xl { font-size: 2.25rem; line-height: 2.5rem; } .text-\[4px\] { font-size: 4px; } .text-base { font-size: 1rem; line-height: 1.5rem; } .text-lg { font-size: 1.125rem; line-height: 1.75rem; } .text-sm { font-size: 0.875rem; line-height: 1.25rem; } .text-xl { font-size: 1.25rem; line-height: 1.75rem; } .text-xs { font-size: 0.75rem; line-height: 1rem; } .font-bold { font-weight: 700; } .font-light { font-weight: 300; } .font-medium { font-weight: 500; } .uppercase { text-transform: uppercase; } .capitalize { text-transform: capitalize; } .leading-\[10px\] { line-height: 10px; } .leading-\[1px\] { line-height: 1px; } .leading-\[2\] { line-height: 2; } .leading-\[8px\] { line-height: 8px; } .tracking-tighter { letter-spacing: -0.05em; } .text-error-500 { --tw-text-opacity: 1; color: rgb(233 62 79 / var(--tw-text-opacity, 1)); } .text-neutral-300 { --tw-text-opacity: 1; color: rgb(201 196 207 / var(--tw-text-opacity, 1)); } .text-neutral-400 { --tw-text-opacity: 1; color: rgb(154 150 162 / var(--tw-text-opacity, 1)); } .text-white { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)); } .underline { text-decoration-line: underline; } .overline { text-decoration-line: overline; } .shadow { --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .outline { outline-style: solid; } .blur { --tw-blur: blur(8px); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } .filter { filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } .backdrop-filter { backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); } .transition { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .transition-all { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .transition-colors { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .duration-200 { transition-duration: 200ms; } .ease-in-out { transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } @media (min-width: 768px) { .md\:w-56 { width: 14rem; } .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .md\:flex-row { flex-direction: row; } .md\:items-center { align-items: center; } } @media (min-width: 1280px) { .xl\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }