diff --git a/README.md b/README.md
index 9b54d7a..162ec03 100644
--- a/README.md
+++ b/README.md
@@ -9,13 +9,13 @@
  INGROUP: MokoCassiopeia.Documentation
  REPO: https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia
  FILE: ./README.md
- VERSION: 03.10.03
+ VERSION: 03.10.04
  BRIEF: Documentation for MokoCassiopeia template
  -->
 
 # MokoCassiopeia → MokoOnyx
 
-> **This template is being renamed to MokoOnyx.** Version 03.10.03 is the bridge release that automatically migrates your settings. After updating, MokoOnyx will be your active template and MokoCassiopeia can be safely uninstalled.
+> **This template is being renamed to MokoOnyx.** Version 03.10.04 is the bridge release that automatically migrates your settings. After updating, MokoOnyx will be your active template and MokoCassiopeia can be safely uninstalled.
 
 **A Modern, Lightweight Joomla Template Based on Cassiopeia**
 
diff --git a/src/joomla.asset.json b/src/joomla.asset.json
index 1d58434..f15a65f 100644
--- a/src/joomla.asset.json
+++ b/src/joomla.asset.json
@@ -17,7 +17,7 @@
 			"defgroup": "Joomla.Template.Site",
 			"ingroup": "MokoCassiopeia.Template.Assets",
 			"path": "./media/templates/site/mokocassiopeia/joomla.asset.json",
-			"version": "03.10.03",
+			"version": "03.10.04",
 			"brief": "Joomla asset registry for MokoCassiopeia"
 		}
 	},
