@sproutsocial/seeds-theme 0.1.0

package/dist/legacy-dark.css

@@ -0,0 +1,437 @@
+@import "./theme-dark.css";
+
+[data-theme="dark"], .dark, .lights-out, [data-color-mode="dark"] {
+  --color-app-bg-base: #162020;
+  --color-container-bg-base: #273333;
+  --color-container-bg-success: #006b40;
+  --color-container-bg-warning: #944c0c;
+  --color-container-bg-error: #992222;
+  --color-container-bg-info: #0c3f89;
+  --color-container-bg-opportunity: #483a9c;
+  --color-container-bg-danger: #992222;
+  --color-container-bg-decorative-green: #006b40;
+  --color-container-bg-decorative-blue: #0c3f89;
+  --color-container-bg-decorative-purple: #483a9c;
+  --color-container-bg-decorative-yellow: #944c0c;
+  --color-container-bg-decorative-orange: #962c0b;
+  --color-container-bg-decorative-red: #992222;
+  --color-container-bg-decorative-neutral: #162020;
+  --color-container-bg-decorative-magenta: #6c2277;
+  --color-container-bg-decorative-pink: #931847;
+  --color-container-bg-decorative-aqua: #035e73;
+  --color-container-bg-decorative-teal: #026661;
+  --color-container-bg-selected: #FFFFFF;
+  --color-container-bg-positive_sentiment: #3876e3;
+  --color-container-bg-negative_sentiment: #f76054;
+  --color-container-bg-neutral_sentiment: #c8cccc;
+  --color-container-bg-ai_generated: var(--color-container-bg-ai-generated);
+  --color-container-bg-ai-generated: var(--color-gradient-ai-subtle), var(--color-container-bg-base); /** Composed background for AI-generated containers, layered over the mode-specific base surface. */
+  --color-container-border-base: #040404;
+  --color-container-border-success: #59cb59;
+  --color-container-border-warning: #ffbc00;
+  --color-container-border-error: #ed4c42;
+  --color-container-border-danger: #ed4c42;
+  --color-container-border-info: #2b68d3;
+  --color-container-border-opportunity: #9180f4;
+  --color-container-border-decorative-green: #59cb59;
+  --color-container-border-decorative-blue: #2b68d3;
+  --color-container-border-decorative-purple: #9180f4;
+  --color-container-border-decorative-yellow: #ffbc00;
+  --color-container-border-decorative-orange: #f57d33;
+  --color-container-border-decorative-red: #ed4c42;
+  --color-container-border-decorative-neutral: #6e797a;
+  --color-container-border-decorative-magenta: #c44eb9;
+  --color-container-border-decorative-pink: #e0447c;
+  --color-container-border-decorative-aqua: #17b8ce;
+  --color-container-border-decorative-teal: #08c4b2;
+  --color-container-border-selected: #FFFFFF;
+  --color-container-border-ai_generated: #6f5ed3;
+  --color-gradient-ai: radial-gradient(circle at bottom left, #679eff 0%, #b984ff 61%, #f282f5 100%);
+  --color-gradient-ai-subtle: radial-gradient(circle at bottom left, color-mix(in srgb, #679eff, transparent 80%) 0%, color-mix(in srgb, #b984ff, transparent 80%) 61%, color-mix(in srgb, #f282f5, transparent 80%) 100%);
+  --color-gradient-ai-stop-1: #679eff;
+  --color-gradient-ai-stop-2: #b984ff;
+  --color-gradient-ai-stop-3: #f282f5;
+  --color-button-primary-bg-base: #679eff;
+  --color-button-primary-bg-hover: #a1c2f8;
+  --color-button-primary-bg-active: #c7dbf9;
+  --color-button-primary-border-base: transparent;
+  --color-button-primary-text-base: #273333;
+  --color-button-primary-text-hover: #162020;
+  --color-button-secondary-bg-base: transparent;
+  --color-button-secondary-bg-hover: #f3f4f4;
+  --color-button-secondary-bg-active: #FFFFFF;
+  --color-button-secondary-border-base: #FFFFFF;
+  --color-button-secondary-text-base: #FFFFFF;
+  --color-button-secondary-text-hover: #364141;
+  --color-button-pill-bg-base: transparent;
+  --color-button-pill-bg-hover: #162020;
+  --color-button-pill-bg-active: #273333;
+  --color-button-pill-border-base: transparent;
+  --color-button-pill-border-hover: #FFFFFF;
+  --color-button-pill-text-base: #f3f4f4;
+  --color-button-pill-text-hover: #FFFFFF;
+  --color-button-destructive-bg-base: #ff7f6e;
+  --color-button-destructive-bg-hover: #ff9c8f;
+  --color-button-destructive-bg-active: #ffb8b1;
+  --color-button-destructive-border-base: transparent;
+  --color-button-destructive-text-base: #273333;
+  --color-button-destructive-text-hover: #162020;
+  --color-button-placeholder-bg-base: transparent;
+  --color-button-placeholder-bg-hover: #040404;
+  --color-button-placeholder-bg-active: #040404;
+  --color-button-placeholder-border-base: #929a9b;
+  --color-button-placeholder-text-base: #679eff;
+  --color-button-placeholder-text-hover: #a1c2f8;
+  --color-button-overlay-bg-base: color-mix(in srgb, #FFFFFF, transparent 40%);
+  --color-button-overlay-bg-hover: color-mix(in srgb, #FFFFFF, transparent 25%);
+  --color-button-overlay-text-base: #162020;
+  --color-button-unstyled-bg-base: transparent;
+  --color-button-unstyled-border-base: transparent;
+  --color-button-unstyled-text-base: #c8cccc;
+  --color-button-unstyled-text-hover: #dee1e1;
+  --color-button-ai-primary-bg-base: var(--color-gradient-ai);
+  --color-button-ai-primary-border-base: transparent;
+  --color-button-ai-primary-text-base: #FFFFFF;
+  --color-button-ai-primary-text-hover: #FFFFFF;
+  --color-button-ai-secondary-bg-base: var(--color-gradient-ai-subtle);
+  --color-button-ai-secondary-border-base: transparent;
+  --color-button-ai-secondary-text-base: #f3f4f4;
+  --color-button-ai-secondary-text-hover: #f3f4f4;
+  --color-button-ai-outline-bg-base: transparent;
+  --color-button-ai-outline-border-base: var(--color-gradient-ai);
+  --color-button-ai-outline-text-base: #f3f4f4;
+  --color-button-ai-outline-text-hover: #f3f4f4;
+  --color-link-base: #679eff;
+  --color-link-hover: #a1c2f8;
+  --color-text-headline: #FFFFFF;
+  --color-text-subtext: #dee1e1;
+  --color-text-body: #f3f4f4;
+  --color-text-inverse: #273333;
+  --color-text-error: #ffd5d2;
+  --color-text-bg-highlight: #944c0c;
+  --color-text-bg-selection: #1150aa;
+  --color-text-decorative-green: #d7f4d7;
+  --color-text-decorative-blue: #deebfe;
+  --color-text-decorative-purple: #eaeaf9;
+  --color-text-decorative-yellow: #fdefcd;
+  --color-text-decorative-orange: #fcdccc;
+  --color-text-decorative-red: #ffd5d2;
+  --color-text-decorative-neutral: #f3f4f4;
+  --color-text-decorative-magenta: #f9e3fc;
+  --color-text-decorative-pink: #fcdbeb;
+  --color-text-decorative-aqua: #c5f9f9;
+  --color-text-decorative-teal: #cdf7ef;
+  --color-text-ai_generated: #FFFFFF;
+  --color-icon-base: #f3f4f4;
+  --color-icon-inverse: #273333;
+  --color-icon-success: #d7f4d7;
+  --color-icon-warning: #fdefcd;
+  --color-icon-error: #ffd5d2;
+  --color-icon-danger: #ffd5d2;
+  --color-icon-info: #deebfe;
+  --color-icon-opportunity: #eaeaf9;
+  --color-icon-applied: #679eff;
+  --color-icon-positive_sentiment: #2b68d3;
+  --color-icon-negative_sentiment: #ed4c42;
+  --color-icon-neutral_sentiment: #929a9b;
+  --color-form-bg-base: #273333;
+  --color-form-bg-selected: #FFFFFF;
+  --color-form-border-base: #929a9b;
+  --color-form-border-error: #ed4c42;
+  --color-form-border-warning: #ffbc00;
+  --color-form-border-selected: #FFFFFF;
+  --color-form-placeholder-base: #929a9b;
+  --color-listItem-bg-base: transparent;
+  --color-listItem-bg-hover: #364141;
+  --color-listItem-bg-selected: #FFFFFF;
+  --color-listItem-bg-active: #FFFFFF;
+  --color-listItem-border-base: #6e797a;
+  --color-menuItem-bg-active: #515e5f;
+  --color-nav-navItem-text-base: #FFFFFF;
+  --color-nav-navItem-icon-base: #FFFFFF;
+  --color-nav-navItem-indicator-notification-base: #e0447c;
+  --color-nav-navItem-indicator-userStatus-online: #59cb59;
+  --color-nav-navItem-indicator-userStatus-offline: #ed4c42;
+  --color-nav-navItem-indicator-userStatus-unavailable: #364141;
+  --color-nav-navItem-bg-base: transparent;
+  --color-nav-navItem-bg-hover: #364141;
+  --color-nav-navItem-bg-active: #040404;
+  --color-nav-navItem-bg-selected: #515e5f;
+  --color-nav-navItem-border-hover: #515e5f;
+  --color-nav-navItem-border-active: #515e5f;
+  --color-nav-navItem-border-selected: #515e5f;
+  --color-overlay-bg-base: color-mix(in srgb, #162020, transparent 28%);
+  --color-overlay-bg-inverse: color-mix(in srgb, #040404, transparent 30%);
+  --color-overlay-text-base: #FFFFFF;
+  --color-overlay-icon-base: #FFFFFF;
+  --color-elevation-base: #040404FF;
+  --color-illustration-fill: #679eff;
+  --color-illustration-stroke: #f3f4f4;
+  --color-network-twitter: #000000;
+  --color-network-twitter_like: #e0245e;
+  --color-network-facebook: #1877F2;
+  --color-network-facebook_audience_network: #58409B;
+  --color-network-linkedin: #0A66C2;
+  --color-network-instagram: #e4405f;
+  --color-network-feedly: #2bb24c;
+  --color-network-analytics: #ef6c00;
+  --color-network-google_analytics_property: #ef6c00;
+  --color-network-youtube: #ff0000;
+  --color-network-messenger: #000000;
+  --color-network-snapchat: #fffc00;
+  --color-network-pinterest: #E60023;
+  --color-network-tumblr: #35465c;
+  --color-network-reddit: #ff4500;
+  --color-network-tripadvisor: #00B087;
+  --color-network-glassdoor: #0CAA41;
+  --color-network-google_ads: #FBBC04;
+  --color-network-google_my_business: #4285F4;
+  --color-network-google_business_messages: #1A73EA;
+  --color-network-google_play_store: #01875F;
+  --color-network-apple_app_store: #17C8F5;
+  --color-network-salesforce: #1589EE;
+  --color-network-zendesk: #03363D;
+  --color-network-hubspot: #FF7A59;
+  --color-network-microsoft_dynamics: #002050;
+  --color-network-yelp: #FF1A1A;
+  --color-network-whatsapp: #59CE72;
+  --color-network-tiktok: #000000;
+  --color-network-threads: #000000;
+  --color-network-trustpilot: #04DA8D;
+  --color-network-x: #000000;
+  --color-network-x_like: #e0245e;
+  --color-network-bluesky: #1185FE;
+  --color-network-bazaarvoice: #002E6E;
+  --color-dataviz-map-1: #24e0c5;
+  --color-dataviz-map-2: #a193f2;
+  --color-dataviz-map-3: #ff76ae;
+  --color-dataviz-map-4: #ffcd1c;
+  --color-dataviz-map-5: #679eff;
+  --color-dataviz-map-6: #f282f5;
+  --color-dataviz-map-7: #75dd66;
+  --color-dataviz-map-8: #ff9c5d;
+  --color-dataviz-map-9: #db3e3e;
+  --color-dataviz-map-10: #0b968f;
+  --color-dataviz-map-11: #6f5ed3;
+  --color-dataviz-map-12: #ce3665;
+  --color-dataviz-map-13: #ba7506;
+  --color-dataviz-map-14: #205bc3;
+  --color-dataviz-map-15: #ac44a8;
+  --color-dataviz-map-16: #0ca750;
+  --color-dataviz-map-17: #ed7024;
+  --color-dataviz-map-18: #ff7f6e;
+  --color-dataviz-map-19: #c2f2bd;
+  --color-dataviz-map-20: #ffe99a;
+  --color-dataviz-list-0: #24e0c5;
+  --color-dataviz-list-1: #a193f2;
+  --color-dataviz-list-2: #ff76ae;
+  --color-dataviz-list-3: #ffcd1c;
+  --color-dataviz-list-4: #679eff;
+  --color-dataviz-list-5: #f282f5;
+  --color-dataviz-list-6: #75dd66;
+  --color-dataviz-list-7: #ff9c5d;
+  --color-dataviz-list-8: #db3e3e;
+  --color-dataviz-list-9: #0b968f;
+  --color-dataviz-list-10: #6f5ed3;
+  --color-dataviz-list-11: #ce3665;
+  --color-dataviz-list-12: #ba7506;
+  --color-dataviz-list-13: #205bc3;
+  --color-dataviz-list-14: #ac44a8;
+  --color-dataviz-list-15: #0ca750;
+  --color-dataviz-list-16: #ed7024;
+  --color-dataviz-list-17: #ff7f6e;
+  --color-dataviz-list-18: #c2f2bd;
+  --color-dataviz-list-19: #ffe99a;
+  --color-dataviz-placeholder: #364141;
+  --color-userStatus-online: #59cb59;
+  --color-userStatus-offline: #f76054;
+  --color-userStatus-unavailable: #929a9b;
+  --color-DATAVIZ_COLORS_LIST-0: #24e0c5;
+  --color-DATAVIZ_COLORS_LIST-1: #a193f2;
+  --color-DATAVIZ_COLORS_LIST-2: #ff76ae;
+  --color-DATAVIZ_COLORS_LIST-3: #ffcd1c;
+  --color-DATAVIZ_COLORS_LIST-4: #679eff;
+  --color-DATAVIZ_COLORS_LIST-5: #f282f5;
+  --color-DATAVIZ_COLORS_LIST-6: #75dd66;
+  --color-DATAVIZ_COLORS_LIST-7: #ff9c5d;
+  --color-DATAVIZ_COLORS_LIST-8: #db3e3e;
+  --color-DATAVIZ_COLORS_LIST-9: #0b968f;
+  --color-DATAVIZ_COLORS_LIST-10: #6f5ed3;
+  --color-DATAVIZ_COLORS_LIST-11: #ce3665;
+  --color-DATAVIZ_COLORS_LIST-12: #ba7506;
+  --color-DATAVIZ_COLORS_LIST-13: #205bc3;
+  --color-DATAVIZ_COLORS_LIST-14: #ac44a8;
+  --color-DATAVIZ_COLORS_LIST-15: #0ca750;
+  --color-DATAVIZ_COLORS_LIST-16: #ed7024;
+  --color-DATAVIZ_COLORS_LIST-17: #ff7f6e;
+  --color-DATAVIZ_COLORS_LIST-18: #c2f2bd;
+  --color-DATAVIZ_COLORS_LIST-19: #ffe99a;
+  --color-DATAVIZ_COLORS_MAP-1: #24e0c5;
+  --color-DATAVIZ_COLORS_MAP-2: #a193f2;
+  --color-DATAVIZ_COLORS_MAP-3: #ff76ae;
+  --color-DATAVIZ_COLORS_MAP-4: #ffcd1c;
+  --color-DATAVIZ_COLORS_MAP-5: #679eff;
+  --color-DATAVIZ_COLORS_MAP-6: #f282f5;
+  --color-DATAVIZ_COLORS_MAP-7: #75dd66;
+  --color-DATAVIZ_COLORS_MAP-8: #ff9c5d;
+  --color-DATAVIZ_COLORS_MAP-9: #db3e3e;
+  --color-DATAVIZ_COLORS_MAP-10: #0b968f;
+  --color-DATAVIZ_COLORS_MAP-11: #6f5ed3;
+  --color-DATAVIZ_COLORS_MAP-12: #ce3665;
+  --color-DATAVIZ_COLORS_MAP-13: #ba7506;
+  --color-DATAVIZ_COLORS_MAP-14: #205bc3;
+  --color-DATAVIZ_COLORS_MAP-15: #ac44a8;
+  --color-DATAVIZ_COLORS_MAP-16: #0ca750;
+  --color-DATAVIZ_COLORS_MAP-17: #ed7024;
+  --color-DATAVIZ_COLORS_MAP-18: #ff7f6e;
+  --color-DATAVIZ_COLORS_MAP-19: #c2f2bd;
+  --color-DATAVIZ_COLORS_MAP-20: #ffe99a;
+  --color-PLACEHOLDER: #364141;
+  --color-ai-feature-decorative-primary: #067c7c;
+  --color-ai-feature-decorative-secondary: #0c3f89;
+  --color-ai-feature-bg-primary: #cdf7ef;
+  --color-ai-feature-bg-secondary: #c7dbf9;
+  --color-ai-feature-bg-default-primary: #cdf7ef;
+  --color-ai-feature-bg-default-secondary: #c7dbf9;
+  --color-ai-feature-bg-inverse-primary: #067c7c;
+  --color-ai-feature-bg-inverse-secondary: #0c3f89;
+  --color-navigation-main-bg-base: #162020;
+  --color-navigation-main-bg-overflowGradient: #040404;
+  --color-navigation-main-border-base: #040404;
+  --color-navigation-secondary-bg-base: #273333;
+  --color-navigation-secondary-widget-bg-base: #364141;
+  --color-navigation-secondary-accordion-bg-base: #162020A3;
+  --color-navigation-settings-listItem-bg-base: transparent;
+  --color-navigation-settings-listItem-bg-hover: #040404;
+  --color-navigation-settings-listItem-bg-selected: #364141;
+  --color-navigation-text-base: #FFFFFF;
+  --color-navigation-text-hover: #FFFFFF;
+  --color-navigation-icon-base: #FFFFFF;
+  --color-navigation-icon-hover: #FFFFFF;
+  --color-navigation-listItem-bg-base: #162020;
+  --color-navigation-listItem-bg-hover: #040404;
+  --color-navigation-listItem-bg-selected: #515e5f;
+  --color-datePicker-comparison-bg-base: #b0b6b7;
+  --color-datePicker-comparison-text-base: #364141;
+  --color-analytics-trend-positive: #08c4b2;
+  --color-analytics-trend-neutral: #f3f4f4;
+  --color-analytics-trend-negative: #f3f4f4;
+  --color-analytics-overlay-bg-base: color-mix(in srgb, #273333, transparent 20%);
+  --color-listening-chart-indicator-default-primary: #f3f4f4;
+  --color-listening-chart-indicator-default-secondary: #273333;
+  --color-listening-chart-indicator-hover-primary: #c8cccc;
+  --color-listening-chart-indicator-hover-secondary: #FFFFFF;
+  --color-listening-chart-spike-bg-base: #08c4b2;
+  --color-listening-chart-spike-icon-base: #FFFFFF;
+  --color-listening-topicTypes-customTopic: #24e0c5;
+  --color-listening-topicTypes-brandHealth: #ff7f6e;
+  --color-listening-topicTypes-industryInsights: #75dd66;
+  --color-listening-topicTypes-competitiveAnalysis: #ffd943;
+  --color-listening-topicTypes-campaignAnalysis: #f282f5;
+  --color-listening-topicTypes-eventMonitoring: #33d6e2;
+  --color-listening-topicTypes-featuredTopic: #75dd66;
+  --color-listening-worldMap-empty: #dee1e1;
+  --color-listening-worldMap-q0: #d8d7f9;
+  --color-listening-worldMap-q1: #c1c1f7;
+  --color-listening-worldMap-q2: #a193f2;
+  --color-listening-worldMap-q3: #9180f4;
+  --color-listening-worldMap-q4: #816fea;
+  --color-listening-worldMap-q5: #6f5ed3;
+  --color-listening-worldMap-q6: #5e4eba;
+  --color-listening-worldMap-q7: #483a9c;
+  --color-growth-carousel-indicator-active: #2b68d3;
+  --color-growth-carousel-indicator-inactive: #c8cccc;
+  --color-growth-education-decorative-aqua: #0797ae;
+  --color-growth-education-decorative-teal: #08c4b2;
+  --color-growth-opportunity-bg-base: #6f5ed3;
+  --color-growth-opportunity-bg-secondary: #515e5f;
+  --color-growth-opportunity-bg-hover: #9180f4;
+  --color-growth-opportunity-button-primary-base: #a193f2;
+  --color-growth-opportunity-button-primary-hover: #c1c1f7;
+  --color-growth-opportunity-badge-bg-base: #6f5ed3;
+  --color-growth-opportunity-badge-bg-active: #eaeaf9;
+  --color-growth-opportunity-badge-icon-base: #d8d7f9;
+  --color-growth-opportunity-badge-icon-active: #5e4eba;
+  --color-growth-opportunity-badge-text-base: #d8d7f9;
+  --color-growth-opportunity-decorative-green: #0ca750;
+  --color-growth-opportunity-decorative-lightAqua: #0797ae;
+  --color-growth-opportunity-decorative-darkAqua: #002838;
+  --color-growth-opportunity-decorative-purple: #6f5ed3;
+  --color-growth-featuredDemo-bg-primary-base: #679eff;
+  --color-growth-featuredDemo-bg-primary-hover: #deebfe;
+  --color-growth-featuredDemo-bg-secondary-base: #9180f4;
+  --color-growth-featuredDemo-bg-secondary-hover: #eaeaf9;
+  --color-growth-darkModal-bg-base: #002838;
+  --color-growth-darkModal-text-base: #FFFFFF;
+  --color-growth-darkModal-cards-bg-base: #FFFFFF;
+  --color-growth-darkModal-cards-bg-hover: #eaeaf9;
+  --color-growth-darkModal-cards-text-base: #364141;
+  --color-growth-darkModal-cards-text-hover: #273333;
+  --color-growth-darkModal-cards-border-base: #FFFFFF;
+  --color-growth-darkModal-cards-border-hover: #6f5ed3;
+  --color-growth-user-status-online: #0ca750;
+  --color-cardControl-bg-base: #273333;
+  --color-cardControl-bg-selected: #515e5f;
+  --color-cardControl-bg-hover: #364141;
+  --color-cardControl-text-selected: #f3f4f4;
+  --color-tags-collections-bg-base: #364141;
+  --space-0: 0px;
+  --space-100: 2px;
+  --space-200: 4px;
+  --space-300: 8px;
+  --space-350: 12px;
+  --space-400: 16px;
+  --space-450: 24px;
+  --space-500: 32px;
+  --space-600: 40px;
+  --font-size-100: 11px;
+  --font-size-200: 13px;
+  --font-size-300: 16px;
+  --font-size-400: 18px;
+  --font-size-500: 21px;
+  --font-size-600: 24px;
+  --font-size-700: 32px;
+  --font-size-800: 43px;
+  --font-size-900: 57px;
+  --font-size-1000: 76px;
+  --font-size-1100: 101px;
+  --font-size-1200: 135px;
+  --line-height-100: 18.666666666666668px;
+  --line-height-200: 21.333333333333332px;
+  --line-height-300: 24px;
+  --line-height-400: 26.666666666666668px;
+  --line-height-500: 29.333333333333332px;
+  --line-height-600: 32px;
+  --line-height-700: 40px;
+  --line-height-800: 50.666666666666664px;
+  --line-height-900: 64px;
+  --line-height-1000: 80px;
+  --line-height-1100: 101.33333333333333px;
+  --line-height-1200: 125.33333333333333px;
+  --font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+  --font-weight-normal: 400;
+  --font-weight-semibold: 600;
+  --font-weight-bold: 700;
+  --font-weight-extrabold: 800;
+  --radius-400: 4px;
+  --radius-500: 6px;
+  --radius-600: 8px;
+  --radius-800: 12px;
+  --radius-900: 24px;
+  --radius-1000: 999999px;
+  --radius-inner: 6px;
+  --radius-outer: 8px;
+  --radius-pill: 999999px;
+  --border-width-500: 1px;
+  --border-width-600: 2px;
+  --border-width-700: 3px;
+  --shadow-low: 0px 2px 4px var(--color-elevation-base);
+  --shadow-medium: 0px 8px 16px var(--color-elevation-base);
+  --shadow-high: 0px 16px 32px var(--color-elevation-base);
+  --ease-ease_in: cubic-bezier(.4, 0, .7, .2);
+  --ease-ease_out: cubic-bezier(0, 0, .2, 1);
+  --ease-ease_inout: cubic-bezier(.4, 0, .2, 1);
+  --duration-fast: .15s;
+  --duration-medium: .3s;
+  --duration-slow: .6s;
+}