@accelint/design-toolkit 7.0.0 → 8.0.0

package/dist/tokens/themes.css

@@ -1,882 +0,0 @@
-/*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-/*
-  This file is generated by the generate-tokens.mjs script.
-  Do not edit this file manually.
- */
-
-@import './tokens.css';
-
-@theme {
-  /* Remove the default Tailwind styles. */
-  --color-* : initial;
-  --font-* : initial;
-  --radius-* : initial;
-  --shadow-* : initial;
-  --spacing-* : initial;
-  --text-* : initial;
-}
-
-@layer theme {
-  :root {
-    /** Static tokens (same values regardless of theme) **/
-        --classification-missing: var(--primitive-classification-missing, #0b0b0b);
-    --classification-unclass: var(--primitive-classification-unclass, #007A33);
-    --classification-cui: var(--primitive-classification-cui, #502b85);
-    --classification-confidential: var(--primitive-classification-confidential, #0033a0);
-    --classification-secret: var(--primitive-classification-secret, #c8102e);
-    --classification-top-secret: var(--primitive-classification-top-secret, #ff8c00);
-    --classification-ts-sci: var(--primitive-classification-ts-sci, #fce83a);
-    --roe-pending: var(--primitive-roe-id-pending, #404040);
-    --roe-friend: var(--primitive-roe-id-friend, #1484f4);
-    --roe-assumed-friend: var(--primitive-roe-id-assumed-friend, #0e8f37);
-    --roe-neutral: var(--primitive-roe-id-neutral, #5b137a);
-    --roe-unknown: var(--primitive-roe-id-unknown, #edda0a);
-    --roe-suspect: var(--primitive-roe-id-suspect, #ffad38);
-    --roe-hostile: var(--primitive-roe-id-hostile, #ff0033);
-    --roe-no-statement: var(--primitive-roe-id-pending, #404040);
-
-    /** Dark theme **/
-    @variant dark {
-          --bg-surface-default: var(--primitive-neutral-900, #151517);
-    --bg-surface-raised: var(--primitive-neutral-800, #212223);
-    --bg-surface-overlay: var(--primitive-neutral-800, #212223);
-    --bg-surface-muted: var(--primitive-alpha-white-100, rgba(255, 255, 255, 0.08));
-    --bg-interactive-bold: var(--primitive-neutral-50, #ffffff);
-    --bg-interactive-bold-hover: var(--primitive-neutral-100, #eff1f2);
-    --bg-interactive-bold-pressed: var(--primitive-neutral-300, #c3c5c7);
-    --bg-interactive-muted: var(--primitive-neutral-700, #38393A);
-    --bg-interactive-muted-hover: var(--primitive-neutral-600, #414245);
-    --bg-interactive-muted-pressed: var(--primitive-neutral-950, #000000);
-    --bg-interactive-disabled: var(--primitive-neutral-700, #38393A);
-    --bg-accent-primary-bold: var(--primitive-accent-primary-700, #004f7e);
-    --bg-accent-primary-hover: var(--primitive-accent-primary-600, #0068a1);
-    --bg-accent-primary-pressed: var(--primitive-accent-primary-800, #002C52);
-    --bg-accent-primary-muted: var(--primitive-accent-primary-800, #002C52);
-    --bg-info-bold: var(--primitive-utility-info-500, #565759);
-    --bg-info-hover: var(--primitive-utility-info-400, #888a8f);
-    --bg-info-pressed: var(--primitive-utility-info-600, #414245);
-    --bg-info-muted: var(--primitive-utility-info-800, #212223);
-    --bg-advisory-bold: var(--primitive-utility-advisory-600, #3c67a0);
-    --bg-advisory-hover: var(--primitive-utility-advisory-500, #4e88da);
-    --bg-advisory-pressed: var(--primitive-utility-advisory-700, #264062);
-    --bg-advisory-muted: var(--primitive-utility-advisory-900, #0e1825);
-    --bg-normal-bold: var(--primitive-utility-normal-600, #1c7e23);
-    --bg-normal-hover: var(--primitive-utility-normal-500, #26a12e);
-    --bg-normal-pressed: var(--primitive-utility-normal-700, #145718);
-    --bg-normal-muted: var(--primitive-utility-normal-900, #08210a);
-    --bg-serious-bold: var(--primitive-utility-serious-600, #bb7a00);
-    --bg-serious-hover: var(--primitive-utility-serious-500, #E69600);
-    --bg-serious-pressed: var(--primitive-utility-serious-800, #634101);
-    --bg-serious-muted: var(--primitive-utility-serious-900, #412B00);
-    --bg-critical-bold: var(--primitive-utility-critical-700, #790501);
-    --bg-critical-hover: var(--primitive-utility-critical-600, #a10701);
-    --bg-critical-pressed: var(--primitive-utility-critical-800, #540300);
-    --bg-critical-muted: var(--primitive-utility-critical-900, #290200);
-    --fg-hover: var(--primitive-neutral-50, #ffffff);
-    --fg-pressed: var(--primitive-neutral-400, #888a8f);
-    --fg-primary-bold: var(--primitive-neutral-50, #ffffff);
-    --fg-primary-muted: var(--primitive-neutral-300, #c3c5c7);
-    --fg-inverse-bold: var(--primitive-neutral-800, #212223);
-    --fg-inverse-muted: var(--primitive-neutral-400, #888a8f);
-    --fg-disabled: var(--primitive-neutral-500, #565759);
-    --fg-accent-primary-bold: var(--primitive-accent-primary-300, #39b7fa);
-    --fg-accent-primary-hover: var(--primitive-accent-primary-200, #6ed1ff);
-    --fg-accent-primary-pressed: var(--primitive-accent-primary-600, #0068a1);
-    --fg-info-bold: var(--primitive-utility-info-400, #888a8f);
-    --fg-info-hover: var(--primitive-utility-info-200, #E1E1E1);
-    --fg-info-pressed: var(--primitive-utility-info-600, #414245);
-    --fg-advisory-bold: var(--primitive-utility-advisory-400, #62a6ff);
-    --fg-advisory-hover: var(--primitive-utility-advisory-200, #a9ceff);
-    --fg-advisory-pressed: var(--primitive-utility-advisory-600, #3c67a0);
-    --fg-normal-bold: var(--primitive-utility-normal-400, #2bbf35);
-    --fg-normal-hover: var(--primitive-utility-normal-200, #86e98c);
-    --fg-normal-pressed: var(--primitive-utility-normal-600, #1c7e23);
-    --fg-serious-bold: var(--primitive-utility-serious-500, #E69600);
-    --fg-serious-hover: var(--primitive-utility-serious-300, #ffc14c);
-    --fg-serious-pressed: var(--primitive-utility-serious-600, #bb7a00);
-    --fg-critical-bold: var(--primitive-utility-critical-400, #ff2e27);
-    --fg-critical-hover: var(--primitive-utility-critical-300, #ff6d68);
-    --fg-critical-pressed: var(--primitive-utility-critical-600, #a10701);
-    --fg-a11y-on-accent: var(--primitive-neutral-50, #ffffff);
-    --fg-a11y-on-utility: var(--primitive-neutral-50, #ffffff);
-    --outline-static: var(--primitive-neutral-600, #414245);
-    --outline-interactive: var(--primitive-neutral-600, #414245);
-    --outline-interactive-hover: var(--primitive-neutral-400, #888a8f);
-    --outline-interactive-pressed: var(--primitive-neutral-700, #38393A);
-    --outline-interactive-disabled: var(--primitive-neutral-700, #38393A);
-    --outline-accent-primary-bold: var(--primitive-accent-primary-300, #39b7fa);
-    --outline-accent-primary-hover: var(--primitive-accent-primary-200, #6ed1ff);
-    --outline-accent-primary-pressed: var(--primitive-accent-primary-600, #0068a1);
-    --outline-info-bold: var(--primitive-utility-info-400, #888a8f);
-    --outline-info-hover: var(--primitive-utility-info-200, #E1E1E1);
-    --outline-info-pressed: var(--primitive-utility-info-600, #414245);
-    --outline-advisory-bold: var(--primitive-utility-advisory-400, #62a6ff);
-    --outline-advisory-hover: var(--primitive-utility-advisory-200, #a9ceff);
-    --outline-advisory-pressed: var(--primitive-utility-advisory-600, #3c67a0);
-    --outline-normal-bold: var(--primitive-utility-normal-400, #2bbf35);
-    --outline-normal-hover: var(--primitive-utility-normal-200, #86e98c);
-    --outline-normal-pressed: var(--primitive-utility-normal-600, #1c7e23);
-    --outline-serious-bold: var(--primitive-utility-serious-500, #E69600);
-    --outline-serious-hover: var(--primitive-utility-serious-200, #ffd382);
-    --outline-serious-pressed: var(--primitive-utility-serious-700, #8e5d00);
-    --outline-critical-bold: var(--primitive-utility-critical-400, #ff2e27);
-    --outline-critical-hover: var(--primitive-utility-critical-300, #ff6d68);
-    --outline-critical-pressed: var(--primitive-utility-critical-600, #a10701);
-    --outline-mono-bold: var(--primitive-neutral-50, #ffffff);
-    --outline-mono-bold-hover: var(--primitive-neutral-100, #eff1f2);
-    --outline-mono-bold-pressed: var(--primitive-neutral-300, #c3c5c7);
-    --shadow-elevation-raised: var(--shadow-elevation-raised-bold, 0 1px 4px 0 rgba(0 0 0 / 0.80));
-    --shadow-elevation-overlay: var(--shadow-elevation-overlay-bold, 0 8px 24px 0 rgba(0 0 0 / 0.80));
-    }
-
-    /** Light theme **/
-    @variant light {
-          --bg-surface-default: var(--primitive-neutral-100, #eff1f2);
-    --bg-surface-raised: var(--primitive-neutral-50, #ffffff);
-    --bg-surface-overlay: var(--primitive-neutral-50, #ffffff);
-    --bg-surface-muted: var(--primitive-alpha-black-100, rgba(0, 0, 0, 0.08));
-    --bg-interactive-bold: var(--primitive-neutral-900, #151517);
-    --bg-interactive-bold-hover: var(--primitive-neutral-800, #212223);
-    --bg-interactive-bold-pressed: var(--primitive-neutral-300, #c3c5c7);
-    --bg-interactive-muted: var(--primitive-neutral-300, #c3c5c7);
-    --bg-interactive-muted-hover: var(--primitive-neutral-200, #e1e1e1);
-    --bg-interactive-muted-pressed: var(--primitive-neutral-400, #888a8f);
-    --bg-interactive-disabled: var(--primitive-neutral-200, #e1e1e1);
-    --bg-accent-primary-bold: var(--primitive-accent-primary-700, #004f7e);
-    --bg-accent-primary-hover: var(--primitive-accent-primary-600, #0068a1);
-    --bg-accent-primary-pressed: var(--primitive-accent-primary-800, #002C52);
-    --bg-accent-primary-muted: var(--primitive-accent-primary-100, #b1e9ff);
-    --bg-info-bold: var(--primitive-utility-info-400, #888a8f);
-    --bg-info-hover: var(--primitive-utility-info-300, #c3c5c7);
-    --bg-info-pressed: var(--primitive-utility-info-600, #414245);
-    --bg-info-muted: var(--primitive-utility-info-100, #eff1f2);
-    --bg-advisory-bold: var(--primitive-utility-advisory-600, #3c67a0);
-    --bg-advisory-hover: var(--primitive-utility-advisory-500, #4e88da);
-    --bg-advisory-pressed: var(--primitive-utility-advisory-700, #264062);
-    --bg-advisory-muted: var(--primitive-utility-advisory-100, #c4deff);
-    --bg-normal-bold: var(--primitive-utility-normal-600, #1c7e23);
-    --bg-normal-hover: var(--primitive-utility-normal-500, #26a12e);
-    --bg-normal-pressed: var(--primitive-utility-normal-700, #145718);
-    --bg-normal-muted: var(--primitive-utility-normal-100, #c2f5c5);
-    --bg-serious-bold: var(--primitive-utility-serious-600, #bb7a00);
-    --bg-serious-hover: var(--primitive-utility-serious-500, #E69600);
-    --bg-serious-pressed: var(--primitive-utility-serious-800, #634101);
-    --bg-serious-muted: var(--primitive-utility-serious-100, #ffeac2);
-    --bg-critical-bold: var(--primitive-utility-critical-700, #790501);
-    --bg-critical-hover: var(--primitive-utility-critical-600, #a10701);
-    --bg-critical-pressed: var(--primitive-utility-critical-800, #540300);
-    --bg-critical-muted: var(--primitive-utility-critical-100, #ffc4c2);
-    --fg-hover: var(--primitive-neutral-800, #212223);
-    --fg-pressed: var(--primitive-neutral-500, #565759);
-    --fg-primary-bold: var(--primitive-neutral-800, #212223);
-    --fg-primary-muted: var(--primitive-neutral-500, #565759);
-    --fg-inverse-bold: var(--primitive-neutral-50, #ffffff);
-    --fg-inverse-muted: var(--primitive-neutral-400, #888a8f);
-    --fg-disabled: var(--primitive-neutral-300, #c3c5c7);
-    --fg-accent-primary-bold: var(--primitive-accent-primary-300, #39b7fa);
-    --fg-accent-primary-hover: var(--primitive-accent-primary-700, #004f7e);
-    --fg-accent-primary-pressed: var(--primitive-accent-primary-600, #0068a1);
-    --fg-info-bold: var(--primitive-utility-info-600, #414245);
-    --fg-info-hover: var(--primitive-utility-info-700, #38393A);
-    --fg-info-pressed: var(--primitive-utility-info-500, #565759);
-    --fg-advisory-bold: var(--primitive-utility-advisory-400, #62a6ff);
-    --fg-advisory-hover: var(--primitive-utility-advisory-600, #3c67a0);
-    --fg-advisory-pressed: var(--primitive-utility-advisory-500, #4e88da);
-    --fg-normal-bold: var(--primitive-utility-normal-400, #2bbf35);
-    --fg-normal-hover: var(--primitive-utility-normal-600, #1c7e23);
-    --fg-normal-pressed: var(--primitive-utility-normal-500, #26a12e);
-    --fg-serious-bold: var(--primitive-utility-serious-600, #bb7a00);
-    --fg-serious-hover: var(--primitive-utility-serious-700, #8e5d00);
-    --fg-serious-pressed: var(--primitive-utility-serious-600, #bb7a00);
-    --fg-critical-bold: var(--primitive-utility-critical-400, #ff2e27);
-    --fg-critical-hover: var(--primitive-utility-critical-600, #a10701);
-    --fg-critical-pressed: var(--primitive-utility-critical-500, #d40b04);
-    --fg-a11y-on-accent: var(--primitive-neutral-50, #ffffff);
-    --fg-a11y-on-utility: var(--primitive-neutral-50, #ffffff);
-    --outline-static: var(--primitive-neutral-300, #c3c5c7);
-    --outline-interactive: var(--primitive-neutral-300, #c3c5c7);
-    --outline-interactive-hover: var(--primitive-neutral-400, #888a8f);
-    --outline-interactive-pressed: var(--primitive-neutral-200, #e1e1e1);
-    --outline-interactive-disabled: var(--primitive-neutral-200, #e1e1e1);
-    --outline-accent-primary-bold: var(--primitive-accent-primary-300, #39b7fa);
-    --outline-accent-primary-hover: var(--primitive-accent-primary-600, #0068a1);
-    --outline-accent-primary-pressed: var(--primitive-accent-primary-200, #6ed1ff);
-    --outline-info-bold: var(--primitive-utility-info-400, #888a8f);
-    --outline-info-hover: var(--primitive-utility-info-600, #414245);
-    --outline-info-pressed: var(--primitive-utility-info-500, #565759);
-    --outline-advisory-bold: var(--primitive-utility-advisory-400, #62a6ff);
-    --outline-advisory-hover: var(--primitive-utility-advisory-600, #3c67a0);
-    --outline-advisory-pressed: var(--primitive-utility-advisory-500, #4e88da);
-    --outline-normal-bold: var(--primitive-utility-normal-400, #2bbf35);
-    --outline-normal-hover: var(--primitive-utility-normal-600, #1c7e23);
-    --outline-normal-pressed: var(--primitive-utility-normal-500, #26a12e);
-    --outline-serious-bold: var(--primitive-utility-serious-600, #bb7a00);
-    --outline-serious-hover: var(--primitive-utility-serious-700, #8e5d00);
-    --outline-serious-pressed: var(--primitive-utility-serious-500, #E69600);
-    --outline-critical-bold: var(--primitive-utility-critical-400, #ff2e27);
-    --outline-critical-hover: var(--primitive-utility-critical-600, #a10701);
-    --outline-critical-pressed: var(--primitive-utility-critical-500, #d40b04);
-    --outline-mono-bold: var(--primitive-neutral-900, #151517);
-    --outline-mono-bold-hover: var(--primitive-neutral-700, #38393A);
-    --outline-mono-bold-pressed: var(--primitive-neutral-600, #414245);
-    --shadow-elevation-raised: var(--shadow-elevation-raised-muted, 0 1px 4px 0 rgba(0 0 0 / 0.16));
-    --shadow-elevation-overlay: var(--shadow-elevation-overlay-muted, 0 8px 24px 0 rgba(0 0 0 / 0.16));
-    }
-  }
-}
-
-@theme {
-  /** Typography **/
-  --typography-header-xxl-size: var(--typography-header-xxl-size, 32px);
-  --typography-header-xxl-height: var(--typography-header-xxl-height, 40px);
-  --typography-header-xxl-spacing: var(--typography-header-xxl-spacing, 0px);
-  --typography-header-xl-size: var(--typography-header-xl-size, 24px);
-  --typography-header-xl-height: var(--typography-header-xl-height, 28px);
-  --typography-header-xl-spacing: var(--typography-header-xl-spacing, 0.18px);
-  --typography-header-l-size: var(--typography-header-l-size, 20px);
-  --typography-header-l-height: var(--typography-header-l-height, 24px);
-  --typography-header-l-spacing: var(--typography-header-l-spacing, 0.18px);
-  --typography-header-m-size: var(--typography-header-m-size, 14px);
-  --typography-header-m-height: var(--typography-header-m-height, 20px);
-  --typography-header-m-spacing: var(--typography-header-m-spacing, 0.25px);
-  --typography-header-s-size: var(--typography-header-s-size, 12px);
-  --typography-header-s-height: var(--typography-header-s-height, 16px);
-  --typography-header-s-spacing: var(--typography-header-s-spacing, 0.4px);
-  --typography-header-xs-size: var(--typography-header-xs-size, 10px);
-  --typography-header-xs-height: var(--typography-header-xs-height, 12px);
-  --typography-header-xs-spacing: var(--typography-header-xs-spacing, 0.25px);
-  --typography-body-l-size: var(--typography-body-l-size, 16px);
-  --typography-body-l-height: var(--typography-body-l-height, 24px);
-  --typography-body-l-spacing: var(--typography-body-l-spacing, 0.5px);
-  --typography-body-m-size: var(--typography-body-m-size, 14px);
-  --typography-body-m-height: var(--typography-body-m-height, 20px);
-  --typography-body-m-spacing: var(--typography-body-m-spacing, 0.25px);
-  --typography-body-s-size: var(--typography-body-s-size, 12px);
-  --typography-body-s-height: var(--typography-body-s-height, 16px);
-  --typography-body-s-spacing: var(--typography-body-s-spacing, 0.4px);
-  --typography-body-xs-size: var(--typography-body-xs-size, 10px);
-  --typography-body-xs-height: var(--typography-body-xs-height, 12px);
-  --typography-body-xs-spacing: var(--typography-body-xs-spacing, 0.5px);
-  --typography-body-xxs-size: var(--typography-body-xxs-size, 9px);
-  --typography-body-xxs-height: var(--typography-body-xxs-height, 12px);
-  --typography-body-xxs-spacing: var(--typography-body-xxs-spacing, 0.25px);
-  --typography-button-l-size: var(--typography-button-l-size, 16px);
-  --typography-button-l-height: var(--typography-button-l-height, 24px);
-  --typography-button-l-spacing: var(--typography-button-l-spacing, 0.5px);
-  --typography-button-m-size: var(--typography-button-m-size, 14px);
-  --typography-button-m-height: var(--typography-button-m-height, 20px);
-  --typography-button-m-spacing: var(--typography-button-m-spacing, 0.25px);
-  --typography-button-s-size: var(--typography-button-s-size, 12px);
-  --typography-button-s-height: var(--typography-button-s-height, 16px);
-  --typography-button-s-spacing: var(--typography-button-s-spacing, 0.4px);
-  --typography-button-xs-size: var(--typography-button-xs-size, 10px);
-  --typography-button-xs-height: var(--typography-button-xs-height, 12px);
-  --typography-button-xs-spacing: var(--typography-button-xs-spacing, 0.5px);
-}
-
-@theme {
-  /** Spacing **/
-  --spacing-0: var(--spacing-0, 0px);
-  --spacing-none: var(--spacing-none, unset);
-  --spacing-xxs: var(--spacing-xxs, 2px);
-  --spacing-xs: var(--spacing-xs, 4px);
-  --spacing-s: var(--spacing-s, 8px);
-  --spacing-m: var(--spacing-m, 12px);
-  --spacing-l: var(--spacing-l, 16px);
-  --spacing-xl: var(--spacing-xl, 24px);
-  --spacing-xxl: var(--spacing-xxl, 40px);
-  --spacing-oversized: var(--spacing-oversized, 80px);
-}
-
-@theme {
-  /** Radius **/
-  --radius-none: var(--radius-none, 0px);
-  --radius-small: var(--radius-small, 2px);
-  --radius-medium: var(--radius-medium, 4px);
-  --radius-large: var(--radius-large, 8px);
-  --radius-round: var(--radius-round, 80px);
-}
-
-@theme {
-  /** Shadow **/
-  --shadow-elevation-default: var(--shadow-elevation-default);
-  --shadow-elevation-overlay-bold: var(--shadow-elevation-overlay-bold, 0 8px 24px 0 rgba(0 0 0 / 0.80));
-  --shadow-elevation-overlay-muted: var(--shadow-elevation-overlay-muted, 0 8px 24px 0 rgba(0 0 0 / 0.16));
-  --shadow-elevation-raised-bold: var(--shadow-elevation-raised-bold, 0 1px 4px 0 rgba(0 0 0 / 0.80));
-  --shadow-elevation-raised-muted: var(--shadow-elevation-raised-muted, 0 1px 4px 0 rgba(0 0 0 / 0.16));
-}
-
-@theme {
-  /** Font **/
-  --font-primary: var(--font-primary);
-  --font-display: var(--font-display);
-}
-
-@theme {
-  /** Icon **/
-  --icon-size-l: var(--icon-size-l);
-  --icon-size-m: var(--icon-size-m);
-  --icon-size-s: var(--icon-size-s);
-  --icon-size-xs: var(--icon-size-xs);
-}
-@utility bg-classification-missing {
-  background-color: var(--classification-missing);
-}
-@utility fg-classification-missing {
-  color: var(--classification-missing);
-  --icon-color: var(--classification-missing);
-}
-@utility outline-classification-missing {
-  outline-color: var(--classification-missing);
-}
-
-@utility bg-classification-unclass {
-  background-color: var(--classification-unclass);
-}
-@utility fg-classification-unclass {
-  color: var(--classification-unclass);
-  --icon-color: var(--classification-unclass);
-}
-@utility outline-classification-unclass {
-  outline-color: var(--classification-unclass);
-}
-
-@utility bg-classification-cui {
-  background-color: var(--classification-cui);
-}
-@utility fg-classification-cui {
-  color: var(--classification-cui);
-  --icon-color: var(--classification-cui);
-}
-@utility outline-classification-cui {
-  outline-color: var(--classification-cui);
-}
-
-@utility bg-classification-confidential {
-  background-color: var(--classification-confidential);
-}
-@utility fg-classification-confidential {
-  color: var(--classification-confidential);
-  --icon-color: var(--classification-confidential);
-}
-@utility outline-classification-confidential {
-  outline-color: var(--classification-confidential);
-}
-
-@utility bg-classification-secret {
-  background-color: var(--classification-secret);
-}
-@utility fg-classification-secret {
-  color: var(--classification-secret);
-  --icon-color: var(--classification-secret);
-}
-@utility outline-classification-secret {
-  outline-color: var(--classification-secret);
-}
-
-@utility bg-classification-top-secret {
-  background-color: var(--classification-top-secret);
-}
-@utility fg-classification-top-secret {
-  color: var(--classification-top-secret);
-  --icon-color: var(--classification-top-secret);
-}
-@utility outline-classification-top-secret {
-  outline-color: var(--classification-top-secret);
-}
-
-@utility bg-classification-ts-sci {
-  background-color: var(--classification-ts-sci);
-}
-@utility fg-classification-ts-sci {
-  color: var(--classification-ts-sci);
-  --icon-color: var(--classification-ts-sci);
-}
-@utility outline-classification-ts-sci {
-  outline-color: var(--classification-ts-sci);
-}
-
-@utility bg-roe-pending {
-  background-color: var(--roe-pending);
-}
-@utility fg-roe-pending {
-  color: var(--roe-pending);
-  --icon-color: var(--roe-pending);
-}
-@utility outline-roe-pending {
-  outline-color: var(--roe-pending);
-}
-
-@utility bg-roe-friend {
-  background-color: var(--roe-friend);
-}
-@utility fg-roe-friend {
-  color: var(--roe-friend);
-  --icon-color: var(--roe-friend);
-}
-@utility outline-roe-friend {
-  outline-color: var(--roe-friend);
-}
-
-@utility bg-roe-assumed-friend {
-  background-color: var(--roe-assumed-friend);
-}
-@utility fg-roe-assumed-friend {
-  color: var(--roe-assumed-friend);
-  --icon-color: var(--roe-assumed-friend);
-}
-@utility outline-roe-assumed-friend {
-  outline-color: var(--roe-assumed-friend);
-}
-
-@utility bg-roe-neutral {
-  background-color: var(--roe-neutral);
-}
-@utility fg-roe-neutral {
-  color: var(--roe-neutral);
-  --icon-color: var(--roe-neutral);
-}
-@utility outline-roe-neutral {
-  outline-color: var(--roe-neutral);
-}
-
-@utility bg-roe-unknown {
-  background-color: var(--roe-unknown);
-}
-@utility fg-roe-unknown {
-  color: var(--roe-unknown);
-  --icon-color: var(--roe-unknown);
-}
-@utility outline-roe-unknown {
-  outline-color: var(--roe-unknown);
-}
-
-@utility bg-roe-suspect {
-  background-color: var(--roe-suspect);
-}
-@utility fg-roe-suspect {
-  color: var(--roe-suspect);
-  --icon-color: var(--roe-suspect);
-}
-@utility outline-roe-suspect {
-  outline-color: var(--roe-suspect);
-}
-
-@utility bg-roe-hostile {
-  background-color: var(--roe-hostile);
-}
-@utility fg-roe-hostile {
-  color: var(--roe-hostile);
-  --icon-color: var(--roe-hostile);
-}
-@utility outline-roe-hostile {
-  outline-color: var(--roe-hostile);
-}
-
-@utility bg-roe-no-statement {
-  background-color: var(--roe-no-statement);
-}
-@utility fg-roe-no-statement {
-  color: var(--roe-no-statement);
-  --icon-color: var(--roe-no-statement);
-}
-@utility outline-roe-no-statement {
-  outline-color: var(--roe-no-statement);
-}
-@utility bg-surface-default {
- background-color: var(--bg-surface-default); 
-}
-
-@utility bg-surface-raised {
- background-color: var(--bg-surface-raised); 
-}
-
-@utility bg-surface-overlay {
- background-color: var(--bg-surface-overlay); 
-}
-
-@utility bg-surface-muted {
- background-color: var(--bg-surface-muted); 
-}
-
-@utility bg-interactive-bold {
- background-color: var(--bg-interactive-bold); 
-}
-
-@utility bg-interactive-bold-hover {
- background-color: var(--bg-interactive-bold-hover); 
-}
-
-@utility bg-interactive-bold-pressed {
- background-color: var(--bg-interactive-bold-pressed); 
-}
-
-@utility bg-interactive-muted {
- background-color: var(--bg-interactive-muted); 
-}
-
-@utility bg-interactive-muted-hover {
- background-color: var(--bg-interactive-muted-hover); 
-}
-
-@utility bg-interactive-muted-pressed {
- background-color: var(--bg-interactive-muted-pressed); 
-}
-
-@utility bg-interactive-disabled {
- background-color: var(--bg-interactive-disabled); 
-}
-
-@utility bg-accent-primary-bold {
- background-color: var(--bg-accent-primary-bold); 
-}
-
-@utility bg-accent-primary-hover {
- background-color: var(--bg-accent-primary-hover); 
-}
-
-@utility bg-accent-primary-pressed {
- background-color: var(--bg-accent-primary-pressed); 
-}
-
-@utility bg-accent-primary-muted {
- background-color: var(--bg-accent-primary-muted); 
-}
-
-@utility bg-info-bold {
- background-color: var(--bg-info-bold); 
-}
-
-@utility bg-info-hover {
- background-color: var(--bg-info-hover); 
-}
-
-@utility bg-info-pressed {
- background-color: var(--bg-info-pressed); 
-}
-
-@utility bg-info-muted {
- background-color: var(--bg-info-muted); 
-}
-
-@utility bg-advisory-bold {
- background-color: var(--bg-advisory-bold); 
-}
-
-@utility bg-advisory-hover {
- background-color: var(--bg-advisory-hover); 
-}
-
-@utility bg-advisory-pressed {
- background-color: var(--bg-advisory-pressed); 
-}
-
-@utility bg-advisory-muted {
- background-color: var(--bg-advisory-muted); 
-}
-
-@utility bg-normal-bold {
- background-color: var(--bg-normal-bold); 
-}
-
-@utility bg-normal-hover {
- background-color: var(--bg-normal-hover); 
-}
-
-@utility bg-normal-pressed {
- background-color: var(--bg-normal-pressed); 
-}
-
-@utility bg-normal-muted {
- background-color: var(--bg-normal-muted); 
-}
-
-@utility bg-serious-bold {
- background-color: var(--bg-serious-bold); 
-}
-
-@utility bg-serious-hover {
- background-color: var(--bg-serious-hover); 
-}
-
-@utility bg-serious-pressed {
- background-color: var(--bg-serious-pressed); 
-}
-
-@utility bg-serious-muted {
- background-color: var(--bg-serious-muted); 
-}
-
-@utility bg-critical-bold {
- background-color: var(--bg-critical-bold); 
-}
-
-@utility bg-critical-hover {
- background-color: var(--bg-critical-hover); 
-}
-
-@utility bg-critical-pressed {
- background-color: var(--bg-critical-pressed); 
-}
-
-@utility bg-critical-muted {
- background-color: var(--bg-critical-muted); 
-}
-
-@utility fg-hover {
- color: var(--fg-hover);
---icon-color: var(--fg-hover); 
-}
-
-@utility fg-pressed {
- color: var(--fg-pressed);
---icon-color: var(--fg-pressed); 
-}
-
-@utility fg-primary-bold {
- color: var(--fg-primary-bold);
---icon-color: var(--fg-primary-bold); 
-}
-
-@utility fg-primary-muted {
- color: var(--fg-primary-muted);
---icon-color: var(--fg-primary-muted); 
-}
-
-@utility fg-inverse-bold {
- color: var(--fg-inverse-bold);
---icon-color: var(--fg-inverse-bold); 
-}
-
-@utility fg-inverse-muted {
- color: var(--fg-inverse-muted);
---icon-color: var(--fg-inverse-muted); 
-}
-
-@utility fg-disabled {
- color: var(--fg-disabled);
---icon-color: var(--fg-disabled); 
-}
-
-@utility fg-accent-primary-bold {
- color: var(--fg-accent-primary-bold);
---icon-color: var(--fg-accent-primary-bold); 
-}
-
-@utility fg-accent-primary-hover {
- color: var(--fg-accent-primary-hover);
---icon-color: var(--fg-accent-primary-hover); 
-}
-
-@utility fg-accent-primary-pressed {
- color: var(--fg-accent-primary-pressed);
---icon-color: var(--fg-accent-primary-pressed); 
-}
-
-@utility fg-info-bold {
- color: var(--fg-info-bold);
---icon-color: var(--fg-info-bold); 
-}
-
-@utility fg-info-hover {
- color: var(--fg-info-hover);
---icon-color: var(--fg-info-hover); 
-}
-
-@utility fg-info-pressed {
- color: var(--fg-info-pressed);
---icon-color: var(--fg-info-pressed); 
-}
-
-@utility fg-advisory-bold {
- color: var(--fg-advisory-bold);
---icon-color: var(--fg-advisory-bold); 
-}
-
-@utility fg-advisory-hover {
- color: var(--fg-advisory-hover);
---icon-color: var(--fg-advisory-hover); 
-}
-
-@utility fg-advisory-pressed {
- color: var(--fg-advisory-pressed);
---icon-color: var(--fg-advisory-pressed); 
-}
-
-@utility fg-normal-bold {
- color: var(--fg-normal-bold);
---icon-color: var(--fg-normal-bold); 
-}
-
-@utility fg-normal-hover {
- color: var(--fg-normal-hover);
---icon-color: var(--fg-normal-hover); 
-}
-
-@utility fg-normal-pressed {
- color: var(--fg-normal-pressed);
---icon-color: var(--fg-normal-pressed); 
-}
-
-@utility fg-serious-bold {
- color: var(--fg-serious-bold);
---icon-color: var(--fg-serious-bold); 
-}
-
-@utility fg-serious-hover {
- color: var(--fg-serious-hover);
---icon-color: var(--fg-serious-hover); 
-}
-
-@utility fg-serious-pressed {
- color: var(--fg-serious-pressed);
---icon-color: var(--fg-serious-pressed); 
-}
-
-@utility fg-critical-bold {
- color: var(--fg-critical-bold);
---icon-color: var(--fg-critical-bold); 
-}
-
-@utility fg-critical-hover {
- color: var(--fg-critical-hover);
---icon-color: var(--fg-critical-hover); 
-}
-
-@utility fg-critical-pressed {
- color: var(--fg-critical-pressed);
---icon-color: var(--fg-critical-pressed); 
-}
-
-@utility fg-a11y-on-accent {
- color: var(--fg-a11y-on-accent);
---icon-color: var(--fg-a11y-on-accent); 
-}
-
-@utility fg-a11y-on-utility {
- color: var(--fg-a11y-on-utility);
---icon-color: var(--fg-a11y-on-utility); 
-}
-
-@utility outline-static {
- outline-color: var(--outline-static); 
-}
-
-@utility outline-interactive {
- outline-color: var(--outline-interactive); 
-}
-
-@utility outline-interactive-hover {
- outline-color: var(--outline-interactive-hover); 
-}
-
-@utility outline-interactive-pressed {
- outline-color: var(--outline-interactive-pressed); 
-}
-
-@utility outline-interactive-disabled {
- outline-color: var(--outline-interactive-disabled); 
-}
-
-@utility outline-accent-primary-bold {
- outline-color: var(--outline-accent-primary-bold); 
-}
-
-@utility outline-accent-primary-hover {
- outline-color: var(--outline-accent-primary-hover); 
-}
-
-@utility outline-accent-primary-pressed {
- outline-color: var(--outline-accent-primary-pressed); 
-}
-
-@utility outline-info-bold {
- outline-color: var(--outline-info-bold); 
-}
-
-@utility outline-info-hover {
- outline-color: var(--outline-info-hover); 
-}
-
-@utility outline-info-pressed {
- outline-color: var(--outline-info-pressed); 
-}
-
-@utility outline-advisory-bold {
- outline-color: var(--outline-advisory-bold); 
-}
-
-@utility outline-advisory-hover {
- outline-color: var(--outline-advisory-hover); 
-}
-
-@utility outline-advisory-pressed {
- outline-color: var(--outline-advisory-pressed); 
-}
-
-@utility outline-normal-bold {
- outline-color: var(--outline-normal-bold); 
-}
-
-@utility outline-normal-hover {
- outline-color: var(--outline-normal-hover); 
-}
-
-@utility outline-normal-pressed {
- outline-color: var(--outline-normal-pressed); 
-}
-
-@utility outline-serious-bold {
- outline-color: var(--outline-serious-bold); 
-}
-
-@utility outline-serious-hover {
- outline-color: var(--outline-serious-hover); 
-}
-
-@utility outline-serious-pressed {
- outline-color: var(--outline-serious-pressed); 
-}
-
-@utility outline-critical-bold {
- outline-color: var(--outline-critical-bold); 
-}
-
-@utility outline-critical-hover {
- outline-color: var(--outline-critical-hover); 
-}
-
-@utility outline-critical-pressed {
- outline-color: var(--outline-critical-pressed); 
-}
-
-@utility outline-mono-bold {
- outline-color: var(--outline-mono-bold); 
-}
-
-@utility outline-mono-bold-hover {
- outline-color: var(--outline-mono-bold-hover); 
-}
-
-@utility outline-mono-bold-pressed {
- outline-color: var(--outline-mono-bold-pressed); 
-}
-
-@utility shadow-elevation-raised {
- box-shadow: var(--shadow-elevation-raised); 
-}
-
-@utility shadow-elevation-overlay {
- box-shadow: var(--shadow-elevation-overlay); 
-}