vira 32.0.0-beta.0 → 32.0.0

package/dist/styles/vira-color-theme.d.ts

@@ -0,0 +1,2785 @@
+/**
+ * A color theme designed for straightforward accessible foreground and background color choices.
+ * All color pairs can be seen here: https://electrovir.github.io/vira/book/styles/vira-theme.
+ *
+ * Consider using [`colorCss` from
+ * @electrovir/color](https://electrovir.github.io/color/docs/functions/colorCss.html) for applying
+ * a foreground and background color at the same time in CSS.
+ *
+ * ## Color Pairs
+ *
+ * Each color choice is stored in a color pair. Each color pair includes a foreground and a
+ * background color. Foreground and background color pairs are set to specific lightness levels to
+ * ensure a specific level of contrast, which you can choose from (as explained below). Most color
+ * pairs include a color interacting with the page default color pair. These page defaults depend on
+ * which theme you select: light mode or dark mode. The defaults are the following:
+ *
+ * - Light mode:
+ *
+ *   - Foreground: black
+ *   - Background: white
+ * - Dark mode:
+ *
+ *   - Foreground: white
+ *   - Background: black
+ *
+ * ## Choosing a Color
+ *
+ * Each color in the theme is a key following the pattern
+ * `vira-{colorName}-{pairType}-{contrastLevel}`. (Note that there is also `viraThemeByKeys`, which
+ * stores colors in nested objects, accessed with the pattern
+ * `viraThemeByKeys[colorName][pairType][contrastLevel]`.) The following steps explain how to select
+ * a color pair:
+ *
+ * 1. **Choose a color name.** Red, blue, etc. This is the color that you're trying to use.
+ *
+ *    - Examples:
+ *
+ *         - `viraTheme.colors['vira-red-foreground-body']`
+ *         - `viraTheme.colors['vira-blue-foreground-body']`
+ * 2. **Choose a color pair type.** This determines where the color name you chose is placed in the
+ *    color pair.
+ *
+ *    - `foreground`: "Color in the foreground". In this color pair, the chosen color is the foreground
+ *         and the page default background (white in light mode, black in dark mode) is the
+ *         background. The lightness level of the foreground, the chosen color, varies based on the
+ *         selected contrast level (in the next step).
+ *
+ *         - Foreground: the chosen color (red, blue, etc.)
+ *         - Background: the page default background (white in light mode, black in dark mode).
+ *         - Example: `viraTheme.colors['vira-red-foreground-body']`
+ *         - Example: `viraTheme.colors['vira-blue-foreground-body']`
+ *    - `behind-fg`: "Color behind foreground". In this color pair, the chosen color is the background
+ *         and the page default foreground (black in light mode, white in dark mode) is the
+ *         foreground. The lightness level of the background, the chosen color, varies based on the
+ *         selected contrast level (in the next step).
+ *
+ *         - Foreground: the page default foreground (black in light mode, white in dark mode).
+ *         - Background: the chosen color (red, blue, etc.)
+ *         - Example: `viraTheme.colors['vira-red-behind-fg-body']`
+ *         - Example: `viraTheme.colors['vira-blue-behind-fg-body']`
+ *    - `behind-bg`: "Color behind background". In this color pair, the chosen color is the background
+ *         and the page default background (white in light mode, black in dark mode) is the
+ *         foreground. The lightness level of the background, the chosen color, varies based on the
+ *         selected contrast level (in the next step).
+ *
+ *         - Foreground: the page default background (white in light mode, black in dark mode)
+ *         - Background: the chosen color (red, blue, etc.)
+ *         - Example: `viraTheme.colors['vira-red-behind-bg-body']`
+ *         - Example: `viraTheme.colors['vira-blue-behind-bg-body']`
+ *    - `on-self`: "Color on self". In this color pair, both the foreground and the background are a
+ *         shade of the chosen color. The lightness level of the background chosen color varies
+ *         based on the selected contrast level (in the next step). The lightness of the foreground
+ *         chosen color is fixed based on the current theme: a dark foreground in light mode, a
+ *         light foreground in dark mode (to remain similar to the page default foreground color).
+ *
+ *         - Foreground: the chosen color (red, blue, etc.)
+ *         - Background: the chosen color (red, blue, etc.)
+ *         - Example: `viraTheme.colors['vira-red-on-self-body']`
+ *         - Example: `viraTheme.colors['vira-blue-on-self-body']`
+ * 3. **Choose a contrast level.** Choose a level of contrast based on what you are applying color to.
+ *    See https://electrovir.github.io/color/docs/variables/contrastLevels.html for more details on
+ *    each contrast level as defined by APCA color contrast standards.
+ *
+ *    - `small-body`: Choose this for text or page elements that should be legible but are small in size
+ *         (< 14px font size, similarly sized icons, etc.).
+ *
+ *         - The color pair is chosen to ensure about Lc 90 contrast (very high) between the foreground and
+ *                   the background.
+ *         - Example: `viraTheme.colors['vira-red-foreground-small-body']`: In light mode, this has a very
+ *                   dark red foreground.
+ *         - Example: `viraTheme.colors['vira-blue-on-self-small-body']`: In light mode, a very light blue is
+ *                   used as the background color. (The foreground is a very dark blue.)
+ *    - `body`: Chose this for text or page elements that should be legible and are a normal body text
+ *         size (>= 14px font size).
+ *
+ *         - The color pair is chosen to ensure about Lc 75 contrast between the foreground and the
+ *                   background.
+ *         - Example: `viraTheme.colors['vira-red-foreground-body']`: In light mode, this has a dark red
+ *                   foreground (not as dark as the `small-body` variant).
+ *         - Example: `viraTheme.colors['vira-blue-on-self-body']`: In light mode, a light blue background is
+ *                   used (but darker than the small-body contrast level). (The foreground is a very
+ *                   dark blue.)
+ *    - `non-body`: Chose this for text or page elements that should be legible but are larger in size
+ *         (>= 24px font size with normal font weight) or are not a part of normal body text.
+ *
+ *         - The color pair is chosen to ensure about Lc 60 contrast between the foreground and the
+ *                   background.
+ *         - Example: `viraTheme.colors['vira-red-foreground-non-body']`: In light mode, this has slightly
+ *                   dark red foreground.
+ *         - Example: `viraTheme.colors['vira-blue-on-self-non-body']`: In light mode, a light blue background
+ *                   is used (but darker than the body contrast level). (The foreground is a very
+ *                   dark blue.)
+ *    - `header`: Chose this for text or page elements that are heading or heading sized elements (>=24px
+ *         bolded text or >=36px normal weight text).
+ *
+ *         - The color pair is chosen to ensure about Lc 45 contrast between the foreground and the
+ *                   background.
+ *         - Example: `viraTheme.colors['vira-red-foreground-header']`: In light mode, this has a very vibrant
+ *                   red foreground.
+ *         - Example: `viraTheme.colors['vira-blue-on-self-header']`: In light mode, a plain blue (not dark or
+ *                   light) background is used. (The foreground is a very dark blue.)
+ *    - `placeholder`: Chose this for text or page elements that are placeholders or disabled.
+ *
+ *         - The color pair is chosen to ensure about Lc 30 contrast between the foreground and the
+ *                   background.
+ *         - Example: `viraTheme.colors['vira-red-foreground-placeholder']`: In light mode, this has a light
+ *                   red foreground.
+ *         - Example: `viraTheme.colors['vira-blue-on-self-placeholder']`: In light mode, a dark blue
+ *                   background is used. (The foreground is a very dark blue.)
+ *    - `decoration`: Chose this for decorative page elements such as borders that, if not visible to the
+ *         user (many users may not be able to distinguish this color pair's foreground from the
+ *         background), do not reduce the usability of the page.
+ *
+ *         - The color pair is chosen to ensure about Lc 15 contrast between the foreground and the
+ *                   background.
+ *         - Example: `viraTheme.colors['vira-red-foreground-decoration']`: In light mode, this has a very
+ *                   light red foreground.
+ *         - Example: `viraTheme.colors['vira-blue-on-self-decoration']`: In light mode, a darker blue
+ *                   background is used. (The foreground is a very dark blue.)
+ *    - `invisible`: Choose this for decorative elements that are even harder-to-see (dimmer) than
+ *         `decoration` elements. The foreground and background colors in a color pair in this
+ *         contrast level should be treated as indistinguishable from each other to most of the
+ *         human population.
+ *
+ *         - The color pair is chosen to ensure Lc 0 contrast between the foreground and the background.
+ *         - Example: `viraTheme.colors['vira-red-foreground-invisible']`: In light mode, this has an
+ *                   extremely light red foreground, essentially a pale pink.
+ *         - Example: `viraTheme.colors['vira-blue-on-self-invisible']`: In light mode, an extremely dark blue
+ *                   background is used. (The foreground is a very dark blue.)
+ *
+ *    There are also auxiliary contrast levels available which do not correspond to any specific
+ *    element usage on a page:
+ *
+ *    - `highest-contrast`: Maximum possible contrast between the foreground and background (from the
+ *         color palette). In many color pairs, this will be the same as the `small-body` contrast
+ *         level.
+ *    - `lowest-contrast`: Minimum possible contrast between the foreground and background (from the
+ *         color palette). In many color pairs, this will be the same as the `invisible` contrast
+ *         level.
+ *
+ * ## Examples
+ *
+ * To style an error message (red body text):
+ *
+ * ```css
+ * color: ${viraTheme.colors['vira-red-foreground-body'].foreground.value};
+ * ```
+ *
+ * To style a green banner with white text (in light mode) and black text (in dark mode):
+ *
+ * ```css
+ * .banner {
+ *     ${colorCss(viraTheme.colors['vira-green-behind-bg-body'])};
+ * }
+ * ```
+ *
+ * `viraThemeByKeys` for structured access:
+ *
+ * ```css
+ * color: ${viraThemeByKeys.red.foreground.body.foreground.value};
+ * ```
+ *
+ * @category Color
+ */
+export declare const viraTheme: import("theme-vir/dist/color-theme/color-theme.js").ColorTheme<{
+    readonly 'vira-red-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+}>;
+/**
+ * Dark mode override for {@link viraTheme}.
+ *
+ * @category Color
+ */
+export declare const viraThemeDarkOverride: import("theme-vir/dist/color-theme/color-theme-init.js").ColorThemeOverride<{
+    readonly 'vira-red-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-red-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-yellow-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-green-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-teal-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-blue-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-brand-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-purple-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-pink-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-foreground-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-highest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-small-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-non-body': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-header': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-placeholder': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-decoration': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-invisible': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-bg-lowest-contrast': {
+        readonly foreground: {
+            readonly refDefaultBackground: true;
+        };
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-highest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-small-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-non-body': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-header': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-placeholder': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-decoration': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-invisible': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-behind-fg-lowest-contrast': {
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-highest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-small-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-non-body': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-header': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-placeholder': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-decoration': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-invisible': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+    readonly 'vira-grey-on-self-lowest-contrast': {
+        readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
+        readonly background: import("lit-css-vars").SingleCssVarDefinition;
+    };
+}>;