enr 0.2.3-alpha.2

package/styles/common.css

@@ -0,0 +1,1012 @@
+@charset "UTF-8";
+:root {
+  --en-color-neutral-70: #f9f9fb;
+  --en-color-neutral-80: #f2f1f1;
+  --en-color-neutral-90: #ebeaea;
+  --en-color-neutral-10: #e2e2e2;
+  --en-color-neutral-20: #cdcdcd;
+  --en-color-neutral-30: #b3b3b3;
+  --en-color-neutral-40: #9e9e9e;
+  --en-color-neutral-50: #858585;
+  --en-color-neutral-60: #696969;
+  --en-color-neutral-70: #4e4e4e;
+  --en-color-neutral-75: #313131;
+  --en-color-neutral-80: #343434;
+  --en-color-neutral-90: #1b1b1b;
+  --en-color-black: #000;
+  --en-color-white: #fff;
+  --en-color-ads: #00d0aa;
+}
+
+:root {
+  --en-color-blue: #0085f2;
+  --en-color-green: #009a46;
+  --en-color-yellow: #928700;
+  --en-color-red: #d30038;
+  --en-color-violet: #9b65ff;
+  --en-color-pink: #d00058;
+  --en-color-blue-10: #dce2f2;
+  --en-color-blue-20: #c1cff1;
+  --en-color-blue-30: #8cb4ff;
+  --en-color-blue-40: #5e9eff;
+  --en-color-blue-50: #0085f2;
+  --en-color-blue-60: #0069c2;
+  --en-color-blue-70: #004d92;
+  --en-color-blue-80: #003465;
+  --en-color-blue-90: #001b3a;
+  --en-color-green-10: #a9f3ba;
+  --en-color-green-20: #73e693;
+  --en-color-green-30: #00d061;
+  --en-color-green-40: #00b755;
+  --en-color-green-50: #009a46;
+  --en-color-green-60: #007936;
+  --en-color-green-70: #005a26;
+  --en-color-green-80: #003d18;
+  --en-color-green-90: #00210a;
+  --en-color-yellow-10: #f0e498;
+  --en-color-yellow-20: #dfd172;
+  --en-color-yellow-30: #c7b700;
+  --en-color-yellow-40: #afa100;
+  --en-color-yellow-50: #938700;
+  --en-color-yellow-60: #746a00;
+  --en-color-yellow-70: #564e00;
+  --en-color-yellow-80: #3a3500;
+  --en-color-yellow-90: #1f1c00;
+  --en-color-red-10: #ffd9dc;
+  --en-color-red-20: #ffc0c4;
+  --en-color-red-30: #ff97a0;
+  --en-color-red-40: #ff707f;
+  --en-color-red-50: #ff2a51;
+  --en-color-red-60: #d30038;
+  --en-color-red-70: #9e0027;
+  --en-color-red-80: #6f0019;
+  --en-color-red-90: #40000a;
+  --en-color-violet-10: #e6deff;
+  --en-color-violet-20: #d4c5ff;
+  --en-color-violet-30: #bea5ff;
+  --en-color-violet-40: #ae8aff;
+  --en-color-violet-50: #9b65ff;
+  --en-color-violet-60: #872bff;
+  --en-color-violet-70: #6800cf;
+  --en-color-violet-80: #480091;
+  --en-color-violet-90: #280056;
+  --en-color-blue: #0085f2;
+  --en-color-green: #009a46;
+  --en-color-yellow: #928700;
+  --en-color-red: #d30038;
+  --en-color-violet: #9b65ff;
+  --en-color-pink: #d00058;
+  --en-text-primary: var(--en-color-light-blue-30);
+  --en-text-secondary: #4e4e4e;
+  --en-text-invert: var(--en-primary-white);
+  --en-text-muted: var(--en-primary-dust);
+  --en-text-link: #0069c2;
+  --en-text-visited: #551a8b;
+  --en-text-hover: var(--en-primary-red);
+  --en-text-visited: #551a8b;
+  --en-text-active: #858585;
+  --en-text-inactive: #9e9e9ea6;
+  --en-background-primary: var(--en-primary-white);
+  --en-background-tab-level-1: var(--en-primary-black);
+  --en-background-tab-level-2: var(--en-primary-dust);
+  --en-background-tab-transparent: #6666;
+  --en-table-border-color: #000;
+  --en-curriculum-shadow: 4px 4px 8px 0 #b3b3b32e, -4px 4px 8px 0 #b3b3b326;
+  --en-curriculum-shadow-landing-about-ul: 0 4px 10px 0 #e3642a0f, 0 -2px 4px 0 #b25c350f;
+  --en-box-shadow: 1px 1px 12px #6666;
+  --en-box-shadow-primary: 1px 1px 12px #6666;
+  --en-box-shadow-primary-small: 1px 1px 3px #6666;
+  --en-box-shadow-primary-large: 1px 1px 24px #6666;
+  color-scheme: light;
+}
+
+@media (prefers-color-scheme: light) {
+  :root:not(.en-light):not(.en-dark) {
+    --en-color-blue: #0085f2;
+    --en-color-green: #009a46;
+    --en-color-yellow: #928700;
+    --en-color-red: #d30038;
+    --en-color-violet: #9b65ff;
+    --en-color-pink: #d00058;
+    --en-color-blue-10: #dce2f2;
+    --en-color-blue-20: #c1cff1;
+    --en-color-blue-30: #8cb4ff;
+    --en-color-blue-40: #5e9eff;
+    --en-color-blue-50: #0085f2;
+    --en-color-blue-60: #0069c2;
+    --en-color-blue-70: #004d92;
+    --en-color-blue-80: #003465;
+    --en-color-blue-90: #001b3a;
+    --en-color-green-10: #a9f3ba;
+    --en-color-green-20: #73e693;
+    --en-color-green-30: #00d061;
+    --en-color-green-40: #00b755;
+    --en-color-green-50: #009a46;
+    --en-color-green-60: #007936;
+    --en-color-green-70: #005a26;
+    --en-color-green-80: #003d18;
+    --en-color-green-90: #00210a;
+    --en-color-yellow-10: #f0e498;
+    --en-color-yellow-20: #dfd172;
+    --en-color-yellow-30: #c7b700;
+    --en-color-yellow-40: #afa100;
+    --en-color-yellow-50: #938700;
+    --en-color-yellow-60: #746a00;
+    --en-color-yellow-70: #564e00;
+    --en-color-yellow-80: #3a3500;
+    --en-color-yellow-90: #1f1c00;
+    --en-color-red-10: #ffd9dc;
+    --en-color-red-20: #ffc0c4;
+    --en-color-red-30: #ff97a0;
+    --en-color-red-40: #ff707f;
+    --en-color-red-50: #ff2a51;
+    --en-color-red-60: #d30038;
+    --en-color-red-70: #9e0027;
+    --en-color-red-80: #6f0019;
+    --en-color-red-90: #40000a;
+    --en-color-violet-10: #e6deff;
+    --en-color-violet-20: #d4c5ff;
+    --en-color-violet-30: #bea5ff;
+    --en-color-violet-40: #ae8aff;
+    --en-color-violet-50: #9b65ff;
+    --en-color-violet-60: #872bff;
+    --en-color-violet-70: #6800cf;
+    --en-color-violet-80: #480091;
+    --en-color-violet-90: #280056;
+    --en-color-blue: #0085f2;
+    --en-color-green: #009a46;
+    --en-color-yellow: #928700;
+    --en-color-red: #d30038;
+    --en-color-violet: #9b65ff;
+    --en-color-pink: #d00058;
+    --en-text-primary: var(--en-color-light-blue-30);
+    --en-text-secondary: #4e4e4e;
+    --en-text-invert: var(--en-primary-white);
+    --en-text-muted: var(--en-primary-dust);
+    --en-text-link: #0069c2;
+    --en-text-visited: #551a8b;
+    --en-text-hover: var(--en-primary-red);
+    --en-text-visited: #551a8b;
+    --en-text-active: #858585;
+    --en-text-inactive: #9e9e9ea6;
+    --en-background-primary: var(--en-primary-white);
+    --en-background-tab-level-1: var(--en-primary-black);
+    --en-background-tab-level-2: var(--en-primary-dust);
+    --en-background-tab-transparent: #6666;
+    --en-table-border-color: #000;
+    --en-curriculum-shadow: 4px 4px 8px 0 #b3b3b32e, -4px 4px 8px 0 #b3b3b326;
+    --en-curriculum-shadow-landing-about-ul: 0 4px 10px 0 #e3642a0f, 0 -2px 4px 0 #b25c350f;
+    --en-box-shadow: 1px 1px 12px #6666;
+    --en-box-shadow-primary: 1px 1px 12px #6666;
+    --en-box-shadow-primary-small: 1px 1px 3px #6666;
+    --en-box-shadow-primary-large: 1px 1px 24px #6666;
+    color-scheme: light;
+  }
+}
+@media (prefers-color-scheme: dark) {
+  :root:not(.en-light):not(.en-dark) {
+    --en-color-blue: #0085f2;
+    --en-color-green: #009a46;
+    --en-color-yellow: #928700;
+    --en-color-red: #d30038;
+    --en-color-violet: #9b65ff;
+    --en-color-pink: #d00058;
+    --en-color-blue-10: #dce2f2;
+    --en-color-blue-20: #c1cff1;
+    --en-color-blue-30: #8cb4ff;
+    --en-color-blue-40: #5e9eff;
+    --en-color-blue-50: #0085f2;
+    --en-color-blue-60: #0069c2;
+    --en-color-blue-70: #004d92;
+    --en-color-blue-80: #003465;
+    --en-color-blue-90: #001b3a;
+    --en-color-green-10: #a9f3ba;
+    --en-color-green-20: #73e693;
+    --en-color-green-30: #00d061;
+    --en-color-green-40: #00b755;
+    --en-color-green-50: #009a46;
+    --en-color-green-60: #007936;
+    --en-color-green-70: #005a26;
+    --en-color-green-80: #003d18;
+    --en-color-green-90: #00210a;
+    --en-color-yellow-10: #f0e498;
+    --en-color-yellow-20: #dfd172;
+    --en-color-yellow-30: #c7b700;
+    --en-color-yellow-40: #afa100;
+    --en-color-yellow-50: #938700;
+    --en-color-yellow-60: #746a00;
+    --en-color-yellow-70: #564e00;
+    --en-color-yellow-80: #3a3500;
+    --en-color-yellow-90: #1f1c00;
+    --en-color-red-10: #ffd9dc;
+    --en-color-red-20: #ffc0c4;
+    --en-color-red-30: #ff97a0;
+    --en-color-red-40: #ff707f;
+    --en-color-red-50: #ff2a51;
+    --en-color-red-60: #d30038;
+    --en-color-red-70: #9e0027;
+    --en-color-red-80: #6f0019;
+    --en-color-red-90: #40000a;
+    --en-color-violet-10: #e6deff;
+    --en-color-violet-20: #d4c5ff;
+    --en-color-violet-30: #bea5ff;
+    --en-color-violet-40: #ae8aff;
+    --en-color-violet-50: #9b65ff;
+    --en-color-violet-60: #872bff;
+    --en-color-violet-70: #6800cf;
+    --en-color-violet-80: #480091;
+    --en-color-violet-90: #280056;
+    --en-color-blue: #0085f2;
+    --en-color-green: #009a46;
+    --en-color-yellow: #928700;
+    --en-color-red: #d30038;
+    --en-color-violet: #9b65ff;
+    --en-color-pink: #d00058;
+    --en-text-primary: #fff;
+    --en-text-secondary: #cdcdcd;
+    --en-text-invert: var(--en-primary-black);
+    --en-text-muted: var(--en-primary-dust);
+    --en-text-link: #8cb4ff;
+    --en-text-visited: #ffadff;
+    --en-text-hover: var(--en-primary-red);
+    --en-text-active: #858585;
+    --en-text-inactive: #cdcdcda6;
+    --en-background-primary: var(--en-primary-black);
+    --en-background-tab-level-1: #666666;
+    --en-background-tab-level-2: var(--en-primary-dust);
+    --en-background-tab-transparent: #6666;
+    --en-table-border-color: #ff3663;
+    --en-box-shadow: 1px 1px 12px #6666;
+    --en-box-shadow-primary: 1px 1px 12px #6666;
+    --en-box-shadow-primary-small: 1px 1px 3px #6666;
+    --en-box-shadow-primary-large: 1px 1px 24px #6666;
+    color-scheme: dark;
+  }
+}
+.en-light {
+  --en-color-blue: #0085f2;
+  --en-color-green: #009a46;
+  --en-color-yellow: #928700;
+  --en-color-red: #d30038;
+  --en-color-violet: #9b65ff;
+  --en-color-pink: #d00058;
+  --en-color-blue-10: #dce2f2;
+  --en-color-blue-20: #c1cff1;
+  --en-color-blue-30: #8cb4ff;
+  --en-color-blue-40: #5e9eff;
+  --en-color-blue-50: #0085f2;
+  --en-color-blue-60: #0069c2;
+  --en-color-blue-70: #004d92;
+  --en-color-blue-80: #003465;
+  --en-color-blue-90: #001b3a;
+  --en-color-green-10: #a9f3ba;
+  --en-color-green-20: #73e693;
+  --en-color-green-30: #00d061;
+  --en-color-green-40: #00b755;
+  --en-color-green-50: #009a46;
+  --en-color-green-60: #007936;
+  --en-color-green-70: #005a26;
+  --en-color-green-80: #003d18;
+  --en-color-green-90: #00210a;
+  --en-color-yellow-10: #f0e498;
+  --en-color-yellow-20: #dfd172;
+  --en-color-yellow-30: #c7b700;
+  --en-color-yellow-40: #afa100;
+  --en-color-yellow-50: #938700;
+  --en-color-yellow-60: #746a00;
+  --en-color-yellow-70: #564e00;
+  --en-color-yellow-80: #3a3500;
+  --en-color-yellow-90: #1f1c00;
+  --en-color-red-10: #ffd9dc;
+  --en-color-red-20: #ffc0c4;
+  --en-color-red-30: #ff97a0;
+  --en-color-red-40: #ff707f;
+  --en-color-red-50: #ff2a51;
+  --en-color-red-60: #d30038;
+  --en-color-red-70: #9e0027;
+  --en-color-red-80: #6f0019;
+  --en-color-red-90: #40000a;
+  --en-color-violet-10: #e6deff;
+  --en-color-violet-20: #d4c5ff;
+  --en-color-violet-30: #bea5ff;
+  --en-color-violet-40: #ae8aff;
+  --en-color-violet-50: #9b65ff;
+  --en-color-violet-60: #872bff;
+  --en-color-violet-70: #6800cf;
+  --en-color-violet-80: #480091;
+  --en-color-violet-90: #280056;
+  --en-color-blue: #0085f2;
+  --en-color-green: #009a46;
+  --en-color-yellow: #928700;
+  --en-color-red: #d30038;
+  --en-color-violet: #9b65ff;
+  --en-color-pink: #d00058;
+  --en-text-primary: var(--en-color-light-blue-30);
+  --en-text-secondary: #4e4e4e;
+  --en-text-invert: var(--en-primary-white);
+  --en-text-muted: var(--en-primary-dust);
+  --en-text-link: #0069c2;
+  --en-text-visited: #551a8b;
+  --en-text-hover: var(--en-primary-red);
+  --en-text-visited: #551a8b;
+  --en-text-active: #858585;
+  --en-text-inactive: #9e9e9ea6;
+  --en-background-primary: var(--en-primary-white);
+  --en-background-tab-level-1: var(--en-primary-black);
+  --en-background-tab-level-2: var(--en-primary-dust);
+  --en-background-tab-transparent: #6666;
+  --en-table-border-color: #000;
+  --en-curriculum-shadow: 4px 4px 8px 0 #b3b3b32e, -4px 4px 8px 0 #b3b3b326;
+  --en-curriculum-shadow-landing-about-ul: 0 4px 10px 0 #e3642a0f, 0 -2px 4px 0 #b25c350f;
+  --en-box-shadow: 1px 1px 12px #6666;
+  --en-box-shadow-primary: 1px 1px 12px #6666;
+  --en-box-shadow-primary-small: 1px 1px 3px #6666;
+  --en-box-shadow-primary-large: 1px 1px 24px #6666;
+  color-scheme: light;
+}
+
+.en-dark {
+  --en-color-blue: #0085f2;
+  --en-color-green: #009a46;
+  --en-color-yellow: #928700;
+  --en-color-red: #d30038;
+  --en-color-violet: #9b65ff;
+  --en-color-pink: #d00058;
+  --en-color-blue-10: #dce2f2;
+  --en-color-blue-20: #c1cff1;
+  --en-color-blue-30: #8cb4ff;
+  --en-color-blue-40: #5e9eff;
+  --en-color-blue-50: #0085f2;
+  --en-color-blue-60: #0069c2;
+  --en-color-blue-70: #004d92;
+  --en-color-blue-80: #003465;
+  --en-color-blue-90: #001b3a;
+  --en-color-green-10: #a9f3ba;
+  --en-color-green-20: #73e693;
+  --en-color-green-30: #00d061;
+  --en-color-green-40: #00b755;
+  --en-color-green-50: #009a46;
+  --en-color-green-60: #007936;
+  --en-color-green-70: #005a26;
+  --en-color-green-80: #003d18;
+  --en-color-green-90: #00210a;
+  --en-color-yellow-10: #f0e498;
+  --en-color-yellow-20: #dfd172;
+  --en-color-yellow-30: #c7b700;
+  --en-color-yellow-40: #afa100;
+  --en-color-yellow-50: #938700;
+  --en-color-yellow-60: #746a00;
+  --en-color-yellow-70: #564e00;
+  --en-color-yellow-80: #3a3500;
+  --en-color-yellow-90: #1f1c00;
+  --en-color-red-10: #ffd9dc;
+  --en-color-red-20: #ffc0c4;
+  --en-color-red-30: #ff97a0;
+  --en-color-red-40: #ff707f;
+  --en-color-red-50: #ff2a51;
+  --en-color-red-60: #d30038;
+  --en-color-red-70: #9e0027;
+  --en-color-red-80: #6f0019;
+  --en-color-red-90: #40000a;
+  --en-color-violet-10: #e6deff;
+  --en-color-violet-20: #d4c5ff;
+  --en-color-violet-30: #bea5ff;
+  --en-color-violet-40: #ae8aff;
+  --en-color-violet-50: #9b65ff;
+  --en-color-violet-60: #872bff;
+  --en-color-violet-70: #6800cf;
+  --en-color-violet-80: #480091;
+  --en-color-violet-90: #280056;
+  --en-color-blue: #0085f2;
+  --en-color-green: #009a46;
+  --en-color-yellow: #928700;
+  --en-color-red: #d30038;
+  --en-color-violet: #9b65ff;
+  --en-color-pink: #d00058;
+  --en-text-primary: #fff;
+  --en-text-secondary: #cdcdcd;
+  --en-text-invert: var(--en-primary-black);
+  --en-text-muted: var(--en-primary-dust);
+  --en-text-link: #8cb4ff;
+  --en-text-visited: #ffadff;
+  --en-text-hover: var(--en-primary-red);
+  --en-text-active: #858585;
+  --en-text-inactive: #cdcdcda6;
+  --en-background-primary: var(--en-primary-black);
+  --en-background-tab-level-1: #666666;
+  --en-background-tab-level-2: var(--en-primary-dust);
+  --en-background-tab-transparent: #6666;
+  --en-table-border-color: #ff3663;
+  --en-box-shadow: 1px 1px 12px #6666;
+  --en-box-shadow-primary: 1px 1px 12px #6666;
+  --en-box-shadow-primary-small: 1px 1px 3px #6666;
+  --en-box-shadow-primary-large: 1px 1px 24px #6666;
+  color-scheme: dark;
+}
+
+.en-full-container {
+  width: 100%;
+  height: 100%;
+}
+
+.en-padding-horizontal-4 {
+  padding-left: 4px;
+  padding-right: 4px;
+}
+
+.en-padding-vertical-4 {
+  padding-top: 4px;
+  padding-bottom: 4px;
+}
+
+.en-padding-4 {
+  padding: 4px;
+}
+
+.en-margin-horizontal-4 {
+  margin-left: 4px;
+  margin-right: 4px;
+}
+
+.en-margin-vertical-4 {
+  margin-top: 4px;
+  margin-bottom: 4px;
+}
+
+.en-margin-4 {
+  margin: 4px;
+}
+
+.en-border-radius-4 {
+  border-radius: 4px;
+}
+
+.en-padding-horizontal-8 {
+  padding-left: 8px;
+  padding-right: 8px;
+}
+
+.en-padding-vertical-8 {
+  padding-top: 8px;
+  padding-bottom: 8px;
+}
+
+.en-padding-8 {
+  padding: 8px;
+}
+
+.en-margin-horizontal-8 {
+  margin-left: 8px;
+  margin-right: 8px;
+}
+
+.en-margin-vertical-8 {
+  margin-top: 8px;
+  margin-bottom: 8px;
+}
+
+.en-margin-8 {
+  margin: 8px;
+}
+
+.en-border-radius-8 {
+  border-radius: 8px;
+}
+
+.en-padding-horizontal-12 {
+  padding-left: 12px;
+  padding-right: 12px;
+}
+
+.en-padding-vertical-12 {
+  padding-top: 12px;
+  padding-bottom: 12px;
+}
+
+.en-padding-12 {
+  padding: 12px;
+}
+
+.en-margin-horizontal-12 {
+  margin-left: 12px;
+  margin-right: 12px;
+}
+
+.en-margin-vertical-12 {
+  margin-top: 12px;
+  margin-bottom: 12px;
+}
+
+.en-margin-12 {
+  margin: 12px;
+}
+
+.en-border-radius-12 {
+  border-radius: 12px;
+}
+
+.en-padding-horizontal-16 {
+  padding-left: 16px;
+  padding-right: 16px;
+}
+
+.en-padding-vertical-16 {
+  padding-top: 16px;
+  padding-bottom: 16px;
+}
+
+.en-padding-16 {
+  padding: 16px;
+}
+
+.en-margin-horizontal-16 {
+  margin-left: 16px;
+  margin-right: 16px;
+}
+
+.en-margin-vertical-16 {
+  margin-top: 16px;
+  margin-bottom: 16px;
+}
+
+.en-margin-16 {
+  margin: 16px;
+}
+
+.en-border-radius-16 {
+  border-radius: 16px;
+}
+
+.en-padding-horizontal-20 {
+  padding-left: 20px;
+  padding-right: 20px;
+}
+
+.en-padding-vertical-20 {
+  padding-top: 20px;
+  padding-bottom: 20px;
+}
+
+.en-padding-20 {
+  padding: 20px;
+}
+
+.en-margin-horizontal-20 {
+  margin-left: 20px;
+  margin-right: 20px;
+}
+
+.en-margin-vertical-20 {
+  margin-top: 20px;
+  margin-bottom: 20px;
+}
+
+.en-margin-20 {
+  margin: 20px;
+}
+
+.en-border-radius-20 {
+  border-radius: 20px;
+}
+
+.en-padding-horizontal-24 {
+  padding-left: 24px;
+  padding-right: 24px;
+}
+
+.en-padding-vertical-24 {
+  padding-top: 24px;
+  padding-bottom: 24px;
+}
+
+.en-padding-24 {
+  padding: 24px;
+}
+
+.en-margin-horizontal-24 {
+  margin-left: 24px;
+  margin-right: 24px;
+}
+
+.en-margin-vertical-24 {
+  margin-top: 24px;
+  margin-bottom: 24px;
+}
+
+.en-margin-24 {
+  margin: 24px;
+}
+
+.en-border-radius-24 {
+  border-radius: 24px;
+}
+
+.en-padding-horizontal-28 {
+  padding-left: 28px;
+  padding-right: 28px;
+}
+
+.en-padding-vertical-28 {
+  padding-top: 28px;
+  padding-bottom: 28px;
+}
+
+.en-padding-28 {
+  padding: 28px;
+}
+
+.en-margin-horizontal-28 {
+  margin-left: 28px;
+  margin-right: 28px;
+}
+
+.en-margin-vertical-28 {
+  margin-top: 28px;
+  margin-bottom: 28px;
+}
+
+.en-margin-28 {
+  margin: 28px;
+}
+
+.en-border-radius-28 {
+  border-radius: 28px;
+}
+
+.en-padding-horizontal-32 {
+  padding-left: 32px;
+  padding-right: 32px;
+}
+
+.en-padding-vertical-32 {
+  padding-top: 32px;
+  padding-bottom: 32px;
+}
+
+.en-padding-32 {
+  padding: 32px;
+}
+
+.en-margin-horizontal-32 {
+  margin-left: 32px;
+  margin-right: 32px;
+}
+
+.en-margin-vertical-32 {
+  margin-top: 32px;
+  margin-bottom: 32px;
+}
+
+.en-margin-32 {
+  margin: 32px;
+}
+
+.en-border-radius-32 {
+  border-radius: 32px;
+}
+
+.en-padding-horizontal-36 {
+  padding-left: 36px;
+  padding-right: 36px;
+}
+
+.en-padding-vertical-36 {
+  padding-top: 36px;
+  padding-bottom: 36px;
+}
+
+.en-padding-36 {
+  padding: 36px;
+}
+
+.en-margin-horizontal-36 {
+  margin-left: 36px;
+  margin-right: 36px;
+}
+
+.en-margin-vertical-36 {
+  margin-top: 36px;
+  margin-bottom: 36px;
+}
+
+.en-margin-36 {
+  margin: 36px;
+}
+
+.en-border-radius-36 {
+  border-radius: 36px;
+}
+
+.en-padding-horizontal-40 {
+  padding-left: 40px;
+  padding-right: 40px;
+}
+
+.en-padding-vertical-40 {
+  padding-top: 40px;
+  padding-bottom: 40px;
+}
+
+.en-padding-40 {
+  padding: 40px;
+}
+
+.en-margin-horizontal-40 {
+  margin-left: 40px;
+  margin-right: 40px;
+}
+
+.en-margin-vertical-40 {
+  margin-top: 40px;
+  margin-bottom: 40px;
+}
+
+.en-margin-40 {
+  margin: 40px;
+}
+
+.en-border-radius-40 {
+  border-radius: 40px;
+}
+
+.en-inline-block {
+  display: inline-block;
+}
+
+.en-relative {
+  position: relative;
+}
+
+.en-flex,
+.en-flex-row,
+.en-flex-column,
+.en-flex-row-reverse,
+.en-flex-column-reverse {
+  display: flex;
+  flex-wrap: nowrap;
+}
+
+.en-flex,
+.en-flex-row {
+  flex-direction: row;
+}
+
+.en-flex-row-reverse {
+  flex-direction: row-reverse;
+}
+
+.en-flex-column {
+  flex-direction: column;
+}
+
+.en-flex-column {
+  flex-direction: column-reverse;
+}
+
+.en-flex-wrap {
+  flex-wrap: wrap;
+}
+
+.en-flex-nowrap {
+  flex-wrap: nowrap;
+}
+
+.en-flex-warp-reverse {
+  flex-wrap: wrap-reverse;
+}
+
+.en-center {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.en-dust {
+  color: var(--primary-dust);
+}
+
+/** 文本显示一行，超出点点点 */
+.en-text-in-one-line {
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  word-break: break-all;
+}
+
+.en-text-in-one-line-hide {
+  white-space: nowrap;
+  text-overflow: clip;
+  overflow: hidden;
+  word-break: break-all;
+}
+
+/** 文本显示两行，超出点点点 */
+.en-text-in-two-line {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  line-clamp: 2;
+  -webkit-box-orient: vertical;
+}
+
+/*  彩色字 */
+.en-color-text {
+  color: transparent;
+  background-image: linear-gradient(45deg, #ff0, #0f0, #f00, #0ff, #00f, #f0f, #ff0);
+  background-position: 0% 0%;
+  background-size: 400% 200%;
+  background-clip: text;
+  animation: 6s ease-in 0s infinite colorText alternate;
+}
+
+.en-red-bg {
+  background-color: #f12;
+}
+
+.en-float-left {
+  float: left;
+}
+
+.en-float-right,
+.en-float {
+  float: right;
+}
+
+.en-clear-float,
+.en-clear {
+  clear: both;
+}
+
+.en-loading {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  background-color: transparent;
+  background-image: radial-gradient(#f00, #f00 50%, transparent 50%, transparent), radial-gradient(#af1, #af1 50%, transparent 50%, transparent), radial-gradient(#0ff, #0ff 50%, transparent 50%, transparent), radial-gradient(#f0f, #f0f 50%, transparent 50%, transparent);
+  background-repeat: no-repeat;
+  animation: 2.4s ease-in-out 0s infinite loading;
+}
+
+.en-text-center {
+  text-align: center;
+}
+
+.en-text-right {
+  text-align: end;
+}
+
+.en-text-small {
+  font-size: 0.6rem;
+}
+
+.en-user-select-text {
+  -khtml-user-select: text;
+  -moz-user-select: text;
+  -ms-user-select: text;
+  user-select: text;
+}
+
+.en-cursor-pointer {
+  cursor: pointer;
+}
+
+@keyframes loading {
+  100%, 0% {
+    background-size: 10% 10%, 10% 10%, 10% 10%, 10% 10%;
+    background-position: 25% 45%, 41.7% 45%, 58.3% 45%, 75% 45%;
+  }
+  20%, 80% {
+    background-size: 2.5% 2.5%;
+    background-position: 25% 45%;
+  }
+  22% {
+    background-size: 3.75% 3.75%, 2.5% 2.5%, 2.5% 2.5%, 2.5% 2.5%;
+    background-position: 25.85% 38.53%, 25% 45%, 25% 45%, 25% 45%;
+  }
+  24% {
+    background-size: 5% 5%, 2.5% 2.5%, 2.5% 2.5%, 2.5% 2.5%;
+    background-position: 28.35% 32.5%, 25% 45%, 25% 45%, 25% 45%;
+  }
+  26% {
+    background-size: 6.25% 6.25%, 2.5% 2.5%, 2.5% 2.5%, 2.5% 2.5%;
+    background-position: 32.32% 27.32%, 25% 45%, 25% 45%, 25% 45%;
+  }
+  28% {
+    background-size: 7.5% 7.5%, 3.75% 3.75%, 2.5% 2.5%, 2.5% 2.5%;
+    background-position: 37.5% 23.35%, 25.85% 38.53%, 25% 45%, 25% 45%;
+  }
+  30% {
+    background-size: 8.75% 8.75%, 5% 5%, 2.5% 2.5%, 2.5% 2.5%;
+    background-position: 43.53% 20.85%, 28.35% 32.5%, 25% 45%, 25% 45%;
+  }
+  32% {
+    background-size: 10% 10%, 6.25% 6.25%, 3.75% 3.75%, 2.5% 2.5%;
+    background-position: 50% 20%, 32.32% 27.32%, 25.85% 38.53%, 25% 45%;
+  }
+  34% {
+    background-size: 10% 10%, 7.5% 7.5%, 5% 5%, 2.5% 2.5%;
+    background-position: 56.47% 20.85%, 37.32% 23.35%, 28.35% 32.5%, 25.85% 38.53%;
+  }
+  36% {
+    background-position: 62.4999992265% 23.3493644588%, 43.5295233332% 20.8518544873%, 32.3223302335% 27.3223307072%, 25.8518543139% 38.5295239803%;
+  }
+  38% {
+    background-position: 67.6776688192% 27.3223297598%, 49.9999993301% 20%, 37.4999996132% 23.3493651287%, 28.3493647937% 32.5000001934%;
+  }
+  40% {
+    background-position: 71.6506345364% 32.4999990331%, 56.4704753727% 20.8518541405%, 43.5295233332% 20.8518544873%, 32.3223302335% 27.3223307072%;
+  }
+  42% {
+    background-position: 74.1481453394% 38.5295226862%, 62.4999992265% 23.3493644588%, 49.9999993301% 20%, 37.4999996132% 23.3493651287%;
+  }
+  44% {
+    background-position: 75% 44.9999986603%, 67.6776688192% 27.3223297598%, 56.4704753727% 20.8518541405%, 43.5295233332% 20.8518544873%;
+  }
+  46% {
+    background-position: 74.1481460329% 51.4704747256%, 71.6506345364% 32.4999990331%, 62.4999992265% 23.3493644588%, 49.9999993301% 20%;
+  }
+  48% {
+    background-position: 71.6506358761% 57.4999986464%, 74.1481453394% 38.5295226862%, 67.6776688192% 27.3223297598%, 56.4704753727% 20.8518541405%;
+  }
+  50% {
+    background-position: 67.6776707138% 62.6776683455%, 75% 44.9999986603%, 71.6506345364% 32.4999990331%, 62.4999992265% 23.3493644588%;
+  }
+  52% {
+    background-position: 62.500001547% 66.6506342014%, 74.1481460329% 51.4704747256%, 74.1481453394% 38.5295226862%, 67.6776688192% 27.3223297598%;
+  }
+  54% {
+    background-position: 56.4704779609% 69.148145166%, 71.6506358761% 57.4999986464%, 75% 44.9999986603%, 71.6506345364% 32.4999990331%;
+  }
+  56% {
+    background-position: 50.0000020096% 70%, 67.6776707138% 62.6776683455%, 74.1481460329% 51.4704747256%, 74.1481453394% 38.5295226862%;
+  }
+  58% {
+    background-position: 43.5295259214% 69.1481462062%, 62.500001547% 66.6506342014%, 71.6506358761% 57.4999986464%, 75% 44.9999986603%;
+  }
+  60% {
+    background-position: 37.5000019338% 66.6506362111%, 56.4704779609% 69.148145166%, 67.6776707138% 62.6776683455%, 74.1481460329% 51.4704747256%;
+  }
+  62% {
+    background-position: 32.3223321282% 62.6776711875%, 50.0000020096% 70%, 62.500001547% 66.6506342014%, 71.6506358761% 57.4999986464%;
+  }
+  64% {
+    background-position: 28.3493661335% 57.5000021271%, 43.5295259214% 69.1481462062%, 56.4704779609% 69.148145166%, 67.6776707138% 62.6776683455%;
+  }
+  66% {
+    background-position: 25.8518550074% 51.4704786079%, 37.5000019338% 66.6506362111%, 50.0000020096% 70%, 62.500001547% 66.6506342014%;
+  }
+  68% {
+    background-size: 10% 10%, 7.5% 7.5%, 5% 5%, 2.5% 2.5%;
+    background-position: 25% 45%, 28.35% 57.45%, 37.45% 66.65%, 48% 70%;
+  }
+  70% {
+    background-size: 8.75% 8.75%, 7.5% 7.5%, 5% 5%, 2.5% 2.5%;
+    background-position: 25% 45%, 25.85% 51.47%, 32.32% 62.68%, 43.53% 69.15%;
+  }
+  72% {
+    background-size: 7.5% 7.5%, 7.5% 7.5%, 5% 5%, 2.5% 2.5%;
+    background-position: 25% 45%, 25% 45%, 28.35% 57.45%, 37.45% 66.65%;
+  }
+  74% {
+    background-size: 6.25% 6.25%, 6.25% 6.25%, 5% 5%, 2.5% 2.5%;
+    background-position: 25% 45%, 25% 45%, 25.85% 51.47%, 32.32% 62.68%;
+  }
+  76% {
+    background-size: 5% 5%, 5% 5%, 5% 5%, 2.5% 2.5%;
+    background-position: 25% 45%, 25% 45%, 25% 45%, 28.35% 57.45%;
+  }
+  78% {
+    background-size: 3.75% 3.75%, 3.75% 3.75%, 3.75% 3.75%, 2.5% 2.5%;
+    background-position: 25% 45%, 25% 45%, 25% 45%, 25.85% 51.47%;
+  }
+}
+@keyframes colorText {
+  0% {
+    background-position: 400% 0%;
+  }
+  100% {
+    background-position: 0% 0%;
+  }
+}