diff --git a/src/media/css/theme/dark.standard.css b/src/media/css/theme/dark.standard.css
index 0b2cab7..8ccce6b 100644
--- a/src/media/css/theme/dark.standard.css
+++ b/src/media/css/theme/dark.standard.css
@@ -12,26 +12,144 @@
 :root[data-bs-theme='dark']{
 color-scheme: dark;
 
+
 /* ===== BRAND & THEME COLORS ===== */
 --color-primary: #112855;
 --accent-color-primary: #3f8ff0;
 --accent-color-secondary: #6fb3ff;
 
+
+/* ===== TYPOGRAPHY & BODY ===== */
+--font-sans-serif: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
+--font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+--body-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
+--body-font-size: 1rem;
+--body-font-weight: 400;
+--body-line-height: 1.5;
+--body-color: #e6ebf1;
+--body-color-rgb: 230, 235, 241;
+--body-bg: #0e1318;
+--body-bg-rgb: 14, 19, 24;
+--heading-color: #f1f5f9;
+--emphasis-color: #fff;
+--emphasis-color-rgb: 255, 255, 255;
+--secondary-color: #e6ebf1bf;
+--secondary-color-rgb: 230, 235, 241;
+--tertiary-color: #e6ebf180;
+--tertiary-color-rgb: 230, 235, 241;
+--muted-color: #6d757e;
+--code-color: black;
+--code-color-ink: var(--code-color, #e93f8e);
+--code-bg-color: lightgreen;
+--highlight-color: #111;
+--highlight-bg: #ffe28a1a;
+
+
+/* ===== STANDARD COLORS ===== */
+--blue: #91a4ff;
+--indigo: #b19cff;
+--purple: #c0a5ff;
+--pink: #ff8fc0;
+--red: #ff7a73;
+--orange: #ff9c4d;
+--yellow: #ffd166;
+--green: #78d694;
+--teal: #76e3ff;
+--cyan: #6fb7ff;
+--black: #000;
+--white: #fff;
+
+
+/* ===== GRAY SCALE ===== */
+--gray-100: #161a20;
+--gray-200: #1b2027;
+--gray-300: #222831;
+--gray-400: #2b323b;
+--gray-500: #36404a;
+--gray-600: #48525d;
+--gray-700: #5b6672;
+--gray-800: #cfd6de;
+--gray-900: #e6ebf1;
+--white-rgb: 255, 255, 255;
+--black-rgb: 0, 0, 0;
+
+
+/* ===== OPACITY UTILITIES ===== */
+--opacity-0: 0;
+--opacity-5: 0.05;
+--opacity-10: 0.1;
+--opacity-15: 0.15;
+--opacity-20: 0.2;
+--opacity-25: 0.25;
+--opacity-30: 0.3;
+--opacity-50: 0.5;
+--opacity-75: 0.75;
+--opacity-100: 1;
+
+
+/* ===== LAYOUT & SPACING ===== */
+--padding-x: 0.15rem;
+--padding-y: 0.15rem;
+--bg-opacity: 1;
+--nav-toggle-size: 3rem;
+--gradient: linear-gradient(180deg, #ffffff26, #fff0);
+--secondary-bg: #151b22;
+--secondary-bg-rgb: 21, 27, 34;
+--tertiary-bg: #10151b;
+--tertiary-bg-rgb: 16, 21, 27;
+--hr-color: var(--border-color, #dfe3e7);
+--border-color-soft: var(--border-color, #dfe3e7);
+--kbd-bg: var(--secondary-bg, #eaedf0);
+--kbd-ink: var(--body-bg, #fff);
+--toc-bg: var(--secondary-bg, #eaedf0);
+--toc-ink: var(--color-primary, #112855);
+--selection-bg: var(--highlight-bg, #fbeea8);
+--selection-ink: var(--body-color, #22262a);
+--border: 5px;
+
+
+/* ===== BREAKPOINTS ===== */
+--bp-xs: 0;
+--bp-sm: 576px;
+--bp-md: 768px;
+--bp-lg: 992px;
+--bp-xl: 1200px;
+
+
+/* ===== BORDERS ===== */
+--border-width: 1px;
+--border-style: solid;
+--border-color: #2b323b;
+--border-color-translucent: #ffffff26;
+--border-radius: .25rem;
+--border-radius-sm: .2rem;
+--border-radius-lg: .3rem;
+--border-radius-xl: .3rem;
+--border-radius-xxl: 2rem;
+--border-radius-2xl: var(--border-radius-xxl);
+--border-radius-pill: 50rem;
+
+
+/* ===== SHADOWS ===== */
+--box-shadow: 0 .5rem 1rem #00000066;
+--box-shadow-sm: 0 .125rem .25rem #00000040;
+--box-shadow-lg: 0 1rem 3rem #00000080;
+--box-shadow-inset: inset 0 1px 2px #00000040;
+
+
+/* ===== COMMON SHADOW COLORS ===== */
+--shadow-color-light: rgba(var(--black-rgb), var(--opacity-30));
+--shadow-color-medium: rgba(var(--black-rgb), var(--opacity-50));
+--shadow-color-dark: rgba(var(--black-rgb), var(--opacity-75));
+--border-color-translucent: rgba(var(--white-rgb), var(--opacity-10));
+--highlight-translucent: rgba(var(--white-rgb), var(--opacity-5));
+
+
 /* ===== NAVIGATION ===== */
 --mainmenu-nav-link-color: #fff;
 --nav-text-color: gray;
 --nav-bg-color: var(--color-primary);
 
-/* ===== LINKS ===== */
---color-link: white;
---color-hover: gray;
---color-active: var(--mainmenu-nav-link-color);
---link-color: #8ab4f8;
---link-color-rgb: 138, 180, 248;
---link-decoration: underline;
---link-hover-color: #c3d6ff;
---link-hover-color-rgb: 195, 214, 255;
---link-active-color: var(--link-color);
 
 /* ===== NAVBAR ===== */
 --navbar-padding-x: 1rem;
@@ -59,135 +177,18 @@ color-scheme: dark;
 --nav-link-active-color: var(--mainmenu-nav-link-color);
 --nav-link-disabled-color: #6c757d;
 
-/* ===== TYPOGRAPHY & BODY ===== */
---font-sans-serif: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
---font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
---body-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
---body-font-size: 1rem;
---body-font-weight: 400;
---body-line-height: 1.5;
---body-color: #e6ebf1;
---body-color-rgb: 230, 235, 241;
---body-bg: #0e1318;
---body-bg-rgb: 14, 19, 24;
---heading-color: #f1f5f9;
---emphasis-color: #fff;
---emphasis-color-rgb: 255, 255, 255;
---secondary-color: #e6ebf1bf;
---secondary-color-rgb: 230, 235, 241;
---tertiary-color: #e6ebf180;
---tertiary-color-rgb: 230, 235, 241;
---muted-color: #6d757e;
---code-color: black;
---code-color-ink: var(--code-color, #e93f8e);
---code-bg-color: lightgreen;
---highlight-color: #111;
---highlight-bg: #ffe28a1a;
 
-/* ===== LAYOUT & SPACING ===== */
---padding-x: 0.15rem;
---padding-y: 0.15rem;
---bg-opacity: 1;
---nav-toggle-size: 3rem;
---gradient: linear-gradient(180deg, #ffffff26, #fff0);
---secondary-bg: #151b22;
---secondary-bg-rgb: 21, 27, 34;
---tertiary-bg: #10151b;
---tertiary-bg-rgb: 16, 21, 27;
---hr-color: var(--border-color, #dfe3e7);
---border-color-soft: var(--border-color, #dfe3e7);
---kbd-bg: var(--secondary-bg, #eaedf0);
---kbd-ink: var(--body-bg, #fff);
---toc-bg: var(--secondary-bg, #eaedf0);
---toc-ink: var(--color-primary, #112855);
---selection-bg: var(--highlight-bg, #fbeea8);
---selection-ink: var(--body-color, #22262a);
---border: 5px;
+/* ===== LINKS ===== */
+--color-link: white;
+--color-hover: gray;
+--color-active: var(--mainmenu-nav-link-color);
+--link-color: #8ab4f8;
+--link-color-rgb: 138, 180, 248;
+--link-decoration: underline;
+--link-hover-color: #c3d6ff;
+--link-hover-color-rgb: 195, 214, 255;
+--link-active-color: var(--link-color);
 
-/* ===== BREAKPOINTS ===== */
---bp-xs: 0;
---bp-sm: 576px;
---bp-md: 768px;
---bp-lg: 992px;
---bp-xl: 1200px;
-
-/* ===== BOOTSTRAP PALETTE ===== */
---primary: #010156;
---secondary: #48525d;
---success: #4aa664;
---info: #4f7aa0;
---warning: #c77a00;
---danger: #c23a31;
---light: #1b2027;
---dark: #0f1318;
---primary-rgb: 1,1,86;
---secondary-rgb: 72,82,93;
---success-rgb: 74,166,100;
---info-rgb: 79,122,160;
---warning-rgb: 199,122,0;
---danger-rgb: 194,58,49;
---light-rgb: 27,32,39;
---dark-rgb: 15,19,24;
---primary-text-emphasis: #c7ccff;
---secondary-text-emphasis: #cfd6de;
---success-text-emphasis: #bde8c9;
---info-text-emphasis: #bcd6ee;
---warning-text-emphasis: #ffd9a6;
---danger-text-emphasis: #ffb7b2;
---light-text-emphasis: #d2d8df;
---dark-text-emphasis: #d2d8df;
---primary-bg-subtle: #0b1030;
---secondary-bg-subtle: #1e2430;
---success-bg-subtle: #0f2a1b;
---info-bg-subtle: #0d2232;
---warning-bg-subtle: #2a1e06;
---danger-bg-subtle: #2d1110;
---light-bg-subtle: #12161d;
---dark-bg-subtle: #1e2430;
---primary-border-subtle: #2b3a7a;
---secondary-border-subtle: #2b323b;
---success-border-subtle: #2b5b40;
---info-border-subtle: #254861;
---warning-border-subtle: #5a3c0e;
---danger-border-subtle: #5c2723;
---light-border-subtle: #222831;
---dark-border-subtle: #2b323b;
-
-/* ===== ALERT LINK COLORS ===== */
---alert-primary-link-color: #b3c1ff;
---alert-secondary-link-color: #9fa6ad;
---alert-success-link-color: #a0e5b3;
---alert-info-link-color: #8eccf2;
---alert-warning-link-color: #ffe4a0;
---alert-danger-link-color: #ffa8a3;
---alert-light-link-color: #f0f4f8;
---alert-dark-link-color: #9fa6ad;
-
-/* ===== LIST GROUP ITEM COLORS ===== */
---list-group-item-primary-color: #8ca3ff;
---list-group-item-primary-bg: #1a2550;
---list-group-item-primary-active-bg: #223066;
---list-group-item-secondary-color: #9fa6ad;
---list-group-item-secondary-bg: #2b323b;
---list-group-item-secondary-active-bg: #363d47;
---list-group-item-success-color: #a0e5b3;
---list-group-item-success-bg: #1e3d2d;
---list-group-item-success-active-bg: #275538;
---list-group-item-info-color: #8eccf2;
---list-group-item-info-bg: #1a3448;
---list-group-item-info-active-bg: #234459;
---list-group-item-warning-color: #ffe4a0;
---list-group-item-warning-bg: #4a3410;
---list-group-item-warning-active-bg: #5c4216;
---list-group-item-danger-color: #ffa8a3;
---list-group-item-danger-bg: #4a1e1c;
---list-group-item-danger-active-bg: #5c2823;
---list-group-item-light-color: #e9ecef;
---list-group-item-light-bg: #1e2430;
---list-group-item-light-active-bg: #282f3d;
---list-group-item-dark-color: #48525d;
---list-group-item-dark-bg: #0e1318;
---list-group-item-dark-active-bg: #161b22;
 
 /* ===== LINK UTILITY COLORS ===== */
 --link-primary-color: hsl(240, 98%, 50%);
@@ -207,85 +208,6 @@ color-scheme: dark;
 --link-dark-color: hsl(210, 10%, 35%);
 --link-dark-hover-color: hsl(210, 10%, 30%);
 
-/* ===== COMPONENT-SPECIFIC COLORS ===== */
---mod-finder-link-hover: #5a6470;
---form-legend-color: #9fa6ad;
---border-gray: #3a4250;
---subhead-color: #9fa6ad;
---box-shadow-gray: #1a2027;
---btn-active-text-gray: #7a8490;
---indicator-success-bg: var(--success);
---item-list-color: #2a2f34;
---notification-badge-bg: var(--danger);
---content-bg-gray: #2b323b;
---taba-btn-green: #5a9c2f;
---taba-btn-blue: #3d75a8;
---taba-btn-red: #c43620;
---taba-btn-gray: #6a7080;
---taba-msg-bg: #1e2430;
---toc-link-color: #9fa6ad;
---toc-link-active-color: #91a4ff;
---choices-disabled-bg: #2b323b;
---choices-input-bg: var(--body-bg);
---choices-border-light: #48525d;
---choices-arrow-color: #9fa6ad;
---choices-inner-bg: #1a2027;
---choices-focused-border: #5472ff;
---choices-dropdown-bg: var(--body-bg);
---choices-item-bg: #1a5f75;
---choices-item-border: #1a748f;
---choices-item-hover-bg: #1a748f;
---choices-item-hover-border: #1a8aa8;
---choices-item-disabled-bg: #48525d;
---choices-item-disabled-border: #36404a;
---choices-item-highlighted: #2b323b;
---choices-input-inner-bg: #1a2027;
-
-/* ===== STANDARD COLORS ===== */
---blue: #91a4ff;
---indigo: #b19cff;
---purple: #c0a5ff;
---pink: #ff8fc0;
---red: #ff7a73;
---orange: #ff9c4d;
---yellow: #ffd166;
---green: #78d694;
---teal: #76e3ff;
---cyan: #6fb7ff;
---black: #000;
---white: #fff;
-
-/* ===== GRAY SCALE ===== */
---gray-100: #161a20;
---gray-200: #1b2027;
---gray-300: #222831;
---gray-400: #2b323b;
---gray-500: #36404a;
---gray-600: #48525d;
---gray-700: #5b6672;
---gray-800: #cfd6de;
---gray-900: #e6ebf1;
---white-rgb: 255, 255, 255;
---black-rgb: 0, 0, 0;
-
-/* ===== OPACITY UTILITIES ===== */
---opacity-0: 0;
---opacity-5: 0.05;
---opacity-10: 0.1;
---opacity-15: 0.15;
---opacity-20: 0.2;
---opacity-25: 0.25;
---opacity-30: 0.3;
---opacity-50: 0.5;
---opacity-75: 0.75;
---opacity-100: 1;
-
-/* ===== COMMON SHADOW COLORS ===== */
---shadow-color-light: rgba(var(--black-rgb), var(--opacity-30));
---shadow-color-medium: rgba(var(--black-rgb), var(--opacity-50));
---shadow-color-dark: rgba(var(--black-rgb), var(--opacity-75));
---border-color-translucent: rgba(var(--white-rgb), var(--opacity-10));
---highlight-translucent: rgba(var(--white-rgb), var(--opacity-5));
 
 /* ===== HEADER BACKGROUND ===== */
 --header-background-image: url('../../../../../../media/templates/site/mokocassiopeia/images/bg.svg');
@@ -293,6 +215,7 @@ color-scheme: dark;
 --header-background-repeat: repeat;
 --header-background-size: auto;
 
+
 /* ===== CONTAINER BACKGROUNDS ===== */
 /* Below Topbar Container */
 --container-below-topbar-bg-image: none;
@@ -358,24 +281,6 @@ color-scheme: dark;
 --container-bottom-b-border: none;
 --container-bottom-b-border-radius: 0;
 
-/* ===== BORDERS ===== */
---border-width: 1px;
---border-style: solid;
---border-color: #2b323b;
---border-color-translucent: #ffffff26;
---border-radius: .25rem;
---border-radius-sm: .2rem;
---border-radius-lg: .3rem;
---border-radius-xl: .3rem;
---border-radius-xxl: 2rem;
---border-radius-2xl: var(--border-radius-xxl);
---border-radius-pill: 50rem;
-
-/* ===== SHADOWS ===== */
---box-shadow: 0 .5rem 1rem #00000066;
---box-shadow-sm: 0 .125rem .25rem #00000040;
---box-shadow-lg: 0 1rem 3rem #00000080;
---box-shadow-inset: inset 0 1px 2px #00000040;
 
 /* ===== FOCUS & FORMS ===== */
 --focus-ring-width: .25rem;
@@ -396,10 +301,85 @@ color-scheme: dark;
 --form-invalid-color: #ff8e86;
 --form-invalid-border-color: #ff8e86;
 
+
 /* ===== BUTTONS ===== */
 --btn-border-radius: var(--border-radius);
 --btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 1px 1px rgba(0, 0, 0, 0.3);
 
+
+/* ===== ACCORDION ===== */
+--accordion-color: var(--body-color);
+--accordion-bg: var(--body-bg);
+--accordion-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
+--accordion-border-color: var(--border-color);
+--accordion-border-width: 1px;
+--accordion-border-radius: 0.25rem;
+--accordion-inner-border-radius: calc(0.25rem - 1px);
+--accordion-btn-padding-x: 1.25rem;
+--accordion-btn-padding-y: 1rem;
+--accordion-btn-color: var(--body-color);
+--accordion-btn-bg: var(--accordion-bg);
+--accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23e6ebf1'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
+--accordion-btn-icon-width: 1.25rem;
+--accordion-btn-icon-transform: rotate(-180deg);
+--accordion-btn-icon-transition: transform 0.2s ease-in-out;
+--accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%238ab4f8'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
+--accordion-btn-focus-border-color: var(--input-focus-border-color);
+--accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(84, 114, 255, 0.25);
+--accordion-body-padding-x: 1.25rem;
+--accordion-body-padding-y: 1rem;
+--accordion-active-color: var(--link-color);
+--accordion-active-bg: var(--secondary-bg);
+
+
+/* ===== ALERT ===== */
+--alert-bg: transparent;
+--alert-padding-x: 1rem;
+--alert-padding-y: 1rem;
+--alert-margin-bottom: 1rem;
+--alert-color: #000;
+--alert-border-color: transparent;
+--alert-border: 1px solid var(--alert-border-color);
+--alert-border-radius: 0.25rem;
+
+
+/* ===== ALERT LINK COLORS ===== */
+--alert-primary-link-color: #b3c1ff;
+--alert-secondary-link-color: #9fa6ad;
+--alert-success-link-color: #a0e5b3;
+--alert-info-link-color: #8eccf2;
+--alert-warning-link-color: #ffe4a0;
+--alert-danger-link-color: #ffa8a3;
+--alert-light-link-color: #f0f4f8;
+--alert-dark-link-color: #9fa6ad;
+
+
+/* ===== BACKDROP ===== */
+--backdrop-zindex: 1040;
+--backdrop-bg: hsl(0, 0%, 0%);
+--backdrop-opacity: 0.5;
+
+
+/* ===== BADGE ===== */
+--badge-padding-x: 0.65em;
+--badge-padding-y: 0.35em;
+--badge-font-size: 0.75em;
+--badge-font-weight: 700;
+--badge-color: var(--body-color);
+--badge-border-radius: 0.25rem;
+
+
+/* ===== BREADCRUMB ===== */
+--breadcrumb-padding-x: 0;
+--breadcrumb-padding-y: 0;
+--breadcrumb-margin-bottom: 1rem;
+--breadcrumb-bg: ;
+--breadcrumb-border-radius: ;
+--breadcrumb-divider-color: var(--gray-600);
+--breadcrumb-item-padding-x: 0.5rem;
+--breadcrumb-item-active-color: var(--link-color);
+
+
 /* ===== CARDS ===== */
 --card-spacer-y: 1rem;
 --card-spacer-x: 1rem;
@@ -419,6 +399,406 @@ color-scheme: dark;
 --card-img-overlay-padding: 1rem;
 --card-group-margin: 0.75rem;
 
+
+/* ===== DROPDOWN ===== */
+--dropdown-zindex: 1000;
+--dropdown-min-width: 10rem;
+--dropdown-padding-x: 0;
+--dropdown-padding-y: 0.5rem;
+--dropdown-spacer: 0.125rem;
+--dropdown-font-size: 1rem;
+--dropdown-color: var(--body-color);
+--dropdown-bg: var(--secondary-bg);
+--dropdown-border-color: var(--border-color-translucent);
+--dropdown-border-radius: 0.25rem;
+--dropdown-border-width: 1px;
+--dropdown-inner-border-radius: calc(0.25rem - 1px);
+--dropdown-divider-bg: var(--border-color-translucent);
+--dropdown-divider-margin-y: 0.5rem;
+--dropdown-box-shadow: 0 0.5rem 1rem var(--shadow-color-medium);
+--dropdown-link-color: var(--body-color);
+--dropdown-link-active-color: var(--body-color);
+--dropdown-link-active-bg: hsl(240, 98%, 17%);
+--dropdown-link-disabled-color: var(--gray-600);
+--dropdown-item-padding-x: 1rem;
+--dropdown-item-padding-y: 0.25rem;
+--dropdown-header-color: var(--gray-600);
+--dropdown-header-padding-x: 1rem;
+--dropdown-header-padding-y: 0.5rem;
+
+
+/* ===== LIST GROUP ===== */
+--list-group-color: var(--body-color);
+--list-group-bg: var(--secondary-bg);
+--list-group-border-color: rgba(var(--white-rgb), 0.125);
+--list-group-border-width: 1px;
+--list-group-border-radius: 0.25rem;
+--list-group-item-padding-x: 1rem;
+--list-group-item-padding-y: 0.5rem;
+--list-group-action-color: var(--gray-800);
+--list-group-action-active-color: var(--body-color);
+--list-group-action-active-bg: var(--tertiary-bg);
+--list-group-disabled-color: var(--gray-600);
+--list-group-disabled-bg: var(--secondary-bg);
+--list-group-active-color: var(--body-color);
+--list-group-active-bg: hsl(240, 98%, 17%);
+--list-group-active-border-color: hsl(240, 98%, 17%);
+
+
+/* ===== LIST GROUP ITEM COLORS ===== */
+--list-group-item-primary-color: #8ca3ff;
+--list-group-item-primary-bg: #1a2550;
+--list-group-item-primary-active-bg: #223066;
+--list-group-item-secondary-color: #9fa6ad;
+--list-group-item-secondary-bg: #2b323b;
+--list-group-item-secondary-active-bg: #363d47;
+--list-group-item-success-color: #a0e5b3;
+--list-group-item-success-bg: #1e3d2d;
+--list-group-item-success-active-bg: #275538;
+--list-group-item-info-color: #8eccf2;
+--list-group-item-info-bg: #1a3448;
+--list-group-item-info-active-bg: #234459;
+--list-group-item-warning-color: #ffe4a0;
+--list-group-item-warning-bg: #4a3410;
+--list-group-item-warning-active-bg: #5c4216;
+--list-group-item-danger-color: #ffa8a3;
+--list-group-item-danger-bg: #4a1e1c;
+--list-group-item-danger-active-bg: #5c2823;
+--list-group-item-light-color: #e9ecef;
+--list-group-item-light-bg: #1e2430;
+--list-group-item-light-active-bg: #282f3d;
+--list-group-item-dark-color: #48525d;
+--list-group-item-dark-bg: #0e1318;
+--list-group-item-dark-active-bg: #161b22;
+
+
+/* ===== MODAL ===== */
+--modal-zindex: 1050;
+--modal-width: 500px;
+--modal-padding: 1rem;
+--modal-margin: 0.5rem;
+--modal-color: ;
+--modal-bg: var(--secondary-bg);
+--modal-border-color: var(--border-color-translucent);
+--modal-border-width: 1px;
+--modal-border-radius: 0.3rem;
+--modal-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.3);
+--modal-inner-border-radius: calc(0.3rem - 1px);
+--modal-header-padding-x: 1rem;
+--modal-header-padding-y: 1rem;
+--modal-header-padding: 1rem 1rem;
+--modal-header-border-color: var(--border-color);
+--modal-header-border-width: 1px;
+--modal-title-line-height: 1.5;
+--modal-footer-gap: 0.5rem;
+--modal-footer-bg: ;
+--modal-footer-border-color: var(--border-color);
+--modal-footer-border-width: 1px;
+
+
+/* ===== NAV TABS ===== */
+--nav-tabs-border-width: 1px;
+--nav-tabs-border-color: var(--border-color);
+--nav-tabs-border-radius: 0.25rem;
+--nav-tabs-link-active-color: var(--body-color);
+--nav-tabs-link-active-bg: var(--secondary-bg);
+--nav-tabs-link-active-border-color: var(--border-color) var(--border-color) var(--secondary-bg);
+
+
+/* ===== NAV PILLS ===== */
+--nav-pills-border-radius: 0.25rem;
+--nav-pills-link-active-color: var(--body-color);
+--nav-pills-link-active-bg: hsl(240, 98%, 17%);
+
+
+/* ===== OFFCANVAS ===== */
+--offcanvas-zindex: 1045;
+--offcanvas-width: 400px;
+--offcanvas-height: 30vh;
+--offcanvas-padding-x: 1rem;
+--offcanvas-padding-y: 1rem;
+--offcanvas-color: var(--body-color);
+--offcanvas-bg: var(--body-bg);
+--offcanvas-border-width: 1px;
+--offcanvas-border-color: var(--border-color-translucent);
+--offcanvas-box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.3);
+
+
+/* ===== PAGINATION ===== */
+--pagination-padding-x: 0.75rem;
+--pagination-padding-y: 0.375rem;
+--pagination-font-size: 1rem;
+--pagination-color: var(--link-color);
+--pagination-bg: var(--secondary-bg);
+--pagination-border-width: 1px;
+--pagination-border-color: var(--border-color);
+--pagination-border-radius: 0.25rem;
+--pagination-focus-color: var(--link-active-color);
+--pagination-focus-bg: var(--tertiary-bg);
+--pagination-focus-box-shadow: 0 0 0 0.25rem rgba(84, 114, 255, 0.25);
+--pagination-active-color: var(--body-color);
+--pagination-active-bg: hsl(240, 98%, 17%);
+--pagination-active-border-color: hsl(240, 98%, 17%);
+--pagination-disabled-color: var(--gray-600);
+--pagination-disabled-bg: var(--secondary-bg);
+--pagination-disabled-border-color: var(--border-color);
+
+
+/* ===== POPOVER ===== */
+--popover-zindex: 1060;
+--popover-max-width: 276px;
+--popover-font-size: 0.875rem;
+--popover-bg: var(--secondary-bg);
+--popover-border-width: 1px;
+--popover-border-color: var(--border-color-translucent);
+--popover-border-radius: 0.3rem;
+--popover-inner-border-radius: calc(0.3rem - 1px);
+--popover-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.4);
+--popover-header-padding-x: 1rem;
+--popover-header-padding-y: 0.5rem;
+--popover-header-font-size: 1rem;
+--popover-header-color: ;
+--popover-header-bg: var(--tertiary-bg);
+--popover-body-padding-x: 1rem;
+--popover-body-padding-y: 1rem;
+--popover-body-color: var(--body-color);
+--popover-arrow-width: 1rem;
+--popover-arrow-height: 0.5rem;
+--popover-arrow-border: var(--popover-border-color);
+
+
+/* ===== PROGRESS ===== */
+--progress-height: 1rem;
+--progress-font-size: 0.75rem;
+--progress-bg: var(--secondary-bg);
+--progress-border-radius: 0.25rem;
+--progress-box-shadow: inset 0 1px 2px rgba(var(--black-rgb), 0.3);
+--progress-bar-color: var(--body-color);
+--progress-bar-bg: hsl(240, 98%, 40%);
+--progress-bar-transition: width 0.6s ease;
+
+
+/* ===== SPINNER ===== */
+--spinner-width: 2rem;
+--spinner-height: 2rem;
+--spinner-vertical-align: -0.125em;
+--spinner-border-width: 0.25em;
+--spinner-animation-speed: 0.75s;
+
+
+/* ===== TABLE ===== */
+--table-color: var(--body-color);
+--table-bg: transparent;
+--table-border-color: var(--border-color);
+--table-accent-bg: transparent;
+--table-striped-color: var(--body-color);
+--table-striped-bg: rgba(var(--white-rgb), var(--opacity-5));
+--table-active-color: var(--body-color);
+--table-active-bg: rgba(var(--white-rgb), 0.1);
+
+
+/* ===== TOAST ===== */
+--toast-zindex: 1090;
+--toast-padding-x: 0.75rem;
+--toast-padding-y: 0.5rem;
+--toast-spacing: 1em;
+--toast-max-width: 350px;
+--toast-font-size: 0.875rem;
+--toast-color: ;
+--toast-bg: rgba(21, 27, 34, 0.9);
+--toast-border-width: 1px;
+--toast-border-color: var(--border-color-translucent);
+--toast-border-radius: 0.25rem;
+--toast-box-shadow: 0 0.5rem 1rem var(--shadow-color-medium);
+--toast-header-color: var(--gray-600);
+--toast-header-bg: rgba(21, 27, 34, 0.85);
+--toast-header-border-color: rgba(var(--white-rgb), var(--opacity-10));
+
+
+/* ===== TOOLTIP ===== */
+--tooltip-zindex: 1070;
+--tooltip-max-width: 200px;
+--tooltip-padding-x: 0.5rem;
+--tooltip-padding-y: 0.25rem;
+--tooltip-margin: ;
+--tooltip-font-size: 0.875rem;
+--tooltip-color: var(--body-color);
+--tooltip-bg: hsl(0, 0%, 0%);
+--tooltip-border-radius: 0.25rem;
+--tooltip-opacity: 0.9;
+--tooltip-arrow-width: 0.8rem;
+--tooltip-arrow-height: 0.4rem;
+
+
+/* ===== BOOTSTRAP PALETTE ===== */
+--primary: #010156;
+--secondary: #48525d;
+--success: #4aa664;
+--info: #4f7aa0;
+--warning: #c77a00;
+--danger: #c23a31;
+--light: #1b2027;
+--dark: #0f1318;
+--primary-rgb: 1,1,86;
+--secondary-rgb: 72,82,93;
+--success-rgb: 74,166,100;
+--info-rgb: 79,122,160;
+--warning-rgb: 199,122,0;
+--danger-rgb: 194,58,49;
+--light-rgb: 27,32,39;
+--dark-rgb: 15,19,24;
+--primary-text-emphasis: #c7ccff;
+--secondary-text-emphasis: #cfd6de;
+--success-text-emphasis: #bde8c9;
+--info-text-emphasis: #bcd6ee;
+--warning-text-emphasis: #ffd9a6;
+--danger-text-emphasis: #ffb7b2;
+--light-text-emphasis: #d2d8df;
+--dark-text-emphasis: #d2d8df;
+--primary-bg-subtle: #0b1030;
+--secondary-bg-subtle: #1e2430;
+--success-bg-subtle: #0f2a1b;
+--info-bg-subtle: #0d2232;
+--warning-bg-subtle: #2a1e06;
+--danger-bg-subtle: #2d1110;
+--light-bg-subtle: #12161d;
+--dark-bg-subtle: #1e2430;
+--primary-border-subtle: #2b3a7a;
+--secondary-border-subtle: #2b323b;
+--success-border-subtle: #2b5b40;
+--info-border-subtle: #254861;
+--warning-border-subtle: #5a3c0e;
+--danger-border-subtle: #5c2723;
+--light-border-subtle: #222831;
+--dark-border-subtle: #2b323b;
+
+
+/* ===== HERO / BANNER OVERLAY ===== */
+--hero-height: 70vh;
+--hero-color: var(--body-color);
+--hero-bg-repeat: no-repeat;
+--hero-bg-attachment: fixed;
+--hero-bg-position: top center;
+--hero-bg-size: cover;
+--hero-border-bottom: solid var(--accent-color-secondary);
+--hero-overlay-bg: hsla(0, 0%, 0%, 0.3);
+--hero-overlay-bg-position: center;
+--hero-overlay-bg-size: cover;
+--hero-overlay-padding: 1em;
+--hero-overlay-text-align: center;
+--hero-overlay-text-color: var(--body-color);
+
+
+/* ===== HERO VARIANTS ===== */
+/* Primary — deep navy, dark overlay */
+--hero-primary-bg-color: #0d1e3a;
+--hero-primary-overlay: linear-gradient(rgba(13, 30, 58, .65), rgba(13, 30, 58, .65));
+--hero-primary-color: #f1f5f9;
+
+/* Secondary — darker navy, heavier overlay */
+--hero-secondary-bg-color: #080f1e;
+--hero-secondary-overlay: linear-gradient(rgba(8, 15, 30, .80), rgba(8, 15, 30, .80));
+--hero-secondary-color: #f1f5f9;
+
+
+/* ===== HERO CARD (inner .hero element) ===== */
+/* Default card — uses primary variant values */
+--hero-card-bg: var(--hero-primary-bg-color);
+--hero-card-color: white;
+--hero-card-overlay: var(--hero-primary-overlay);
+--hero-card-border-radius: .5rem;
+--hero-card-padding-x: 2rem;
+--hero-card-padding-y: 3rem;
+--hero-card-max-width: 800px;
+
+/* Alternative card — uses secondary variant values */
+--hero-alt-card-bg: var(--hero-secondary-bg-color);
+--hero-alt-card-color: var(--hero-secondary-color);
+--hero-alt-card-overlay: var(--hero-secondary-overlay);
+--hero-alt-card-border-radius: .5rem;
+--hero-alt-card-padding-x: 2rem;
+--hero-alt-card-padding-y: 3rem;
+--hero-alt-card-max-width: 600px;
+
+
+/* ===== BLOCK COLORS (top-a / top-b / bottom-a / bottom-b) ===== */
+--block-color-1: var(--secondary-bg);
+--block-text-1:  var(--body-color);
+
+--block-color-2: var(--accent-color-primary);
+--block-text-2:  #fff;
+
+--block-color-3: rgba(238, 194, 52, .15);
+--block-text-3:  var(--body-color);
+
+--block-color-4: rgba(74, 166, 100, .15);
+--block-text-4:  var(--body-color);
+
+
+/* ===== BLOCK COLOR OVERRIDES ===== */
+--block-highlight-bg:   var(--accent-color-primary);
+--block-highlight-text: #fff;
+
+--block-cta-bg:         var(--color-primary);
+--block-cta-text:       #f1f5f9;
+
+--block-alert-bg:       var(--danger, #c23a31);
+--block-alert-text:     #fff;
+
+
+/* ===== FOOTER ===== */
+--footer-padding-top: 1rem;
+--footer-padding-bottom: 80px;
+--footer-grid-padding-y: 2.5rem;
+--footer-grid-padding-x: 0.5em;
+
+
+/* ===== THEME FAB ===== */
+--theme-fab-bg: #e6ebf1;
+--theme-fab-color: #0e1318;
+--theme-fab-btn-bg: transparent;
+--theme-fab-border: rgba(0, 0, 0, 0.15);
+
+
+/* ===== OFFLINE PAGE ===== */
+--offline-card-bg: rgba(0, 0, 0, 0.6);
+
+
+/* ===== COMPONENT-SPECIFIC COLORS ===== */
+--mod-finder-link-hover: #5a6470;
+--form-legend-color: #9fa6ad;
+--border-gray: #3a4250;
+--subhead-color: #9fa6ad;
+--box-shadow-gray: #1a2027;
+--btn-active-text-gray: #7a8490;
+--indicator-success-bg: var(--success);
+--item-list-color: #2a2f34;
+--notification-badge-bg: var(--danger);
+--content-bg-gray: #2b323b;
+--taba-btn-green: #5a9c2f;
+--taba-btn-blue: #3d75a8;
+--taba-btn-red: #c43620;
+--taba-btn-gray: #6a7080;
+--taba-msg-bg: #1e2430;
+--toc-link-color: #9fa6ad;
+--toc-link-active-color: #91a4ff;
+--choices-disabled-bg: #2b323b;
+--choices-input-bg: var(--body-bg);
+--choices-border-light: #48525d;
+--choices-arrow-color: #9fa6ad;
+--choices-inner-bg: #1a2027;
+--choices-focused-border: #5472ff;
+--choices-dropdown-bg: var(--body-bg);
+--choices-item-bg: #1a5f75;
+--choices-item-border: #1a748f;
+--choices-item-hover-bg: #1a748f;
+--choices-item-hover-border: #1a8aa8;
+--choices-item-disabled-bg: #48525d;
+--choices-item-disabled-border: #36404a;
+--choices-item-highlighted: #2b323b;
+--choices-input-inner-bg: #1a2027;
+
+
 /* ===== VIRTUEMART (VM) ===== */
 /* VM Surfaces */
 --vm-surface: var(--secondary-bg);
@@ -498,6 +878,7 @@ color-scheme: dark;
 --vm-vendor-menu-link-active: var(--primary);
 --vm-vendor-menu-hover-bg: var(--tertiary-bg);
 
+
 /* ===== GABLE ===== */
 --gab-blue: #4d9fff;
 --gab-green: #5cb85c;
@@ -507,335 +888,6 @@ color-scheme: dark;
 --gab-gray2: #adb5bd;
 --gab-gray3: #ced4da;
 
-/* ===== HERO / BANNER OVERLAY ===== */
---hero-height: 70vh;
---hero-color: var(--body-color);
---hero-bg-repeat: no-repeat;
---hero-bg-attachment: fixed;
---hero-bg-position: top center;
---hero-bg-size: cover;
---hero-border-bottom: solid var(--accent-color-secondary);
---hero-overlay-bg: hsla(0, 0%, 0%, 0.3);
---hero-overlay-bg-position: center;
---hero-overlay-bg-size: cover;
---hero-overlay-padding: 1em;
---hero-overlay-text-align: center;
---hero-overlay-text-color: var(--body-color);
-
-/* ===== HERO VARIANTS ===== */
-/* Primary — deep navy, dark overlay */
---hero-primary-bg-color: #0d1e3a;
---hero-primary-overlay: linear-gradient(rgba(13, 30, 58, .65), rgba(13, 30, 58, .65));
---hero-primary-color: #f1f5f9;
-
-/* Secondary — darker navy, heavier overlay */
---hero-secondary-bg-color: #080f1e;
---hero-secondary-overlay: linear-gradient(rgba(8, 15, 30, .80), rgba(8, 15, 30, .80));
---hero-secondary-color: #f1f5f9;
-
-/* ===== HERO CARD (inner .hero element) ===== */
-/* Default card — uses primary variant values */
---hero-card-bg: var(--hero-primary-bg-color);
---hero-card-color: white;
---hero-card-overlay: var(--hero-primary-overlay);
---hero-card-border-radius: .5rem;
---hero-card-padding-x: 2rem;
---hero-card-padding-y: 3rem;
---hero-card-max-width: 800px;
-
-/* Alternative card — uses secondary variant values */
---hero-alt-card-bg: var(--hero-secondary-bg-color);
---hero-alt-card-color: var(--hero-secondary-color);
---hero-alt-card-overlay: var(--hero-secondary-overlay);
---hero-alt-card-border-radius: .5rem;
---hero-alt-card-padding-x: 2rem;
---hero-alt-card-padding-y: 3rem;
---hero-alt-card-max-width: 600px;
-
-/* ===== BLOCK COLORS (top-a / top-b / bottom-a / bottom-b) ===== */
---block-color-1: var(--secondary-bg);
---block-text-1:  var(--body-color);
-
---block-color-2: var(--accent-color-primary);
---block-text-2:  #fff;
-
---block-color-3: rgba(238, 194, 52, .15);
---block-text-3:  var(--body-color);
-
---block-color-4: rgba(74, 166, 100, .15);
---block-text-4:  var(--body-color);
-
-/* ===== BLOCK COLOR OVERRIDES ===== */
---block-highlight-bg:   var(--accent-color-primary);
---block-highlight-text: #fff;
-
---block-cta-bg:         var(--color-primary);
---block-cta-text:       #f1f5f9;
-
---block-alert-bg:       var(--danger, #c23a31);
---block-alert-text:     #fff;
-
-/* ===== OFFCANVAS ===== */
---offcanvas-zindex: 1045;
---offcanvas-width: 400px;
---offcanvas-height: 30vh;
---offcanvas-padding-x: 1rem;
---offcanvas-padding-y: 1rem;
---offcanvas-color: var(--body-color);
---offcanvas-bg: var(--body-bg);
---offcanvas-border-width: 1px;
---offcanvas-border-color: var(--border-color-translucent);
---offcanvas-box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.3);
-
-/* ===== ACCORDION ===== */
---accordion-color: var(--body-color);
---accordion-bg: var(--body-bg);
---accordion-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
---accordion-border-color: var(--border-color);
---accordion-border-width: 1px;
---accordion-border-radius: 0.25rem;
---accordion-inner-border-radius: calc(0.25rem - 1px);
---accordion-btn-padding-x: 1.25rem;
---accordion-btn-padding-y: 1rem;
---accordion-btn-color: var(--body-color);
---accordion-btn-bg: var(--accordion-bg);
---accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23e6ebf1'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
---accordion-btn-icon-width: 1.25rem;
---accordion-btn-icon-transform: rotate(-180deg);
---accordion-btn-icon-transition: transform 0.2s ease-in-out;
---accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%238ab4f8'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
---accordion-btn-focus-border-color: var(--input-focus-border-color);
---accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(84, 114, 255, 0.25);
---accordion-body-padding-x: 1.25rem;
---accordion-body-padding-y: 1rem;
---accordion-active-color: var(--link-color);
---accordion-active-bg: var(--secondary-bg);
-
-/* ===== BREADCRUMB ===== */
---breadcrumb-padding-x: 0;
---breadcrumb-padding-y: 0;
---breadcrumb-margin-bottom: 1rem;
---breadcrumb-bg: ;
---breadcrumb-border-radius: ;
---breadcrumb-divider-color: var(--gray-600);
---breadcrumb-item-padding-x: 0.5rem;
---breadcrumb-item-active-color: var(--link-color);
-
-/* ===== PAGINATION ===== */
---pagination-padding-x: 0.75rem;
---pagination-padding-y: 0.375rem;
---pagination-font-size: 1rem;
---pagination-color: var(--link-color);
---pagination-bg: var(--secondary-bg);
---pagination-border-width: 1px;
---pagination-border-color: var(--border-color);
---pagination-border-radius: 0.25rem;
---pagination-focus-color: var(--link-active-color);
---pagination-focus-bg: var(--tertiary-bg);
---pagination-focus-box-shadow: 0 0 0 0.25rem rgba(84, 114, 255, 0.25);
---pagination-active-color: var(--body-color);
---pagination-active-bg: hsl(240, 98%, 17%);
---pagination-active-border-color: hsl(240, 98%, 17%);
---pagination-disabled-color: var(--gray-600);
---pagination-disabled-bg: var(--secondary-bg);
---pagination-disabled-border-color: var(--border-color);
-
-/* ===== BADGE ===== */
---badge-padding-x: 0.65em;
---badge-padding-y: 0.35em;
---badge-font-size: 0.75em;
---badge-font-weight: 700;
---badge-color: var(--body-color);
---badge-border-radius: 0.25rem;
-
-/* ===== ALERT ===== */
---alert-bg: transparent;
---alert-padding-x: 1rem;
---alert-padding-y: 1rem;
---alert-margin-bottom: 1rem;
---alert-color: #000;
---alert-border-color: transparent;
---alert-border: 1px solid var(--alert-border-color);
---alert-border-radius: 0.25rem;
-
-/* ===== PROGRESS ===== */
---progress-height: 1rem;
---progress-font-size: 0.75rem;
---progress-bg: var(--secondary-bg);
---progress-border-radius: 0.25rem;
---progress-box-shadow: inset 0 1px 2px rgba(var(--black-rgb), 0.3);
---progress-bar-color: var(--body-color);
---progress-bar-bg: hsl(240, 98%, 40%);
---progress-bar-transition: width 0.6s ease;
-
-/* ===== LIST GROUP ===== */
---list-group-color: var(--body-color);
---list-group-bg: var(--secondary-bg);
---list-group-border-color: rgba(var(--white-rgb), 0.125);
---list-group-border-width: 1px;
---list-group-border-radius: 0.25rem;
---list-group-item-padding-x: 1rem;
---list-group-item-padding-y: 0.5rem;
---list-group-action-color: var(--gray-800);
---list-group-action-active-color: var(--body-color);
---list-group-action-active-bg: var(--tertiary-bg);
---list-group-disabled-color: var(--gray-600);
---list-group-disabled-bg: var(--secondary-bg);
---list-group-active-color: var(--body-color);
---list-group-active-bg: hsl(240, 98%, 17%);
---list-group-active-border-color: hsl(240, 98%, 17%);
-
-/* ===== DROPDOWN ===== */
---dropdown-zindex: 1000;
---dropdown-min-width: 10rem;
---dropdown-padding-x: 0;
---dropdown-padding-y: 0.5rem;
---dropdown-spacer: 0.125rem;
---dropdown-font-size: 1rem;
---dropdown-color: var(--body-color);
---dropdown-bg: var(--secondary-bg);
---dropdown-border-color: var(--border-color-translucent);
---dropdown-border-radius: 0.25rem;
---dropdown-border-width: 1px;
---dropdown-inner-border-radius: calc(0.25rem - 1px);
---dropdown-divider-bg: var(--border-color-translucent);
---dropdown-divider-margin-y: 0.5rem;
---dropdown-box-shadow: 0 0.5rem 1rem var(--shadow-color-medium);
---dropdown-link-color: var(--body-color);
---dropdown-link-active-color: var(--body-color);
---dropdown-link-active-bg: hsl(240, 98%, 17%);
---dropdown-link-disabled-color: var(--gray-600);
---dropdown-item-padding-x: 1rem;
---dropdown-item-padding-y: 0.25rem;
---dropdown-header-color: var(--gray-600);
---dropdown-header-padding-x: 1rem;
---dropdown-header-padding-y: 0.5rem;
-
-/* ===== TOAST ===== */
---toast-zindex: 1090;
---toast-padding-x: 0.75rem;
---toast-padding-y: 0.5rem;
---toast-spacing: 1em;
---toast-max-width: 350px;
---toast-font-size: 0.875rem;
---toast-color: ;
---toast-bg: rgba(21, 27, 34, 0.9);
---toast-border-width: 1px;
---toast-border-color: var(--border-color-translucent);
---toast-border-radius: 0.25rem;
---toast-box-shadow: 0 0.5rem 1rem var(--shadow-color-medium);
---toast-header-color: var(--gray-600);
---toast-header-bg: rgba(21, 27, 34, 0.85);
---toast-header-border-color: rgba(var(--white-rgb), var(--opacity-10));
-
-/* ===== MODAL ===== */
---modal-zindex: 1050;
---modal-width: 500px;
---modal-padding: 1rem;
---modal-margin: 0.5rem;
---modal-color: ;
---modal-bg: var(--secondary-bg);
---modal-border-color: var(--border-color-translucent);
---modal-border-width: 1px;
---modal-border-radius: 0.3rem;
---modal-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.3);
---modal-inner-border-radius: calc(0.3rem - 1px);
---modal-header-padding-x: 1rem;
---modal-header-padding-y: 1rem;
---modal-header-padding: 1rem 1rem;
---modal-header-border-color: var(--border-color);
---modal-header-border-width: 1px;
---modal-title-line-height: 1.5;
---modal-footer-gap: 0.5rem;
---modal-footer-bg: ;
---modal-footer-border-color: var(--border-color);
---modal-footer-border-width: 1px;
-
-/* ===== TOOLTIP ===== */
---tooltip-zindex: 1070;
---tooltip-max-width: 200px;
---tooltip-padding-x: 0.5rem;
---tooltip-padding-y: 0.25rem;
---tooltip-margin: ;
---tooltip-font-size: 0.875rem;
---tooltip-color: var(--body-color);
---tooltip-bg: hsl(0, 0%, 0%);
---tooltip-border-radius: 0.25rem;
---tooltip-opacity: 0.9;
---tooltip-arrow-width: 0.8rem;
---tooltip-arrow-height: 0.4rem;
-
-/* ===== POPOVER ===== */
---popover-zindex: 1060;
---popover-max-width: 276px;
---popover-font-size: 0.875rem;
---popover-bg: var(--secondary-bg);
---popover-border-width: 1px;
---popover-border-color: var(--border-color-translucent);
---popover-border-radius: 0.3rem;
---popover-inner-border-radius: calc(0.3rem - 1px);
---popover-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.4);
---popover-header-padding-x: 1rem;
---popover-header-padding-y: 0.5rem;
---popover-header-font-size: 1rem;
---popover-header-color: ;
---popover-header-bg: var(--tertiary-bg);
---popover-body-padding-x: 1rem;
---popover-body-padding-y: 1rem;
---popover-body-color: var(--body-color);
---popover-arrow-width: 1rem;
---popover-arrow-height: 0.5rem;
---popover-arrow-border: var(--popover-border-color);
-
-/* ===== SPINNER ===== */
---spinner-width: 2rem;
---spinner-height: 2rem;
---spinner-vertical-align: -0.125em;
---spinner-border-width: 0.25em;
---spinner-animation-speed: 0.75s;
-
-/* ===== NAV TABS ===== */
---nav-tabs-border-width: 1px;
---nav-tabs-border-color: var(--border-color);
---nav-tabs-border-radius: 0.25rem;
---nav-tabs-link-active-color: var(--body-color);
---nav-tabs-link-active-bg: var(--secondary-bg);
---nav-tabs-link-active-border-color: var(--border-color) var(--border-color) var(--secondary-bg);
-
-/* ===== NAV PILLS ===== */
---nav-pills-border-radius: 0.25rem;
---nav-pills-link-active-color: var(--body-color);
---nav-pills-link-active-bg: hsl(240, 98%, 17%);
-
-/* ===== TABLE ===== */
---table-color: var(--body-color);
---table-bg: transparent;
---table-border-color: var(--border-color);
---table-accent-bg: transparent;
---table-striped-color: var(--body-color);
---table-striped-bg: rgba(var(--white-rgb), var(--opacity-5));
---table-active-color: var(--body-color);
---table-active-bg: rgba(var(--white-rgb), 0.1);
-
-/* ===== FOOTER ===== */
---footer-padding-top: 1rem;
---footer-padding-bottom: 80px;
---footer-grid-padding-y: 2.5rem;
---footer-grid-padding-x: 0.5em;
-
-/* ===== BACKDROP ===== */
---backdrop-zindex: 1040;
---backdrop-bg: hsl(0, 0%, 0%);
---backdrop-opacity: 0.5;
-
-/* ===== THEME FAB ===== */
---theme-fab-bg: #e6ebf1;
---theme-fab-color: #0e1318;
---theme-fab-btn-bg: transparent;
---theme-fab-border: rgba(0, 0, 0, 0.15);
-
-/* ===== OFFLINE PAGE ===== */
---offline-card-bg: rgba(0, 0, 0, 0.6);
 }
 
 .btn {
diff --git a/src/media/css/theme/light.standard.css b/src/media/css/theme/light.standard.css
index 97c35c8..ae01b7b 100644
--- a/src/media/css/theme/light.standard.css
+++ b/src/media/css/theme/light.standard.css
@@ -12,25 +12,144 @@
 :root[data-bs-theme="light"] {
 color-scheme: light;
 
+
 /* ===== BRAND & THEME COLORS ===== */
 --color-primary: #112855;
 --accent-color-primary: #3f8ff0;
 --accent-color-secondary: #6fb3ff;
 
+
+/* ===== TYPOGRAPHY & BODY ===== */
+--font-sans-serif: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
+--font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+--body-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
+--body-font-size: 1rem;
+--body-font-weight: 400;
+--body-line-height: 1.5;
+--body-color: #22262a;
+--body-color-rgb: 34, 38, 42;
+--body-bg: #fff;
+--body-bg-rgb: 255, 255, 255;
+--heading-color: inherit;
+--emphasis-color: #000;
+--emphasis-color-rgb: 0, 0, 0;
+--secondary-color: #22262abf;
+--secondary-color-rgb: 34, 38, 42;
+--tertiary-color: #22262a80;
+--tertiary-color-rgb: 34, 38, 42;
+--muted-color: #6d757e;
+--code-color: black;
+--code-color-ink: var(--code-color, #e93f8e);
+--code-bg-color: lightgreen;
+--highlight-color: #22262a;
+--highlight-bg: #fbeea8;
+
+
+/* ===== STANDARD COLORS ===== */
+--blue: #010156;
+--indigo: #6812f3;
+--purple: #6f42c2;
+--pink: #e93f8e;
+--red: #a51f18;
+--orange: #fd7e17;
+--yellow: #ad6200;
+--green: #448344;
+--teal: #5abfdd;
+--cyan: #30638d;
+--black: #000;
+--white: #fff;
+
+
+/* ===== GRAY SCALE ===== */
+--gray-100: #f9fafb;
+--gray-200: #eaedf0;
+--gray-300: #dfe3e7;
+--gray-400: #ced4da;
+--gray-500: #adb5bd;
+--gray-600: #6d757e;
+--gray-700: #484f56;
+--gray-800: #353b41;
+--gray-900: #22262a;
+--white-rgb: 255, 255, 255;
+--black-rgb: 0, 0, 0;
+
+
+/* ===== OPACITY UTILITIES ===== */
+--opacity-0: 0;
+--opacity-5: 0.05;
+--opacity-10: 0.1;
+--opacity-15: 0.15;
+--opacity-20: 0.2;
+--opacity-25: 0.25;
+--opacity-30: 0.3;
+--opacity-50: 0.5;
+--opacity-75: 0.75;
+--opacity-100: 1;
+
+
+/* ===== LAYOUT & SPACING ===== */
+--padding-x: 0.15rem;
+--padding-y: 0.15rem;
+--bg-opacity: 1;
+--nav-toggle-size: 3rem;
+--gradient: linear-gradient(180deg, #ffffff26, #fff0);
+--secondary-bg: #eaedf0;
+--secondary-bg-rgb: 234, 237, 240;
+--tertiary-bg: #f9fafb;
+--tertiary-bg-rgb: 249, 250, 251;
+--hr-color: var(--border-color, #dfe3e7);
+--border-color-soft: var(--border-color, #dfe3e7);
+--kbd-bg: var(--secondary-bg, #eaedf0);
+--kbd-ink: var(--body-bg, #fff);
+--toc-bg: var(--secondary-bg, #eaedf0);
+--toc-ink: var(--color-primary, #112855);
+--selection-bg: var(--highlight-bg, #fbeea8);
+--selection-ink: var(--body-color, #22262a);
+--border: 5px;
+
+
+/* ===== BREAKPOINTS ===== */
+--bp-xs: 0;
+--bp-sm: 576px;
+--bp-md: 768px;
+--bp-lg: 992px;
+--bp-xl: 1200px;
+
+
+/* ===== BORDERS ===== */
+--border-width: 1px;
+--border-style: solid;
+--border-color: #dfe3e7;
+--border-color-translucent: #0000002d;
+--border-radius: .25rem;
+--border-radius-sm: .2rem;
+--border-radius-lg: .3rem;
+--border-radius-xl: .3rem;
+--border-radius-xxl: 2rem;
+--border-radius-2xl: var(--border-radius-xxl)*2;
+--border-radius-pill: 50rem;
+
+
+/* ===== SHADOWS ===== */
+--box-shadow: 0 .5rem 1rem #00000026;
+--box-shadow-sm: 0 .125rem .25rem #00000013;
+--box-shadow-lg: 0 1rem 3rem #0000002d;
+--box-shadow-inset: inset 0 1px 2px #00000013;
+
+
+/* ===== COMMON SHADOW COLORS ===== */
+--shadow-color-light: rgba(var(--black-rgb), var(--opacity-15));
+--shadow-color-medium: rgba(var(--black-rgb), var(--opacity-25));
+--shadow-color-dark: rgba(var(--black-rgb), var(--opacity-30));
+--border-color-translucent: rgba(var(--black-rgb), var(--opacity-10));
+--highlight-translucent: rgba(var(--white-rgb), var(--opacity-15));
+
+
 /* ===== NAVIGATION ===== */
 --mainmenu-nav-link-color: white;
 --nav-text-color: white;
 --nav-bg-color: var(--color-link);
 
-/* ===== LINKS ===== */
---color-link: #224FAA;
---color-hover: var(--accent-color-primary);
---link-color: #224faa;
---link-color-rgb: 34, 79, 170;
---link-decoration: underline;
---link-hover-color: #424077;
---link-hover-color-rgb: 66, 64, 119;
---link-active-color: var(--link-color);
 
 /* ===== NAVBAR ===== */
 --navbar-padding-x: 1rem;
@@ -58,135 +177,17 @@ color-scheme: light;
 --nav-link-active-color: var(--mainmenu-nav-link-color);
 --nav-link-disabled-color: #6c757d;
 
-/* ===== TYPOGRAPHY & BODY ===== */
---font-sans-serif: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
---font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
---body-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
---body-font-size: 1rem;
---body-font-weight: 400;
---body-line-height: 1.5;
---body-color: #22262a;
---body-color-rgb: 34, 38, 42;
---body-bg: #fff;
---body-bg-rgb: 255, 255, 255;
---heading-color: inherit;
---emphasis-color: #000;
---emphasis-color-rgb: 0, 0, 0;
---secondary-color: #22262abf;
---secondary-color-rgb: 34, 38, 42;
---tertiary-color: #22262a80;
---tertiary-color-rgb: 34, 38, 42;
---muted-color: #6d757e;
---code-color: black;
---code-color-ink: var(--code-color, #e93f8e);
---code-bg-color: lightgreen;
---highlight-color: #22262a;
---highlight-bg: #fbeea8;
 
-/* ===== LAYOUT & SPACING ===== */
---padding-x: 0.15rem;
---padding-y: 0.15rem;
---bg-opacity: 1;
---nav-toggle-size: 3rem;
---gradient: linear-gradient(180deg, #ffffff26, #fff0);
---secondary-bg: #eaedf0;
---secondary-bg-rgb: 234, 237, 240;
---tertiary-bg: #f9fafb;
---tertiary-bg-rgb: 249, 250, 251;
---hr-color: var(--border-color, #dfe3e7);
---border-color-soft: var(--border-color, #dfe3e7);
---kbd-bg: var(--secondary-bg, #eaedf0);
---kbd-ink: var(--body-bg, #fff);
---toc-bg: var(--secondary-bg, #eaedf0);
---toc-ink: var(--color-primary, #112855);
---selection-bg: var(--highlight-bg, #fbeea8);
---selection-ink: var(--body-color, #22262a);
---border: 5px;
+/* ===== LINKS ===== */
+--color-link: #224FAA;
+--color-hover: var(--accent-color-primary);
+--link-color: #224faa;
+--link-color-rgb: 34, 79, 170;
+--link-decoration: underline;
+--link-hover-color: #424077;
+--link-hover-color-rgb: 66, 64, 119;
+--link-active-color: var(--link-color);
 
-/* ===== BREAKPOINTS ===== */
---bp-xs: 0;
---bp-sm: 576px;
---bp-md: 768px;
---bp-lg: 992px;
---bp-xl: 1200px;
-
-/* ===== BOOTSTRAP PALETTE ===== */
---primary: #010156;
---secondary: #6d757e;
---success: #448344;
---info: #30638d;
---warning: #ad6200;
---danger: #a51f18;
---light: #f9fafb;
---dark: #353b41;
---primary-rgb: 1, 1, 86;
---secondary-rgb: 109, 117, 126;
---success-rgb: 68, 131, 68;
---info-rgb: 48, 99, 141;
---warning-rgb: 173, 98, 0;
---danger-rgb: 165, 31, 24;
---light-rgb: 249, 250, 251;
---dark-rgb: 53, 59, 65;
---primary-text-emphasis: #002;
---secondary-text-emphasis: #2c2f32;
---success-text-emphasis: #1b351b;
---info-text-emphasis: #132838;
---warning-text-emphasis: #452700;
---danger-text-emphasis: #420c09;
---light-text-emphasis: #484f56;
---dark-text-emphasis: #484f56;
---primary-bg-subtle: #ccd;
---secondary-bg-subtle: #e2e3e5;
---success-bg-subtle: #dae6da;
---info-bg-subtle: #d6e0e8;
---warning-bg-subtle: #efe0cc;
---danger-bg-subtle: #edd2d1;
---light-bg-subtle: #fcfcfd;
---dark-bg-subtle: #ced4da;
---primary-border-subtle: #99b;
---secondary-border-subtle: #c5c8cb;
---success-border-subtle: #b4ceb4;
---info-border-subtle: #acc1d1;
---warning-border-subtle: #dec099;
---danger-border-subtle: #dba5a2;
---light-border-subtle: #eaedf0;
---dark-border-subtle: #adb5bd;
-
-/* ===== ALERT LINK COLORS ===== */
---alert-primary-link-color: #01012a;
---alert-secondary-link-color: #34383d;
---alert-success-link-color: #213f21;
---alert-info-link-color: #172f44;
---alert-warning-link-color: #532f00;
---alert-danger-link-color: #4f0f0b;
---alert-light-link-color: #505050;
---alert-dark-link-color: #1a1c1f;
-
-/* ===== LIST GROUP ITEM COLORS ===== */
---list-group-item-primary-color: #010134;
---list-group-item-primary-bg: #ccccdd;
---list-group-item-primary-active-bg: #b8b8c7;
---list-group-item-secondary-color: #41464c;
---list-group-item-secondary-bg: #e2e3e5;
---list-group-item-secondary-active-bg: #cbccce;
---list-group-item-success-color: #294f29;
---list-group-item-success-bg: #dae6da;
---list-group-item-success-active-bg: #c4cfc4;
---list-group-item-info-color: #1d3b55;
---list-group-item-info-bg: #d6e0e8;
---list-group-item-info-active-bg: #c1cad1;
---list-group-item-warning-color: #683b00;
---list-group-item-warning-bg: #efe0cc;
---list-group-item-warning-active-bg: #d7cab8;
---list-group-item-danger-color: #63130e;
---list-group-item-danger-bg: #edd2d1;
---list-group-item-danger-active-bg: #d5bdbc;
---list-group-item-light-color: #646464;
---list-group-item-light-bg: #fefefe;
---list-group-item-light-active-bg: #e5e5e5;
---list-group-item-dark-color: #202327;
---list-group-item-dark-bg: #d7d8d9;
---list-group-item-dark-active-bg: #c2c2c3;
 
 /* ===== LINK UTILITY COLORS ===== */
 --link-primary-color: hsl(240, 98%, 17%);
@@ -206,85 +207,6 @@ color-scheme: light;
 --link-dark-color: hsl(210, 10%, 23%);
 --link-dark-hover-color: #2a2f34;
 
-/* ===== COMPONENT-SPECIFIC COLORS ===== */
---mod-finder-link-hover: #e6e6e6;
---form-legend-color: #495057;
---border-gray: #b2bfcd;
---subhead-color: #495057;
---box-shadow-gray: #ddd;
---btn-active-text-gray: #A0A0A0;
---indicator-success-bg: var(--success);
---item-list-color: #F5F5F5;
---notification-badge-bg: var(--danger);
---content-bg-gray: #DDD;
---taba-btn-green: #7ac143;
---taba-btn-blue: #5091cd;
---taba-btn-red: #f44321;
---taba-btn-gray: #AAA;
---taba-msg-bg: #f5f5f5;
---toc-link-color: #767676;
---toc-link-active-color: #563d7c;
---choices-disabled-bg: #eaeaea;
---choices-input-bg: var(--white);
---choices-border-light: #ddd;
---choices-arrow-color: #333;
---choices-inner-bg: #f9f9f9;
---choices-focused-border: #b7b7b7;
---choices-dropdown-bg: var(--white);
---choices-item-bg: #00bcd4;
---choices-item-border: #00a5bb;
---choices-item-hover-bg: #00a5bb;
---choices-item-hover-border: #008fa1;
---choices-item-disabled-bg: #aaaaaa;
---choices-item-disabled-border: #919191;
---choices-item-highlighted: #f2f2f2;
---choices-input-inner-bg: #f9f9f9;
-
-/* ===== STANDARD COLORS ===== */
---blue: #010156;
---indigo: #6812f3;
---purple: #6f42c2;
---pink: #e93f8e;
---red: #a51f18;
---orange: #fd7e17;
---yellow: #ad6200;
---green: #448344;
---teal: #5abfdd;
---cyan: #30638d;
---black: #000;
---white: #fff;
-
-/* ===== GRAY SCALE ===== */
---gray-100: #f9fafb;
---gray-200: #eaedf0;
---gray-300: #dfe3e7;
---gray-400: #ced4da;
---gray-500: #adb5bd;
---gray-600: #6d757e;
---gray-700: #484f56;
---gray-800: #353b41;
---gray-900: #22262a;
---white-rgb: 255, 255, 255;
---black-rgb: 0, 0, 0;
-
-/* ===== OPACITY UTILITIES ===== */
---opacity-0: 0;
---opacity-5: 0.05;
---opacity-10: 0.1;
---opacity-15: 0.15;
---opacity-20: 0.2;
---opacity-25: 0.25;
---opacity-30: 0.3;
---opacity-50: 0.5;
---opacity-75: 0.75;
---opacity-100: 1;
-
-/* ===== COMMON SHADOW COLORS ===== */
---shadow-color-light: rgba(var(--black-rgb), var(--opacity-15));
---shadow-color-medium: rgba(var(--black-rgb), var(--opacity-25));
---shadow-color-dark: rgba(var(--black-rgb), var(--opacity-30));
---border-color-translucent: rgba(var(--black-rgb), var(--opacity-10));
---highlight-translucent: rgba(var(--white-rgb), var(--opacity-15));
 
 /* ===== HEADER BACKGROUND ===== */
 --header-background-image: url('../../../../../../media/templates/site/mokocassiopeia/images/bg.svg');
@@ -292,6 +214,7 @@ color-scheme: light;
 --header-background-repeat: repeat;
 --header-background-size: auto;
 
+
 /* ===== CONTAINER BACKGROUNDS ===== */
 /* Below Topbar Container */
 --container-below-topbar-bg-image: none;
@@ -357,24 +280,6 @@ color-scheme: light;
 --container-bottom-b-border: none;
 --container-bottom-b-border-radius: 0;
 
-/* ===== BORDERS ===== */
---border-width: 1px;
---border-style: solid;
---border-color: #dfe3e7;
---border-color-translucent: #0000002d;
---border-radius: .25rem;
---border-radius-sm: .2rem;
---border-radius-lg: .3rem;
---border-radius-xl: .3rem;
---border-radius-xxl: 2rem;
---border-radius-2xl: var(--border-radius-xxl)*2;
---border-radius-pill: 50rem;
-
-/* ===== SHADOWS ===== */
---box-shadow: 0 .5rem 1rem #00000026;
---box-shadow-sm: 0 .125rem .25rem #00000013;
---box-shadow-lg: 0 1rem 3rem #0000002d;
---box-shadow-inset: inset 0 1px 2px #00000013;
 
 /* ===== FOCUS & FORMS ===== */
 --focus-ring-width: .25rem;
@@ -395,10 +300,85 @@ color-scheme: light;
 --form-invalid-color: #a51f18;
 --form-invalid-border-color: #a51f18;
 
+
 /* ===== BUTTONS ===== */
 --btn-border-radius: var(--border-radius);
 --btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
 
+
+/* ===== ACCORDION ===== */
+--accordion-color: hsl(210, 11%, 15%);
+--accordion-bg: var(--body-bg);
+--accordion-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
+--accordion-border-color: var(--border-color);
+--accordion-border-width: 1px;
+--accordion-border-radius: 0.25rem;
+--accordion-inner-border-radius: calc(0.25rem - 1px);
+--accordion-btn-padding-x: 1.25rem;
+--accordion-btn-padding-y: 1rem;
+--accordion-btn-color: hsl(210, 11%, 15%);
+--accordion-btn-bg: var(--accordion-bg);
+--accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='hsl%28210, 11%25, 15%25%29'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
+--accordion-btn-icon-width: 1.25rem;
+--accordion-btn-icon-transform: rotate(-180deg);
+--accordion-btn-icon-transition: transform 0.2s ease-in-out;
+--accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230f244d'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
+--accordion-btn-focus-border-color: var(--input-focus-border-color);
+--accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(1, 1, 86, 0.25);
+--accordion-body-padding-x: 1.25rem;
+--accordion-body-padding-y: 1rem;
+--accordion-active-color: #0f244d;
+--accordion-active-bg: #e7eaee;
+
+
+/* ===== ALERT ===== */
+--alert-bg: transparent;
+--alert-padding-x: 1rem;
+--alert-padding-y: 1rem;
+--alert-margin-bottom: 1rem;
+--alert-color: #000;
+--alert-border-color: transparent;
+--alert-border: 1px solid var(--alert-border-color);
+--alert-border-radius: 0.25rem;
+
+
+/* ===== ALERT LINK COLORS ===== */
+--alert-primary-link-color: #01012a;
+--alert-secondary-link-color: #34383d;
+--alert-success-link-color: #213f21;
+--alert-info-link-color: #172f44;
+--alert-warning-link-color: #532f00;
+--alert-danger-link-color: #4f0f0b;
+--alert-light-link-color: #505050;
+--alert-dark-link-color: #1a1c1f;
+
+
+/* ===== BACKDROP ===== */
+--backdrop-zindex: 1040;
+--backdrop-bg: hsl(0, 0%, 0%);
+--backdrop-opacity: 0.5;
+
+
+/* ===== BADGE ===== */
+--badge-padding-x: 0.65em;
+--badge-padding-y: 0.35em;
+--badge-font-size: 0.75em;
+--badge-font-weight: 700;
+--badge-color: var(--body-bg);
+--badge-border-radius: 0.25rem;
+
+
+/* ===== BREADCRUMB ===== */
+--breadcrumb-padding-x: 0;
+--breadcrumb-padding-y: 0;
+--breadcrumb-margin-bottom: 1rem;
+--breadcrumb-bg: ;
+--breadcrumb-border-radius: ;
+--breadcrumb-divider-color: hsl(210, 7%, 46%);
+--breadcrumb-item-padding-x: 0.5rem;
+--breadcrumb-item-active-color: var(--link-color);
+
+
 /* ===== CARDS ===== */
 --card-spacer-y: 1rem;
 --card-spacer-x: 1rem;
@@ -418,6 +398,406 @@ color-scheme: light;
 --card-img-overlay-padding: 1rem;
 --card-group-margin: 0.75rem;
 
+
+/* ===== DROPDOWN ===== */
+--dropdown-zindex: 1000;
+--dropdown-min-width: 10rem;
+--dropdown-padding-x: 0;
+--dropdown-padding-y: 0.5rem;
+--dropdown-spacer: 0.125rem;
+--dropdown-font-size: 1rem;
+--dropdown-color: hsl(210, 11%, 15%);
+--dropdown-bg: var(--body-bg);
+--dropdown-border-color: var(--border-color-translucent);
+--dropdown-border-radius: 0.25rem;
+--dropdown-border-width: 1px;
+--dropdown-inner-border-radius: calc(0.25rem - 1px);
+--dropdown-divider-bg: var(--border-color-translucent);
+--dropdown-divider-margin-y: 0.5rem;
+--dropdown-box-shadow: 0 0.5rem 1rem var(--shadow-color-light);
+--dropdown-link-color: hsl(210, 11%, 15%);
+--dropdown-link-active-color: var(--body-bg);
+--dropdown-link-active-bg: hsl(240, 98%, 17%);
+--dropdown-link-disabled-color: hsl(210, 11%, 71%);
+--dropdown-item-padding-x: 1rem;
+--dropdown-item-padding-y: 0.25rem;
+--dropdown-header-color: hsl(210, 7%, 46%);
+--dropdown-header-padding-x: 1rem;
+--dropdown-header-padding-y: 0.5rem;
+
+
+/* ===== LIST GROUP ===== */
+--list-group-color: hsl(210, 11%, 15%);
+--list-group-bg: var(--body-bg);
+--list-group-border-color: rgba(var(--black-rgb), 0.125);
+--list-group-border-width: 1px;
+--list-group-border-radius: 0.25rem;
+--list-group-item-padding-x: 1rem;
+--list-group-item-padding-y: 0.5rem;
+--list-group-action-color: hsl(210, 9%, 31%);
+--list-group-action-active-color: hsl(210, 11%, 15%);
+--list-group-action-active-bg: hsl(210, 16%, 93%);
+--list-group-disabled-color: hsl(210, 7%, 46%);
+--list-group-disabled-bg: var(--body-bg);
+--list-group-active-color: var(--body-bg);
+--list-group-active-bg: hsl(240, 98%, 17%);
+--list-group-active-border-color: hsl(240, 98%, 17%);
+
+
+/* ===== LIST GROUP ITEM COLORS ===== */
+--list-group-item-primary-color: #010134;
+--list-group-item-primary-bg: #ccccdd;
+--list-group-item-primary-active-bg: #b8b8c7;
+--list-group-item-secondary-color: #41464c;
+--list-group-item-secondary-bg: #e2e3e5;
+--list-group-item-secondary-active-bg: #cbccce;
+--list-group-item-success-color: #294f29;
+--list-group-item-success-bg: #dae6da;
+--list-group-item-success-active-bg: #c4cfc4;
+--list-group-item-info-color: #1d3b55;
+--list-group-item-info-bg: #d6e0e8;
+--list-group-item-info-active-bg: #c1cad1;
+--list-group-item-warning-color: #683b00;
+--list-group-item-warning-bg: #efe0cc;
+--list-group-item-warning-active-bg: #d7cab8;
+--list-group-item-danger-color: #63130e;
+--list-group-item-danger-bg: #edd2d1;
+--list-group-item-danger-active-bg: #d5bdbc;
+--list-group-item-light-color: #646464;
+--list-group-item-light-bg: #fefefe;
+--list-group-item-light-active-bg: #e5e5e5;
+--list-group-item-dark-color: #202327;
+--list-group-item-dark-bg: #d7d8d9;
+--list-group-item-dark-active-bg: #c2c2c3;
+
+
+/* ===== MODAL ===== */
+--modal-zindex: 1050;
+--modal-width: 500px;
+--modal-padding: 1rem;
+--modal-margin: 0.5rem;
+--modal-color: ;
+--modal-bg: var(--body-bg);
+--modal-border-color: var(--border-color-translucent);
+--modal-border-width: 1px;
+--modal-border-radius: 0.3rem;
+--modal-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
+--modal-inner-border-radius: calc(0.3rem - 1px);
+--modal-header-padding-x: 1rem;
+--modal-header-padding-y: 1rem;
+--modal-header-padding: 1rem 1rem;
+--modal-header-border-color: var(--border-color);
+--modal-header-border-width: 1px;
+--modal-title-line-height: 1.5;
+--modal-footer-gap: 0.5rem;
+--modal-footer-bg: ;
+--modal-footer-border-color: var(--border-color);
+--modal-footer-border-width: 1px;
+
+
+/* ===== NAV TABS ===== */
+--nav-tabs-border-width: 1px;
+--nav-tabs-border-color: hsl(210, 14%, 89%);
+--nav-tabs-border-radius: 0.25rem;
+--nav-tabs-link-active-color: hsl(210, 9%, 31%);
+--nav-tabs-link-active-bg: var(--body-bg);
+--nav-tabs-link-active-border-color: hsl(210, 14%, 89%) hsl(210, 14%, 89%) var(--body-bg);
+
+
+/* ===== NAV PILLS ===== */
+--nav-pills-border-radius: 0.25rem;
+--nav-pills-link-active-color: var(--body-bg);
+--nav-pills-link-active-bg: hsl(240, 98%, 17%);
+
+
+/* ===== OFFCANVAS ===== */
+--offcanvas-zindex: 1045;
+--offcanvas-width: 400px;
+--offcanvas-height: 30vh;
+--offcanvas-padding-x: 1rem;
+--offcanvas-padding-y: 1rem;
+--offcanvas-color: var(--body-color);
+--offcanvas-bg: var(--body-bg);
+--offcanvas-border-width: 1px;
+--offcanvas-border-color: var(--border-color-translucent);
+--offcanvas-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
+
+
+/* ===== PAGINATION ===== */
+--pagination-padding-x: 0.75rem;
+--pagination-padding-y: 0.375rem;
+--pagination-font-size: 1rem;
+--pagination-color: var(--link-color);
+--pagination-bg: var(--body-bg);
+--pagination-border-width: 1px;
+--pagination-border-color: hsl(210, 14%, 89%);
+--pagination-border-radius: 0.25rem;
+--pagination-focus-color: var(--link-active-color);
+--pagination-focus-bg: hsl(210, 16%, 93%);
+--pagination-focus-box-shadow: 0 0 0 0.25rem rgba(1, 1, 86, 0.25);
+--pagination-active-color: var(--body-bg);
+--pagination-active-bg: hsl(240, 98%, 17%);
+--pagination-active-border-color: hsl(240, 98%, 17%);
+--pagination-disabled-color: hsl(210, 7%, 46%);
+--pagination-disabled-bg: var(--body-bg);
+--pagination-disabled-border-color: hsl(210, 14%, 89%);
+
+
+/* ===== POPOVER ===== */
+--popover-zindex: 1060;
+--popover-max-width: 276px;
+--popover-font-size: 0.875rem;
+--popover-bg: var(--body-bg);
+--popover-border-width: 1px;
+--popover-border-color: var(--border-color-translucent);
+--popover-border-radius: 0.3rem;
+--popover-inner-border-radius: calc(0.3rem - 1px);
+--popover-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
+--popover-header-padding-x: 1rem;
+--popover-header-padding-y: 0.5rem;
+--popover-header-font-size: 1rem;
+--popover-header-color: ;
+--popover-header-bg: #f0f0f0;
+--popover-body-padding-x: 1rem;
+--popover-body-padding-y: 1rem;
+--popover-body-color: hsl(210, 11%, 15%);
+--popover-arrow-width: 1rem;
+--popover-arrow-height: 0.5rem;
+--popover-arrow-border: var(--popover-border-color);
+
+
+/* ===== PROGRESS ===== */
+--progress-height: 1rem;
+--progress-font-size: 0.75rem;
+--progress-bg: hsl(210, 16%, 93%);
+--progress-border-radius: 0.25rem;
+--progress-box-shadow: inset 0 1px 2px rgba(var(--black-rgb), 0.075);
+--progress-bar-color: var(--body-bg);
+--progress-bar-bg: hsl(240, 98%, 17%);
+--progress-bar-transition: width 0.6s ease;
+
+
+/* ===== SPINNER ===== */
+--spinner-width: 2rem;
+--spinner-height: 2rem;
+--spinner-vertical-align: -0.125em;
+--spinner-border-width: 0.25em;
+--spinner-animation-speed: 0.75s;
+
+
+/* ===== TABLE ===== */
+--table-color: var(--body-color);
+--table-bg: transparent;
+--table-border-color: var(--border-color);
+--table-accent-bg: transparent;
+--table-striped-color: var(--body-color);
+--table-striped-bg: rgba(var(--black-rgb), var(--opacity-5));
+--table-active-color: var(--body-color);
+--table-active-bg: rgba(var(--black-rgb), 0.075);
+
+
+/* ===== TOAST ===== */
+--toast-zindex: 1090;
+--toast-padding-x: 0.75rem;
+--toast-padding-y: 0.5rem;
+--toast-spacing: 1em;
+--toast-max-width: 350px;
+--toast-font-size: 0.875rem;
+--toast-color: ;
+--toast-bg: rgba(255, 255, 255, 0.85);
+--toast-border-width: 1px;
+--toast-border-color: var(--border-color-translucent);
+--toast-border-radius: 0.25rem;
+--toast-box-shadow: 0 0.5rem 1rem var(--shadow-color-light);
+--toast-header-color: hsl(210, 7%, 46%);
+--toast-header-bg: rgba(var(--white-rgb), 0.85);
+--toast-header-border-color: rgba(var(--black-rgb), var(--opacity-5));
+
+
+/* ===== TOOLTIP ===== */
+--tooltip-zindex: 1070;
+--tooltip-max-width: 200px;
+--tooltip-padding-x: 0.5rem;
+--tooltip-padding-y: 0.25rem;
+--tooltip-margin: ;
+--tooltip-font-size: 0.875rem;
+--tooltip-color: var(--body-bg);
+--tooltip-bg: hsl(0, 0%, 0%);
+--tooltip-border-radius: 0.25rem;
+--tooltip-opacity: 0.9;
+--tooltip-arrow-width: 0.8rem;
+--tooltip-arrow-height: 0.4rem;
+
+
+/* ===== BOOTSTRAP PALETTE ===== */
+--primary: #010156;
+--secondary: #6d757e;
+--success: #448344;
+--info: #30638d;
+--warning: #ad6200;
+--danger: #a51f18;
+--light: #f9fafb;
+--dark: #353b41;
+--primary-rgb: 1, 1, 86;
+--secondary-rgb: 109, 117, 126;
+--success-rgb: 68, 131, 68;
+--info-rgb: 48, 99, 141;
+--warning-rgb: 173, 98, 0;
+--danger-rgb: 165, 31, 24;
+--light-rgb: 249, 250, 251;
+--dark-rgb: 53, 59, 65;
+--primary-text-emphasis: #002;
+--secondary-text-emphasis: #2c2f32;
+--success-text-emphasis: #1b351b;
+--info-text-emphasis: #132838;
+--warning-text-emphasis: #452700;
+--danger-text-emphasis: #420c09;
+--light-text-emphasis: #484f56;
+--dark-text-emphasis: #484f56;
+--primary-bg-subtle: #ccd;
+--secondary-bg-subtle: #e2e3e5;
+--success-bg-subtle: #dae6da;
+--info-bg-subtle: #d6e0e8;
+--warning-bg-subtle: #efe0cc;
+--danger-bg-subtle: #edd2d1;
+--light-bg-subtle: #fcfcfd;
+--dark-bg-subtle: #ced4da;
+--primary-border-subtle: #99b;
+--secondary-border-subtle: #c5c8cb;
+--success-border-subtle: #b4ceb4;
+--info-border-subtle: #acc1d1;
+--warning-border-subtle: #dec099;
+--danger-border-subtle: #dba5a2;
+--light-border-subtle: #eaedf0;
+--dark-border-subtle: #adb5bd;
+
+
+/* ===== HERO / BANNER OVERLAY ===== */
+--hero-height: 70vh;
+--hero-color: var(--body-color);
+--hero-bg-repeat: no-repeat;
+--hero-bg-attachment: fixed;
+--hero-bg-position: top center;
+--hero-bg-size: cover;
+--hero-border-bottom: solid var(--accent-color-secondary);
+--hero-overlay-bg: hsla(0, 0%, 0%, 0.1);
+--hero-overlay-bg-position: center;
+--hero-overlay-bg-size: cover;
+--hero-overlay-padding: 1em;
+--hero-overlay-text-align: center;
+--hero-overlay-text-color: var(--body-color);
+
+
+/* ===== HERO VARIANTS ===== */
+/* Primary — sky blue, light overlay */
+--hero-primary-bg-color: var(--color-primary);
+--hero-primary-overlay: linear-gradient(rgba(163, 205, 226, .45), rgba(163, 205, 226, .45));
+--hero-primary-color: var(--color-primary);
+
+/* Secondary — navy, stronger overlay */
+--hero-secondary-bg-color: var(--color-primary);
+--hero-secondary-overlay: linear-gradient(rgba(17, 40, 85, .75), rgba(17, 40, 85, .75));
+--hero-secondary-color: #f1f5f9;
+
+
+/* ===== HERO CARD (inner .hero element) ===== */
+/* Default card — uses primary variant values */
+--hero-card-bg: var(--hero-primary-bg-color);
+--hero-card-color: white;
+--hero-card-overlay: var(--hero-primary-overlay);
+--hero-card-border-radius: .5rem;
+--hero-card-padding-x: 2rem;
+--hero-card-padding-y: 3rem;
+--hero-card-max-width: 800px;
+
+/* Alternative card — uses secondary variant values */
+--hero-alt-card-bg: var(--hero-secondary-bg-color);
+--hero-alt-card-color: var(--hero-secondary-color);
+--hero-alt-card-overlay: var(--hero-secondary-overlay);
+--hero-alt-card-border-radius: .5rem;
+--hero-alt-card-padding-x: 2rem;
+--hero-alt-card-padding-y: 3rem;
+--hero-alt-card-max-width: 600px;
+
+
+/* ===== BLOCK COLORS (top-a / top-b / bottom-a / bottom-b) ===== */
+--block-color-1: var(--color-primary);
+--block-text-1:  var(--body-color);
+
+--block-color-2: var(--accent-color-primary);
+--block-text-2:  #fff;
+
+--block-color-3: var(--warning, #eec234);
+--block-text-3:  var(--body-color);
+
+--block-color-4: var(--success-bg-subtle, #eef7f0);
+--block-text-4:  var(--body-color);
+
+
+/* ===== BLOCK COLOR OVERRIDES ===== */
+--block-highlight-bg:   var(--accent-color-primary);
+--block-highlight-text: #fff;
+
+--block-cta-bg:         var(--color-primary);
+--block-cta-text:       #fff;
+
+--block-alert-bg:       var(--danger, #a51f18);
+--block-alert-text:     #fff;
+
+
+/* ===== FOOTER ===== */
+--footer-padding-top: 1rem;
+--footer-padding-bottom: 80px;
+--footer-grid-padding-y: 2.5rem;
+--footer-grid-padding-x: 0.5em;
+
+
+/* ===== THEME FAB ===== */
+--theme-fab-bg: var(--color-primary, #112855);
+--theme-fab-color: #fff;
+--theme-fab-btn-bg: rgba(255,255,255,.15);
+--theme-fab-border: rgba(255, 255, 255, 0.3);
+
+
+/* ===== OFFLINE PAGE ===== */
+--offline-card-bg: rgba(0, 0, 0, 0.55);
+
+
+/* ===== COMPONENT-SPECIFIC COLORS ===== */
+--mod-finder-link-hover: #e6e6e6;
+--form-legend-color: #495057;
+--border-gray: #b2bfcd;
+--subhead-color: #495057;
+--box-shadow-gray: #ddd;
+--btn-active-text-gray: #A0A0A0;
+--indicator-success-bg: var(--success);
+--item-list-color: #F5F5F5;
+--notification-badge-bg: var(--danger);
+--content-bg-gray: #DDD;
+--taba-btn-green: #7ac143;
+--taba-btn-blue: #5091cd;
+--taba-btn-red: #f44321;
+--taba-btn-gray: #AAA;
+--taba-msg-bg: #f5f5f5;
+--toc-link-color: #767676;
+--toc-link-active-color: #563d7c;
+--choices-disabled-bg: #eaeaea;
+--choices-input-bg: var(--white);
+--choices-border-light: #ddd;
+--choices-arrow-color: #333;
+--choices-inner-bg: #f9f9f9;
+--choices-focused-border: #b7b7b7;
+--choices-dropdown-bg: var(--white);
+--choices-item-bg: #00bcd4;
+--choices-item-border: #00a5bb;
+--choices-item-hover-bg: #00a5bb;
+--choices-item-hover-border: #008fa1;
+--choices-item-disabled-bg: #aaaaaa;
+--choices-item-disabled-border: #919191;
+--choices-item-highlighted: #f2f2f2;
+--choices-input-inner-bg: #f9f9f9;
+
+
 /* ===== VIRTUEMART (VM) ===== */
 /* VM Surfaces */
 --vm-surface: #ffffff;
@@ -497,6 +877,7 @@ color-scheme: light;
 --vm-vendor-menu-link-active: var(--primary);
 --vm-vendor-menu-hover-bg: var(--secondary-bg);
 
+
 /* ===== GABLE ===== */
 --gab-blue: #0066cc;
 --gab-green: #28a745;
@@ -506,335 +887,6 @@ color-scheme: light;
 --gab-gray2: #6c757d;
 --gab-gray3: #adb5bd;
 
-/* ===== HERO / BANNER OVERLAY ===== */
---hero-height: 70vh;
---hero-color: var(--body-color);
---hero-bg-repeat: no-repeat;
---hero-bg-attachment: fixed;
---hero-bg-position: top center;
---hero-bg-size: cover;
---hero-border-bottom: solid var(--accent-color-secondary);
---hero-overlay-bg: hsla(0, 0%, 0%, 0.1);
---hero-overlay-bg-position: center;
---hero-overlay-bg-size: cover;
---hero-overlay-padding: 1em;
---hero-overlay-text-align: center;
---hero-overlay-text-color: var(--body-color);
-
-/* ===== HERO VARIANTS ===== */
-/* Primary — sky blue, light overlay */
---hero-primary-bg-color: var(--color-primary);
---hero-primary-overlay: linear-gradient(rgba(163, 205, 226, .45), rgba(163, 205, 226, .45));
---hero-primary-color: var(--color-primary);
-
-/* Secondary — navy, stronger overlay */
---hero-secondary-bg-color: var(--color-primary);
---hero-secondary-overlay: linear-gradient(rgba(17, 40, 85, .75), rgba(17, 40, 85, .75));
---hero-secondary-color: #f1f5f9;
-
-/* ===== HERO CARD (inner .hero element) ===== */
-/* Default card — uses primary variant values */
---hero-card-bg: var(--hero-primary-bg-color);
---hero-card-color: white;
---hero-card-overlay: var(--hero-primary-overlay);
---hero-card-border-radius: .5rem;
---hero-card-padding-x: 2rem;
---hero-card-padding-y: 3rem;
---hero-card-max-width: 800px;
-
-/* Alternative card — uses secondary variant values */
---hero-alt-card-bg: var(--hero-secondary-bg-color);
---hero-alt-card-color: var(--hero-secondary-color);
---hero-alt-card-overlay: var(--hero-secondary-overlay);
---hero-alt-card-border-radius: .5rem;
---hero-alt-card-padding-x: 2rem;
---hero-alt-card-padding-y: 3rem;
---hero-alt-card-max-width: 600px;
-
-/* ===== BLOCK COLORS (top-a / top-b / bottom-a / bottom-b) ===== */
---block-color-1: var(--color-primary);
---block-text-1:  var(--body-color);
-
---block-color-2: var(--accent-color-primary);
---block-text-2:  #fff;
-
---block-color-3: var(--warning, #eec234);
---block-text-3:  var(--body-color);
-
---block-color-4: var(--success-bg-subtle, #eef7f0);
---block-text-4:  var(--body-color);
-
-/* ===== BLOCK COLOR OVERRIDES ===== */
---block-highlight-bg:   var(--accent-color-primary);
---block-highlight-text: #fff;
-
---block-cta-bg:         var(--color-primary);
---block-cta-text:       #fff;
-
---block-alert-bg:       var(--danger, #a51f18);
---block-alert-text:     #fff;
-
-/* ===== OFFCANVAS ===== */
---offcanvas-zindex: 1045;
---offcanvas-width: 400px;
---offcanvas-height: 30vh;
---offcanvas-padding-x: 1rem;
---offcanvas-padding-y: 1rem;
---offcanvas-color: var(--body-color);
---offcanvas-bg: var(--body-bg);
---offcanvas-border-width: 1px;
---offcanvas-border-color: var(--border-color-translucent);
---offcanvas-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
-
-/* ===== ACCORDION ===== */
---accordion-color: hsl(210, 11%, 15%);
---accordion-bg: var(--body-bg);
---accordion-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
---accordion-border-color: var(--border-color);
---accordion-border-width: 1px;
---accordion-border-radius: 0.25rem;
---accordion-inner-border-radius: calc(0.25rem - 1px);
---accordion-btn-padding-x: 1.25rem;
---accordion-btn-padding-y: 1rem;
---accordion-btn-color: hsl(210, 11%, 15%);
---accordion-btn-bg: var(--accordion-bg);
---accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='hsl%28210, 11%25, 15%25%29'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
---accordion-btn-icon-width: 1.25rem;
---accordion-btn-icon-transform: rotate(-180deg);
---accordion-btn-icon-transition: transform 0.2s ease-in-out;
---accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230f244d'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
---accordion-btn-focus-border-color: var(--input-focus-border-color);
---accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(1, 1, 86, 0.25);
---accordion-body-padding-x: 1.25rem;
---accordion-body-padding-y: 1rem;
---accordion-active-color: #0f244d;
---accordion-active-bg: #e7eaee;
-
-/* ===== BREADCRUMB ===== */
---breadcrumb-padding-x: 0;
---breadcrumb-padding-y: 0;
---breadcrumb-margin-bottom: 1rem;
---breadcrumb-bg: ;
---breadcrumb-border-radius: ;
---breadcrumb-divider-color: hsl(210, 7%, 46%);
---breadcrumb-item-padding-x: 0.5rem;
---breadcrumb-item-active-color: var(--link-color);
-
-/* ===== PAGINATION ===== */
---pagination-padding-x: 0.75rem;
---pagination-padding-y: 0.375rem;
---pagination-font-size: 1rem;
---pagination-color: var(--link-color);
---pagination-bg: var(--body-bg);
---pagination-border-width: 1px;
---pagination-border-color: hsl(210, 14%, 89%);
---pagination-border-radius: 0.25rem;
---pagination-focus-color: var(--link-active-color);
---pagination-focus-bg: hsl(210, 16%, 93%);
---pagination-focus-box-shadow: 0 0 0 0.25rem rgba(1, 1, 86, 0.25);
---pagination-active-color: var(--body-bg);
---pagination-active-bg: hsl(240, 98%, 17%);
---pagination-active-border-color: hsl(240, 98%, 17%);
---pagination-disabled-color: hsl(210, 7%, 46%);
---pagination-disabled-bg: var(--body-bg);
---pagination-disabled-border-color: hsl(210, 14%, 89%);
-
-/* ===== BADGE ===== */
---badge-padding-x: 0.65em;
---badge-padding-y: 0.35em;
---badge-font-size: 0.75em;
---badge-font-weight: 700;
---badge-color: var(--body-bg);
---badge-border-radius: 0.25rem;
-
-/* ===== ALERT ===== */
---alert-bg: transparent;
---alert-padding-x: 1rem;
---alert-padding-y: 1rem;
---alert-margin-bottom: 1rem;
---alert-color: #000;
---alert-border-color: transparent;
---alert-border: 1px solid var(--alert-border-color);
---alert-border-radius: 0.25rem;
-
-/* ===== PROGRESS ===== */
---progress-height: 1rem;
---progress-font-size: 0.75rem;
---progress-bg: hsl(210, 16%, 93%);
---progress-border-radius: 0.25rem;
---progress-box-shadow: inset 0 1px 2px rgba(var(--black-rgb), 0.075);
---progress-bar-color: var(--body-bg);
---progress-bar-bg: hsl(240, 98%, 17%);
---progress-bar-transition: width 0.6s ease;
-
-/* ===== LIST GROUP ===== */
---list-group-color: hsl(210, 11%, 15%);
---list-group-bg: var(--body-bg);
---list-group-border-color: rgba(var(--black-rgb), 0.125);
---list-group-border-width: 1px;
---list-group-border-radius: 0.25rem;
---list-group-item-padding-x: 1rem;
---list-group-item-padding-y: 0.5rem;
---list-group-action-color: hsl(210, 9%, 31%);
---list-group-action-active-color: hsl(210, 11%, 15%);
---list-group-action-active-bg: hsl(210, 16%, 93%);
---list-group-disabled-color: hsl(210, 7%, 46%);
---list-group-disabled-bg: var(--body-bg);
---list-group-active-color: var(--body-bg);
---list-group-active-bg: hsl(240, 98%, 17%);
---list-group-active-border-color: hsl(240, 98%, 17%);
-
-/* ===== DROPDOWN ===== */
---dropdown-zindex: 1000;
---dropdown-min-width: 10rem;
---dropdown-padding-x: 0;
---dropdown-padding-y: 0.5rem;
---dropdown-spacer: 0.125rem;
---dropdown-font-size: 1rem;
---dropdown-color: hsl(210, 11%, 15%);
---dropdown-bg: var(--body-bg);
---dropdown-border-color: var(--border-color-translucent);
---dropdown-border-radius: 0.25rem;
---dropdown-border-width: 1px;
---dropdown-inner-border-radius: calc(0.25rem - 1px);
---dropdown-divider-bg: var(--border-color-translucent);
---dropdown-divider-margin-y: 0.5rem;
---dropdown-box-shadow: 0 0.5rem 1rem var(--shadow-color-light);
---dropdown-link-color: hsl(210, 11%, 15%);
---dropdown-link-active-color: var(--body-bg);
---dropdown-link-active-bg: hsl(240, 98%, 17%);
---dropdown-link-disabled-color: hsl(210, 11%, 71%);
---dropdown-item-padding-x: 1rem;
---dropdown-item-padding-y: 0.25rem;
---dropdown-header-color: hsl(210, 7%, 46%);
---dropdown-header-padding-x: 1rem;
---dropdown-header-padding-y: 0.5rem;
-
-/* ===== TOAST ===== */
---toast-zindex: 1090;
---toast-padding-x: 0.75rem;
---toast-padding-y: 0.5rem;
---toast-spacing: 1em;
---toast-max-width: 350px;
---toast-font-size: 0.875rem;
---toast-color: ;
---toast-bg: rgba(255, 255, 255, 0.85);
---toast-border-width: 1px;
---toast-border-color: var(--border-color-translucent);
---toast-border-radius: 0.25rem;
---toast-box-shadow: 0 0.5rem 1rem var(--shadow-color-light);
---toast-header-color: hsl(210, 7%, 46%);
---toast-header-bg: rgba(var(--white-rgb), 0.85);
---toast-header-border-color: rgba(var(--black-rgb), var(--opacity-5));
-
-/* ===== MODAL ===== */
---modal-zindex: 1050;
---modal-width: 500px;
---modal-padding: 1rem;
---modal-margin: 0.5rem;
---modal-color: ;
---modal-bg: var(--body-bg);
---modal-border-color: var(--border-color-translucent);
---modal-border-width: 1px;
---modal-border-radius: 0.3rem;
---modal-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
---modal-inner-border-radius: calc(0.3rem - 1px);
---modal-header-padding-x: 1rem;
---modal-header-padding-y: 1rem;
---modal-header-padding: 1rem 1rem;
---modal-header-border-color: var(--border-color);
---modal-header-border-width: 1px;
---modal-title-line-height: 1.5;
---modal-footer-gap: 0.5rem;
---modal-footer-bg: ;
---modal-footer-border-color: var(--border-color);
---modal-footer-border-width: 1px;
-
-/* ===== TOOLTIP ===== */
---tooltip-zindex: 1070;
---tooltip-max-width: 200px;
---tooltip-padding-x: 0.5rem;
---tooltip-padding-y: 0.25rem;
---tooltip-margin: ;
---tooltip-font-size: 0.875rem;
---tooltip-color: var(--body-bg);
---tooltip-bg: hsl(0, 0%, 0%);
---tooltip-border-radius: 0.25rem;
---tooltip-opacity: 0.9;
---tooltip-arrow-width: 0.8rem;
---tooltip-arrow-height: 0.4rem;
-
-/* ===== POPOVER ===== */
---popover-zindex: 1060;
---popover-max-width: 276px;
---popover-font-size: 0.875rem;
---popover-bg: var(--body-bg);
---popover-border-width: 1px;
---popover-border-color: var(--border-color-translucent);
---popover-border-radius: 0.3rem;
---popover-inner-border-radius: calc(0.3rem - 1px);
---popover-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
---popover-header-padding-x: 1rem;
---popover-header-padding-y: 0.5rem;
---popover-header-font-size: 1rem;
---popover-header-color: ;
---popover-header-bg: #f0f0f0;
---popover-body-padding-x: 1rem;
---popover-body-padding-y: 1rem;
---popover-body-color: hsl(210, 11%, 15%);
---popover-arrow-width: 1rem;
---popover-arrow-height: 0.5rem;
---popover-arrow-border: var(--popover-border-color);
-
-/* ===== SPINNER ===== */
---spinner-width: 2rem;
---spinner-height: 2rem;
---spinner-vertical-align: -0.125em;
---spinner-border-width: 0.25em;
---spinner-animation-speed: 0.75s;
-
-/* ===== NAV TABS ===== */
---nav-tabs-border-width: 1px;
---nav-tabs-border-color: hsl(210, 14%, 89%);
---nav-tabs-border-radius: 0.25rem;
---nav-tabs-link-active-color: hsl(210, 9%, 31%);
---nav-tabs-link-active-bg: var(--body-bg);
---nav-tabs-link-active-border-color: hsl(210, 14%, 89%) hsl(210, 14%, 89%) var(--body-bg);
-
-/* ===== NAV PILLS ===== */
---nav-pills-border-radius: 0.25rem;
---nav-pills-link-active-color: var(--body-bg);
---nav-pills-link-active-bg: hsl(240, 98%, 17%);
-
-/* ===== TABLE ===== */
---table-color: var(--body-color);
---table-bg: transparent;
---table-border-color: var(--border-color);
---table-accent-bg: transparent;
---table-striped-color: var(--body-color);
---table-striped-bg: rgba(var(--black-rgb), var(--opacity-5));
---table-active-color: var(--body-color);
---table-active-bg: rgba(var(--black-rgb), 0.075);
-
-/* ===== FOOTER ===== */
---footer-padding-top: 1rem;
---footer-padding-bottom: 80px;
---footer-grid-padding-y: 2.5rem;
---footer-grid-padding-x: 0.5em;
-
-/* ===== BACKDROP ===== */
---backdrop-zindex: 1040;
---backdrop-bg: hsl(0, 0%, 0%);
---backdrop-opacity: 0.5;
-
-/* ===== THEME FAB ===== */
---theme-fab-bg: var(--color-primary, #112855);
---theme-fab-color: #fff;
---theme-fab-btn-bg: rgba(255,255,255,.15);
---theme-fab-border: rgba(255, 255, 255, 0.3);
-
-/* ===== OFFLINE PAGE ===== */
---offline-card-bg: rgba(0, 0, 0, 0.55);
 }
 
 .btn {
diff --git a/src/sync_custom_vars.php b/src/sync_custom_vars.php
index 39c6471..2db9824 100644
--- a/src/sync_custom_vars.php
+++ b/src/sync_custom_vars.php
@@ -97,28 +97,24 @@ final class MokoCssVarSync
     private static function syncFile(string $starterPath, string $userPath): array
     {
         $starterVars = self::extractVarsWithContext($starterPath);
-        $userVars    = self::extractVarNames($userPath);
+        $userVarsMap = self::extractVarsWithContext($userPath);
+        $userNames   = self::extractVarNames($userPath);
 
+        // Find missing variables
         $missing = [];
         foreach ($starterVars as $name => $declaration) {
-            if (!isset($userVars[$name])) {
+            if (!isset($userNames[$name])) {
                 $missing[$name] = $declaration;
             }
         }
 
-        if (empty($missing)) {
-            return ['added' => [], 'skipped' => []];
-        }
+        // Rebuild the entire :root block in starter file order.
+        // User's custom values are preserved; missing vars get starter defaults.
+        $reordered = self::rebuildInStarterOrder($starterPath, $userVarsMap, $missing);
 
-        // Group missing variables by their section comment header.
-        $sections = self::groupBySection($missing, $starterPath);
-
-        // Build the injection block.
-        $injection = self::buildInjectionBlock($sections);
-
-        // Insert before the closing } of the :root rule.
+        // Replace the :root block in the user file with the reordered version.
         $userCss = file_get_contents($userPath);
-        $userCss = self::injectBeforeRootClose($userCss, $injection);
+        $userCss = self::replaceRootBlock($userCss, $reordered);
 
         // Write back (atomic: write to .tmp then rename).
         $tmpPath = $userPath . '.tmp';
@@ -128,6 +124,104 @@ final class MokoCssVarSync
         return ['added' => array_keys($missing), 'skipped' => []];
     }
 
+    /**
+     * Rebuild all variables in the order they appear in the starter file.
+     * User values are preserved; missing vars use starter defaults.
+     *
+     * @param  string  $starterPath  Path to starter file.
+     * @param  array   $userVars     User's variable name => declaration.
+     * @param  array   $missing      Missing variable name => starter declaration.
+     * @return string  Complete CSS content for inside :root { }.
+     */
+    private static function rebuildInStarterOrder(string $starterPath, array $userVars, array $missing): string
+    {
+        $lines   = file($starterPath, FILE_IGNORE_NEW_LINES);
+        $output  = [];
+        $inRoot  = false;
+        $depth   = 0;
+
+        foreach ($lines as $line) {
+            // Track when we enter :root
+            if (!$inRoot && preg_match('/:root/', $line)) {
+                $inRoot = true;
+                continue;
+            }
+
+            if (!$inRoot) {
+                continue;
+            }
+
+            // Track braces
+            if (strpos($line, '{') !== false) {
+                $depth++;
+                continue;
+            }
+            if (strpos($line, '}') !== false) {
+                $depth--;
+                if ($depth < 0) {
+                    break; // End of :root
+                }
+                continue;
+            }
+
+            // Section comment headers — always include
+            if (preg_match('/\/\*\s*=+\s*.+?\s*=+\s*\*\//', $line)) {
+                $output[] = $line;
+                continue;
+            }
+
+            // Regular comments — include
+            if (preg_match('/^\s*\/\*/', $line) || preg_match('/^\s*\*/', $line)) {
+                $output[] = $line;
+                continue;
+            }
+
+            // Blank lines — include
+            if (trim($line) === '') {
+                $output[] = '';
+                continue;
+            }
+
+            // Variable declaration
+            if (preg_match('/^\s*(--[\w-]+)\s*:/', $line, $m)) {
+                $name = trim($m[1]);
+                if (isset($userVars[$name])) {
+                    // Use the user's custom value
+                    $output[] = $userVars[$name];
+                } elseif (isset($missing[$name])) {
+                    // New variable — use starter default
+                    $output[] = $missing[$name];
+                }
+                continue;
+            }
+
+            // Other lines (e.g. color-scheme) — include as-is
+            $output[] = $line;
+        }
+
+        return implode("\n", $output);
+    }
+
+    /**
+     * Replace the content inside :root { ... } with new content.
+     */
+    private static function replaceRootBlock(string $css, string $newContent): string
+    {
+        $rootStart = preg_match('/:root[^{]*\{/', $css, $m, PREG_OFFSET_CAPTURE);
+        if (!$rootStart) {
+            return $css;
+        }
+
+        $openBrace = $m[0][1] + strlen($m[0][0]);
+        $closeBrace = self::findRootClosingBrace($css);
+
+        if ($closeBrace === false) {
+            return $css;
+        }
+
+        return substr($css, 0, $openBrace) . "\n" . $newContent . "\n" . substr($css, $closeBrace);
+    }
+
     /**
      * Extract CSS custom property declarations with their full text (name: value).
      * Only extracts from the first :root block.
diff --git a/src/templateDetails.xml b/src/templateDetails.xml
index f9135d6..e64e9b9 100644
--- a/src/templateDetails.xml
+++ b/src/templateDetails.xml
@@ -39,13 +39,13 @@
 		</server>
 	</updateservers>
 	<name>MokoCassiopeia</name>
-	<version>03.10.03</version>
+	<version>03.10.04</version>
 	<scriptfile>script.php</scriptfile>
 	<creationDate>2026-04-15</creationDate>
 	<author>Jonathan Miller || Moko Consulting</author>
 	<authorEmail>hello@mokoconsulting.tech</authorEmail>
 	<copyright>(C)GNU General Public License Version 3 - 2026 Moko Consulting</copyright>
-	<description><![CDATA[<p><img src="https://img.shields.io/badge/version-03.10.03-blue.svg?logo=v&amp;logoColor=white" alt="Version 03.10.03" /> <img src="https://img.shields.io/badge/license-GPL--3.0--or--later-green.svg?logo=gnu&amp;logoColor=white" alt="License" /> <img src="https://img.shields.io/badge/Joomla-5.x%20%7C%206.x-red.svg?logo=joomla&amp;logoColor=white" alt="Joomla" /> <img src="https://img.shields.io/badge/PHP-8.1%2B-777BB4.svg?logo=php&amp;logoColor=white" alt="PHP" /></p> <h3>MokoCassiopeia Template Description</h3> <p>  <strong>MokoCassiopeia</strong> continues Joomla's tradition of space-themed default templates—  building on the legacy of <em>Solarflare</em> (Joomla 1.0), <em>Milkyway</em> (Joomla 1.5),  and <em>Protostar</em> (Joomla 3.0). </p> <p>  This template is a customized fork of the <strong>Cassiopeia</strong> template introduced in Joomla 4,  preserving its modern, accessible, and mobile-first foundation while introducing new stylistic  enhancements and structural refinements specifically tailored for use by Moko Consulting. </p>  <h4>Custom Colour Themes</h4> <p>  Starter palette files are included with the template. To create a custom colour scheme,  copy <code>templates/mokocassiopeia/templates/light.custom.css</code> to  <code>media/templates/site/mokocassiopeia/css/theme/light.custom.css</code>,  or <code>templates/mokocassiopeia/templates/dark.custom.css</code> to  <code>media/templates/site/mokocassiopeia/css/theme/dark.custom.css</code>.  Customise the CSS variables to match your brand, then activate your palette in  <em>System → Site Templates → MokoCassiopeia → Theme tab</em>  by selecting "Custom" for the Light or Dark Mode Palette.  A full variable reference is available in the <em>CSS Variables</em> tab in template options. </p>  <h4>Custom CSS &amp; JavaScript</h4> <p>  For site-specific styles and scripts that should survive template updates, create the following files: </p> <ul>  <li><code>media/templates/site/mokocassiopeia/css/user.css</code> — loaded on every page for custom CSS overrides.</li>  <li><code>media/templates/site/mokocassiopeia/js/user.js</code> — loaded on every page for custom JavaScript.</li> </ul> <p>  These files are gitignored and will not be overwritten by template updates. </p>  <h4>Code Attribution</h4> <p>  This template is based on the original <strong>Cassiopeia</strong> template developed by the  <a href="https://www.joomla.org" target="_blank" rel="noopener">Joomla! Project</a> and released under the GNU General Public License. </p> <p>  Modifications and enhancements have been made by Moko Consulting in accordance with open-source licensing standards. </p> <p>  It includes integration with  <a href="https://afeld.github.io/bootstrap-toc/" target="_blank" rel="noopener">Bootstrap TOC</a>,  an open-source table of contents generator by A. Feld, licensed under the MIT License. </p> <p>  All third-party libraries and assets remain the property of their respective authors and are credited within their source files where applicable. </p>]]></description>
+	<description><![CDATA[<p><img src="https://img.shields.io/badge/version-03.10.04-blue.svg?logo=v&amp;logoColor=white" alt="Version 03.10.04" /> <img src="https://img.shields.io/badge/license-GPL--3.0--or--later-green.svg?logo=gnu&amp;logoColor=white" alt="License" /> <img src="https://img.shields.io/badge/Joomla-5.x%20%7C%206.x-red.svg?logo=joomla&amp;logoColor=white" alt="Joomla" /> <img src="https://img.shields.io/badge/PHP-8.1%2B-777BB4.svg?logo=php&amp;logoColor=white" alt="PHP" /></p> <h3>MokoCassiopeia Template Description</h3> <p>  <strong>MokoCassiopeia</strong> continues Joomla's tradition of space-themed default templates—  building on the legacy of <em>Solarflare</em> (Joomla 1.0), <em>Milkyway</em> (Joomla 1.5),  and <em>Protostar</em> (Joomla 3.0). </p> <p>  This template is a customized fork of the <strong>Cassiopeia</strong> template introduced in Joomla 4,  preserving its modern, accessible, and mobile-first foundation while introducing new stylistic  enhancements and structural refinements specifically tailored for use by Moko Consulting. </p>  <h4>Custom Colour Themes</h4> <p>  Starter palette files are included with the template. To create a custom colour scheme,  copy <code>templates/mokocassiopeia/templates/light.custom.css</code> to  <code>media/templates/site/mokocassiopeia/css/theme/light.custom.css</code>,  or <code>templates/mokocassiopeia/templates/dark.custom.css</code> to  <code>media/templates/site/mokocassiopeia/css/theme/dark.custom.css</code>.  Customise the CSS variables to match your brand, then activate your palette in  <em>System → Site Templates → MokoCassiopeia → Theme tab</em>  by selecting "Custom" for the Light or Dark Mode Palette.  A full variable reference is available in the <em>CSS Variables</em> tab in template options. </p>  <h4>Custom CSS &amp; JavaScript</h4> <p>  For site-specific styles and scripts that should survive template updates, create the following files: </p> <ul>  <li><code>media/templates/site/mokocassiopeia/css/user.css</code> — loaded on every page for custom CSS overrides.</li>  <li><code>media/templates/site/mokocassiopeia/js/user.js</code> — loaded on every page for custom JavaScript.</li> </ul> <p>  These files are gitignored and will not be overwritten by template updates. </p>  <h4>Code Attribution</h4> <p>  This template is based on the original <strong>Cassiopeia</strong> template developed by the  <a href="https://www.joomla.org" target="_blank" rel="noopener">Joomla! Project</a> and released under the GNU General Public License. </p> <p>  Modifications and enhancements have been made by Moko Consulting in accordance with open-source licensing standards. </p> <p>  It includes integration with  <a href="https://afeld.github.io/bootstrap-toc/" target="_blank" rel="noopener">Bootstrap TOC</a>,  an open-source table of contents generator by A. Feld, licensed under the MIT License. </p> <p>  All third-party libraries and assets remain the property of their respective authors and are credited within their source files where applicable. </p>]]></description>
 	<inheritable>1</inheritable>
 	<files>
 		<filename>component.php</filename>
diff --git a/updates.xml b/updates.xml
index dc3cfdf..d36332a 100644
--- a/updates.xml
+++ b/updates.xml
@@ -1,7 +1,7 @@
 <?xml version='1.0' encoding='UTF-8'?>
 <!-- Copyright (C) 2026 Moko Consulting <hello@mokoconsulting.tech>
  SPDX-License-Identifier: GPL-3.0-or-later
- VERSION: 03.10.03
+ VERSION: 03.10.04
  -->
 
 <updates>
@@ -13,11 +13,11 @@
     <element>mokocassiopeia</element>
     <type>template</type>
     <client>site</client>
-    <version>03.10.03</version>
+    <version>03.10.04</version>
     <creationDate>2026-04-18</creationDate>
     <infourl title='MokoCassiopeia Dev'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/tag/development</infourl>
     <downloads>
-      <downloadurl type='full' format='zip'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/download/development/mokocassiopeia-03.10.03-dev.zip</downloadurl>
+      <downloadurl type='full' format='zip'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/download/development/mokocassiopeia-03.10.04-dev.zip</downloadurl>
     </downloads>
     <sha256>a7bc2dbc7abeb91a8e079c4d29b8c77366a28066bcf963b01c351593865f0f7c</sha256>
     <tags><tag>development</tag></tags>
@@ -34,11 +34,11 @@
     <element>mokocassiopeia</element>
     <type>template</type>
     <client>site</client>
-    <version>03.10.03</version>
+    <version>03.10.04</version>
     <creationDate>2026-04-14</creationDate>
     <infourl title='MokoCassiopeia Alpha'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/tag/alpha</infourl>
     <downloads>
-      <downloadurl type='full' format='zip'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/download/alpha/mokocassiopeia-03.10.03-alpha.zip</downloadurl>
+      <downloadurl type='full' format='zip'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/download/alpha/mokocassiopeia-03.10.04-alpha.zip</downloadurl>
     </downloads>
     <sha256>c2660acdf7389244462485f7ab4c286e9f851366a148acc16739a184576f7932</sha256>
     <tags><tag>alpha</tag></tags>
@@ -55,11 +55,11 @@
     <element>mokocassiopeia</element>
     <type>template</type>
     <client>site</client>
-    <version>03.10.03</version>
+    <version>03.10.04</version>
     <creationDate>2026-04-14</creationDate>
     <infourl title='MokoCassiopeia Beta'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/tag/beta</infourl>
     <downloads>
-      <downloadurl type='full' format='zip'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/download/beta/mokocassiopeia-03.10.03-beta.zip</downloadurl>
+      <downloadurl type='full' format='zip'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/download/beta/mokocassiopeia-03.10.04-beta.zip</downloadurl>
     </downloads>
     <sha256>4cbe4fc379182ef17580396e7d12ce4ce95a90017ef364b922bdc2d04b0b3d97</sha256>
     <tags><tag>beta</tag></tags>
@@ -76,12 +76,12 @@
     <element>mokocassiopeia</element>
     <type>template</type>
     <client>site</client>
-    <version>03.10.03</version>
+    <version>03.10.04</version>
     <creationDate>2026-04-14</creationDate>
     <infourl title='MokoCassiopeia RC'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/tag/release-candidate</infourl>
     <downloads>
-      <downloadurl type='full' format='zip'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/download/release-candidate/mokocassiopeia-03.10.03-rc.zip</downloadurl>
-      <downloadurl type='full' format='zip'>https://github.com/mokoconsulting-tech/MokoCassiopeia/releases/download/release-candidate/mokocassiopeia-03.10.03-rc.zip</downloadurl>
+      <downloadurl type='full' format='zip'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/download/release-candidate/mokocassiopeia-03.10.04-rc.zip</downloadurl>
+      <downloadurl type='full' format='zip'>https://github.com/mokoconsulting-tech/MokoCassiopeia/releases/download/release-candidate/mokocassiopeia-03.10.04-rc.zip</downloadurl>
     </downloads>
     <sha256>c2660acdf7389244462485f7ab4c286e9f851366a148acc16739a184576f7932</sha256>
     <tags><tag>rc</tag></tags>
@@ -98,12 +98,12 @@
     <element>mokocassiopeia</element>
     <type>template</type>
     <client>site</client>
-    <version>03.10.03</version>
+    <version>03.10.04</version>
     <creationDate>2026-04-14</creationDate>
     <infourl title='MokoCassiopeia'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/tag/v03</infourl>
     <downloads>
-      <downloadurl type='full' format='zip'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/download/v03/mokocassiopeia-03.10.03.zip</downloadurl>
-      <downloadurl type='full' format='zip'>https://github.com/mokoconsulting-tech/MokoCassiopeia/releases/download/v03/mokocassiopeia-03.10.03.zip</downloadurl>
+      <downloadurl type='full' format='zip'>https://git.mokoconsulting.tech/MokoConsulting/MokoCassiopeia/releases/download/v03/mokocassiopeia-03.10.04.zip</downloadurl>
+      <downloadurl type='full' format='zip'>https://github.com/mokoconsulting-tech/MokoCassiopeia/releases/download/v03/mokocassiopeia-03.10.04.zip</downloadurl>
     </downloads>
     <sha256>c2660acdf7389244462485f7ab4c286e9f851366a148acc16739a184576f7932</sha256>
     <tags><tag>stable</tag></tags>