:root {
  --rounded-none: 0rem;
  --rounded-xs: 0.125rem;
  --rounded-sm: 0.25rem;
  --rounded-md: 0.375rem;
  --rounded-lg: 0.5rem;
  --rounded-xl: 0.75rem;
  --rounded-2xl: 1rem;
  --rounded-3xl: 1.5rem;
  --rounded-4xl: 2rem;
  --rounded-full: 1000.0rem;
  --rounded-lgx: 0.625rem;
  --rounded-action-1: 1000.0rem;
  --rounded-action-2: 0.5rem;

  /* === Extra Font Sizes === */
  --3xs: 0.5rem;
  --2xs: 0.625rem;

  --display: Ubuntu;
  --heading: Nexa;
  --body: Roboto;


  --accent: hsl(218 17% 19%);
  --accent-foreground: hsl(0 0% 100%);
  --alpha-0: hsl(0 0% 50% / 0%);
  --alpha-10: hsl(213 92% 5% / 10%);
  --alpha-2-5: hsl(213 92% 5% / 2%);
  --alpha-20: hsl(213 92% 5% / 20%);
  --alpha-30: hsl(213 92% 5% / 30%);
  --alpha-40: hsl(213 92% 5% / 40%);
  --alpha-5: hsl(213 92% 5% / 5%);
  --alpha-50: hsl(213 92% 5% / 50%);
  --alpha-60: hsl(213 92% 5% / 60%);
  --alpha-7-5: hsl(213 92% 5% / 8%);
  --alpha-70: hsl(213 92% 5% / 70%);
  --alpha-80: hsl(213 92% 5% / 80%);
  --alpha-90: hsl(213 92% 5% / 90%);
  --alpha-backdrop: hsl(0 0% 0% / 75%);
  --alpha-overlay: hsl(0 0% 100% / 60%);
  --artwork-foreground-black: hsl(0 0% 0%);
  --artwork-foreground-white: hsl(0 0% 100%);
  --background-1: hsl(214 37% 96%);
  --background-2: hsl(180 100% 100%);
  --border-high: hsl(218 17% 19%);
  --border-low: hsl(218 31% 90%);
  --border-medium: hsl(218 20% 68%);
  --brand: hsl(219 72% 20%);
  --brand-foreground: hsl(180 100% 100%);
  --card-1: hsl(180 100% 100%);
  --card-2: hsl(210 40% 98%);
  --card-3: hsl(214 37% 96%);
  --card-border: hsl(215 33% 93%);
  --card-solid: hsl(180 100% 100%);
  --card-x: hsl(0 76% 95% / 50%);
  --card-x-border: hsl(0 100% 42% / 50%);
  --chart-1: hsl(245 99% 68%);
  --chart-1-foreground: hsl(180 100% 100%);
  --cs-blob-1: hsl(0 0% 0%);
  --cs-blob-2: hsl(0 0% 0%);
  --cs-blob-3: hsl(0 0% 0%);
  --cs-game-black: hsl(0 0% 0%);
  --cs-game-black-foreground: hsl(180 100% 100%);
  --cs-game-green: hsl(99 95% 39%);
  --cs-game-green-foreground: hsl(180 100% 100%);
  --cs-game-red: hsl(0 100% 37%);
  --cs-game-red-foreground: hsl(180 100% 100%);
  --cs-nav-gradient-end: hsl(0 0% 0%);
  --cs-nav-gradient-foreground: hsl(0 0% 0%);
  --cs-nav-gradient-start: hsl(0 0% 0%);
  --cta-1: hsl(0 100% 46%);
  --cta-1-border: hsl(0 100% 46%);
  --cta-1-foreground: hsl(0 0% 100%);
  --cta-2: hsl(45 100% 51%);
  --cta-2-border: hsl(45 100% 51%);
  --cta-2-foreground: hsl(219 72% 20%);
  --cta-3: hsl(0 0% 50% / 0%);
  --cta-3-border: hsl(211 100% 32%);
  --cta-3-foreground: hsl(218 17% 19%);
  --cta-4: hsl(0 0% 0%);
  --cta-4-foreground: hsl(0 0% 100%);
  --danger: hsl(0 100% 46%);
  --danger-foreground: hsl(0 0% 100%);
  --danger-muted: hsl(13 100% 98%);
  --danger-text: hsl(0 100% 37%);
  --fill-high: hsl(219 18% 62%);
  --fill-low: hsl(214 37% 96%);
  --fill-medium: hsl(215 33% 93%);
  --focus: hsl(208 100% 69%);
  --foreground-high: hsl(218 17% 19%);
  --foreground-low: hsl(220 16% 57%);
  --foreground-medium: hsl(219 15% 40%);
  --informative: hsl(211 100% 50%);
  --informative-foreground: hsl(0 0% 100%);
  --informative-muted: hsl(204 100% 97%);
  --inv-accent: hsl(210 40% 98%);
  --inv-accent-foreground: hsl(218 17% 19%);
  --inv-alpha-0: hsl(0 0% 50% / 0%);
  --inv-alpha-10: hsl(210 40% 98% / 10%);
  --inv-alpha-2-5: hsl(210 40% 98% / 2%);
  --inv-alpha-20: hsl(210 40% 98% / 20%);
  --inv-alpha-30: hsl(210 40% 98% / 30%);
  --inv-alpha-40: hsl(210 40% 98% / 40%);
  --inv-alpha-5: hsl(210 40% 98% / 5%);
  --inv-alpha-50: hsl(210 40% 98% / 50%);
  --inv-alpha-60: hsl(210 40% 98% / 60%);
  --inv-alpha-7-5: hsl(210 40% 98% / 8%);
  --inv-alpha-70: hsl(210 40% 98% / 70%);
  --inv-alpha-80: hsl(210 40% 98% / 80%);
  --inv-alpha-90: hsl(210 40% 98% / 90%);
  --inv-alpha-backdrop: hsl(0 0% 0% / 75%);
  --inv-alpha-overlay: hsl(213 92% 5% / 60%);
  --inv-background-1: hsl(213 92% 5%);
  --inv-background-2: hsl(218 92% 5%);
  --inv-border-high: hsl(210 40% 98%);
  --inv-border-low: hsl(219 18% 62%);
  --inv-border-medium: hsl(219 21% 74%);
  --inv-brand: hsl(220 60% 95%);
  --inv-brand-foreground: hsl(218 17% 19%);
  --inv-card-1: hsl(216 73% 9%);
  --inv-card-2: hsl(216 73% 9% / 80%);
  --inv-card-3: hsl(224 43% 19%);
  --inv-card-border: hsl(219 28% 18%);
  --inv-card-solid: hsl(216 73% 9%);
  --inv-card-x: hsl(0 80% 14% / 50%);
  --inv-card-x-border: hsl(0 100% 26% / 50%);
  --inv-chart-1: hsl(245 99% 68%);
  --inv-chart-1-foreground: hsl(180 100% 100%);
  --inv-cta-1: hsl(0 100% 46%);
  --inv-cta-1-border: hsl(0 100% 46%);
  --inv-cta-1-foreground: hsl(0 0% 100%);
  --inv-cta-2: hsl(45 100% 51%);
  --inv-cta-2-border: hsl(45 100% 51%);
  --inv-cta-2-foreground: hsl(218 17% 19%);
  --inv-cta-3: hsl(0 0% 100% / 18%);
  --inv-cta-3-border: hsl(207 100% 76%);
  --inv-cta-3-foreground: hsl(180 100% 100%);
  --inv-cta-4: hsl(0 0% 100%);
  --inv-cta-4-foreground: hsl(0 0% 0%);
  --inv-danger: hsl(0 100% 76%);
  --inv-danger-foreground: hsl(218 17% 19%);
  --inv-danger-muted: hsl(0 100% 10%);
  --inv-danger-text: hsl(1 100% 89%);
  --inv-fill-high: hsl(217 48% 30%);
  --inv-fill-low: hsl(216 86% 14%);
  --inv-fill-medium: hsl(217 66% 20%);
  --inv-focus: hsl(206 100% 82%);
  --inv-foreground-high: hsl(210 40% 98%);
  --inv-foreground-low: hsl(218 20% 68%);
  --inv-foreground-medium: hsl(218 28% 86%);
  --inv-informative: hsl(206 100% 82%);
  --inv-informative-foreground: hsl(218 17% 19%);
  --inv-informative-muted: hsl(211 100% 15%);
  --inv-link: hsl(206 100% 82%);
  --inv-link-hover: hsl(208 100% 69%);
  --inv-link-visited: hsl(260 70% 82%);
  --inv-primary: hsl(211 100% 50%);
  --inv-primary-foreground: hsl(0 0% 100%);
  --inv-primary-muted: hsl(211 100% 26%);
  --inv-primary-text: hsl(206 100% 82%);
  --inv-success: hsl(168 59% 45%);
  --inv-success-foreground: hsl(0 0% 0%);
  --inv-success-muted: hsl(189 100% 10%);
  --inv-success-text: hsl(157 64% 74%);
  --inv-warning: hsl(55 100% 67%);
  --inv-warning-foreground: hsl(218 17% 19%);
  --inv-warning-muted: hsl(54 100% 12%);
  --inv-warning-text: hsl(55 100% 67%);
  --link: hsl(211 100% 46%);
  --link-hover: hsl(210 100% 56%);
  --link-visited: hsl(264 97% 62%);
  --logo-black: hsl(0 0% 0%);
  --logo-white: hsl(0 0% 100%);
  --nav-background-1: hsl(218 92% 9%);
  --nav-background-2: hsl(219 72% 20%);
  --nav-border-high: hsl(219 21% 74%);
  --nav-border-low: hsl(216 32% 39%);
  --nav-border-medium: hsl(211 100% 42%);
  --nav-button-fill-1: hsl(219 78% 31%);
  --nav-button-fill-2: hsl(219 78% 31%);
  --nav-button-fill-3: hsl(219 78% 31%);
  --nav-button-fill-4: hsl(219 78% 31%);
  --nav-fill: hsl(219 72% 20%);
  --nav-foreground-high: hsl(0 0% 100%);
  --nav-foreground-medium: hsl(219 21% 74%);
  --nav-gradient-end: hsl(219 72% 20%);
  --nav-gradient-start: hsl(219 72% 20%);
  --nav-logo: hsl(0 0% 100%);
  --odd-muted: hsl(203 100% 94%);
  --odd-muted-hover: hsl(203 100% 88%);
  --primary: hsl(211 100% 50%);
  --primary-foreground: hsl(0 0% 100%);
  --primary-muted: hsl(204 100% 97%);
  --primary-text: hsl(211 100% 46%);
  --sb-card-header: hsl(198 100% 84%);
  --sb-card-header-foreground: hsl(218 17% 19%);
  --sb-inv-card-header: hsl(199 22% 49%);
  --sb-inv-card-header-foreground: hsl(180 100% 100%);
  --success: hsl(99 95% 39%);
  --success-foreground: hsl(180 100% 100%);
  --success-muted: hsl(96 100% 97%);
  --success-text: hsl(98 100% 27%);
  --tone-blue: hsl(210 100% 56%);
  --tone-blue-foreground: hsl(180 100% 100%);
  --tone-bronze: hsl(23 43% 46%);
  --tone-bronze-foreground: hsl(180 100% 100%);
  --tone-flipped: hsl(0 0% 0%);
  --tone-flipped-foreground: hsl(180 100% 100%);
  --tone-gold: hsl(46 68% 47%);
  --tone-gold-foreground: hsl(218 17% 19%);
  --tone-gray: hsl(218 31% 90%);
  --tone-gray-foreground: hsl(218 17% 19%);
  --tone-green: hsl(99 100% 35%);
  --tone-green-foreground: hsl(180 100% 100%);
  --tone-jade: hsl(158 100% 31%);
  --tone-jade-foreground: hsl(180 100% 100%);
  --tone-navy: hsl(219 50% 47%);
  --tone-navy-foreground: hsl(180 100% 100%);
  --tone-orange: hsl(29 100% 45%);
  --tone-orange-foreground: hsl(180 100% 100%);
  --tone-pink: hsl(313 100% 45%);
  --tone-pink-foreground: hsl(180 100% 100%);
  --tone-purple: hsl(260 48% 54%);
  --tone-purple-foreground: hsl(180 100% 100%);
  --tone-red: hsl(0 100% 46%);
  --tone-red-foreground: hsl(180 100% 100%);
  --tone-silver: hsl(218 11% 66%);
  --tone-silver-foreground: hsl(218 17% 19%);
  --tone-yellow: hsl(54 92% 54%);
  --tone-yellow-foreground: hsl(218 17% 19%);
  --warning: hsl(45 100% 51%);
  --warning-foreground: hsl(218 17% 19%);
  --warning-muted: hsl(60 100% 97%);
  --warning-text: hsl(34 98% 40%);

  /* === Generated Interaction Tokens === */
  --primary-hover: hsl(211 100% 60%);
  --primary-active: hsl(211 100% 70%);
  --inv-primary-hover: hsl(211 100% 60%);
  --inv-primary-active: hsl(211 100% 70%);
  --fill-medium-hover: hsl(215 33% 83%);
  --fill-medium-active: hsl(215 33% 73%);
  --inv-fill-medium-hover: hsl(217 66% 30%);
  --inv-fill-medium-active: hsl(217 66% 40%);
  --transparent-hover: hsl(214 37% 4% / 10%);
  --transparent-active: hsl(214 37% 4% / 20%);
  --inv-transparent-hover: hsl(213 92% 95% / 10%);
  --inv-transparent-active: hsl(213 92% 95% / 20%);
  --fill-low-hover: hsl(214 37% 86%);
  --fill-low-active: hsl(214 37% 76%);
  --inv-fill-low-hover: hsl(216 86% 24%);
  --inv-fill-low-active: hsl(216 86% 34%);
  --primary-muted-hover: hsl(204 100% 87%);
  --primary-muted-active: hsl(204 100% 77%);
  --inv-primary-muted-hover: hsl(211 100% 36%);
  --inv-primary-muted-active: hsl(211 100% 46%);
  --foreground-high-hover: hsl(218 17% 34%);
  --inv-foreground-high-hover: hsl(211 100% 77%);
  --accent-hover: hsl(218 17% 29%);
  --accent-active: hsl(218 17% 39%);
  --inv-accent-hover: hsl(210 40% 88%);
  --inv-accent-active: hsl(210 40% 78%);
  --cta-1-hover: hsl(0 100% 56%);
  --cta-1-active: hsl(0 100% 66%);
  --inv-cta-1-hover: hsl(0 100% 56%);
  --inv-cta-1-active: hsl(0 100% 66%);
  --cta-2-hover: hsl(45 100% 61%);
  --cta-2-active: hsl(45 100% 71%);
  --inv-cta-2-hover: hsl(45 100% 61%);
  --inv-cta-2-active: hsl(45 100% 71%);
  --cta-3-hover: hsl(0 0% 50% / 10%);
  --cta-3-active: hsl(0 0% 50% / 20%);
  --inv-cta-3-hover: hsl(0 0% 100% / 28%);
  --inv-cta-3-active: hsl(0 0% 100% / 38%);
  --cta-4-hover: hsl(0 0% 10%);
  --cta-4-active: hsl(0 0% 20%);
  --inv-cta-4-hover: hsl(0 0% 90%);
  --inv-cta-4-active: hsl(0 0% 80%);
  --nav-transparent-hover: hsl(218 92% 91% / 10%);
  --nav-transparent-active: hsl(218 92% 91% / 20%);
  --nav-foreground-medium-hover: hsl(211 100% 77%);
}

.dark {
  --accent: hsl(210 40% 98%);
  --accent-foreground: hsl(218 17% 19%);
  --alpha-0: hsl(0 0% 50% / 0%);
  --alpha-10: hsl(210 40% 98% / 10%);
  --alpha-2-5: hsl(210 40% 98% / 2%);
  --alpha-20: hsl(210 40% 98% / 20%);
  --alpha-30: hsl(210 40% 98% / 30%);
  --alpha-40: hsl(210 40% 98% / 40%);
  --alpha-5: hsl(210 40% 98% / 5%);
  --alpha-50: hsl(210 40% 98% / 50%);
  --alpha-60: hsl(210 40% 98% / 60%);
  --alpha-7-5: hsl(210 40% 98% / 8%);
  --alpha-70: hsl(210 40% 98% / 70%);
  --alpha-80: hsl(210 40% 98% / 80%);
  --alpha-90: hsl(210 40% 98% / 90%);
  --alpha-backdrop: hsl(0 0% 0% / 75%);
  --alpha-overlay: hsl(213 92% 5% / 60%);
  --artwork-foreground-black: hsl(0 0% 0%);
  --artwork-foreground-white: hsl(0 0% 100%);
  --background-1: hsl(213 92% 5%);
  --background-2: hsl(218 92% 5%);
  --border-high: hsl(219 15% 51%);
  --border-low: hsl(218 16% 29%);
  --border-medium: hsl(219 15% 40%);
  --brand: hsl(220 60% 95%);
  --brand-foreground: hsl(218 17% 19%);
  --card-1: hsl(216 73% 9%);
  --card-2: hsl(216 73% 9% / 80%);
  --card-3: hsl(224 43% 19%);
  --card-border: hsl(219 28% 18%);
  --card-solid: hsl(216 73% 9%);
  --card-x: hsl(0 80% 14% / 50%);
  --card-x-border: hsl(0 100% 26% / 50%);
  --chart-1: hsl(245 99% 68%);
  --chart-1-foreground: hsl(180 100% 100%);
  --cs-blob-1: hsl(0 0% 0%);
  --cs-blob-2: hsl(0 0% 0%);
  --cs-blob-3: hsl(0 0% 0%);
  --cs-game-black: hsl(0 0% 0%);
  --cs-game-black-foreground: hsl(180 100% 100%);
  --cs-game-green: hsl(99 95% 39%);
  --cs-game-green-foreground: hsl(180 100% 100%);
  --cs-game-red: hsl(0 100% 37%);
  --cs-game-red-foreground: hsl(180 100% 100%);
  --cs-nav-gradient-end: hsl(0 0% 0%);
  --cs-nav-gradient-foreground: hsl(0 0% 0%);
  --cs-nav-gradient-start: hsl(0 0% 0%);
  --cta-1: hsl(0 100% 46%);
  --cta-1-border: hsl(0 100% 46%);
  --cta-1-foreground: hsl(0 0% 100%);
  --cta-2: hsl(45 100% 51%);
  --cta-2-border: hsl(45 100% 51%);
  --cta-2-foreground: hsl(219 72% 20%);
  --cta-3: hsl(0 0% 100% / 18%);
  --cta-3-border: hsl(207 100% 76%);
  --cta-3-foreground: hsl(180 100% 100%);
  --cta-4: hsl(0 0% 100%);
  --cta-4-foreground: hsl(0 0% 0%);
  --danger: hsl(0 100% 76%);
  --danger-foreground: hsl(218 17% 19%);
  --danger-muted: hsl(0 100% 10%);
  --danger-text: hsl(1 100% 89%);
  --fill-high: hsl(217 48% 30%);
  --fill-low: hsl(216 86% 14%);
  --fill-medium: hsl(217 66% 20%);
  --focus: hsl(206 100% 82%);
  --foreground-high: hsl(210 40% 98%);
  --foreground-low: hsl(218 20% 68%);
  --foreground-medium: hsl(218 28% 86%);
  --informative: hsl(206 100% 82%);
  --informative-foreground: hsl(218 17% 19%);
  --informative-muted: hsl(211 100% 15%);
  --inv-accent: hsl(218 17% 19%);
  --inv-accent-foreground: hsl(0 0% 100%);
  --inv-alpha-0: hsl(0 0% 50% / 0%);
  --inv-alpha-10: hsl(213 92% 5% / 10%);
  --inv-alpha-2-5: hsl(213 92% 5% / 2%);
  --inv-alpha-20: hsl(213 92% 5% / 20%);
  --inv-alpha-30: hsl(213 92% 5% / 30%);
  --inv-alpha-40: hsl(213 92% 5% / 40%);
  --inv-alpha-5: hsl(213 92% 5% / 5%);
  --inv-alpha-50: hsl(213 92% 5% / 50%);
  --inv-alpha-60: hsl(213 92% 5% / 60%);
  --inv-alpha-7-5: hsl(213 92% 5% / 8%);
  --inv-alpha-70: hsl(213 92% 5% / 70%);
  --inv-alpha-80: hsl(213 92% 5% / 80%);
  --inv-alpha-90: hsl(213 92% 5% / 90%);
  --inv-alpha-backdrop: hsl(0 0% 0% / 75%);
  --inv-alpha-overlay: hsl(0 0% 100% / 60%);
  --inv-background-1: hsl(214 37% 96%);
  --inv-background-2: hsl(180 100% 100%);
  --inv-border-high: hsl(218 17% 19%);
  --inv-border-low: hsl(218 31% 90%);
  --inv-border-medium: hsl(218 20% 68%);
  --inv-brand: hsl(219 72% 20%);
  --inv-brand-foreground: hsl(180 100% 100%);
  --inv-card-1: hsl(180 100% 100%);
  --inv-card-2: hsl(210 40% 98%);
  --inv-card-3: hsl(214 37% 96%);
  --inv-card-border: hsl(215 33% 93%);
  --inv-card-solid: hsl(180 100% 100%);
  --inv-card-x: hsl(0 76% 95% / 50%);
  --inv-card-x-border: hsl(0 100% 42% / 50%);
  --inv-chart-1: hsl(245 99% 68%);
  --inv-chart-1-foreground: hsl(180 100% 100%);
  --inv-cta-1: hsl(0 100% 46%);
  --inv-cta-1-border: hsl(0 100% 46%);
  --inv-cta-1-foreground: hsl(0 0% 100%);
  --inv-cta-2: hsl(45 100% 51%);
  --inv-cta-2-border: hsl(45 100% 51%);
  --inv-cta-2-foreground: hsl(218 17% 19%);
  --inv-cta-3: hsl(0 0% 50% / 0%);
  --inv-cta-3-border: hsl(211 100% 32%);
  --inv-cta-3-foreground: hsl(218 17% 19%);
  --inv-cta-4: hsl(0 0% 0%);
  --inv-cta-4-foreground: hsl(0 0% 100%);
  --inv-danger: hsl(0 100% 46%);
  --inv-danger-foreground: hsl(0 0% 100%);
  --inv-danger-muted: hsl(13 100% 98%);
  --inv-danger-text: hsl(0 100% 37%);
  --inv-fill-high: hsl(219 18% 62%);
  --inv-fill-low: hsl(214 37% 96%);
  --inv-fill-medium: hsl(215 33% 93%);
  --inv-focus: hsl(208 100% 69%);
  --inv-foreground-high: hsl(218 17% 19%);
  --inv-foreground-low: hsl(220 16% 57%);
  --inv-foreground-medium: hsl(219 15% 40%);
  --inv-informative: hsl(211 100% 50%);
  --inv-informative-foreground: hsl(0 0% 100%);
  --inv-informative-muted: hsl(204 100% 97%);
  --inv-link: hsl(211 100% 46%);
  --inv-link-hover: hsl(210 100% 56%);
  --inv-link-visited: hsl(264 97% 62%);
  --inv-primary: hsl(211 100% 50%);
  --inv-primary-foreground: hsl(0 0% 100%);
  --inv-primary-muted: hsl(204 100% 97%);
  --inv-primary-text: hsl(211 100% 46%);
  --inv-success: hsl(99 95% 39%);
  --inv-success-foreground: hsl(180 100% 100%);
  --inv-success-muted: hsl(96 100% 97%);
  --inv-success-text: hsl(98 100% 27%);
  --inv-warning: hsl(45 100% 51%);
  --inv-warning-foreground: hsl(218 17% 19%);
  --inv-warning-muted: hsl(60 100% 97%);
  --inv-warning-text: hsl(34 98% 40%);
  --link: hsl(206 100% 82%);
  --link-hover: hsl(208 100% 69%);
  --link-visited: hsl(260 70% 82%);
  --logo-black: hsl(0 0% 0%);
  --logo-white: hsl(0 0% 100%);
  --nav-background-1: hsl(218 92% 9%);
  --nav-background-2: hsl(219 72% 20%);
  --nav-border-high: hsl(219 21% 74%);
  --nav-border-low: hsl(216 32% 39%);
  --nav-border-medium: hsl(211 100% 42%);
  --nav-button-fill-1: hsl(219 78% 31%);
  --nav-button-fill-2: hsl(219 78% 31%);
  --nav-button-fill-3: hsl(219 78% 31%);
  --nav-button-fill-4: hsl(219 78% 31%);
  --nav-fill: hsl(219 72% 20%);
  --nav-foreground-high: hsl(0 0% 100%);
  --nav-foreground-medium: hsl(219 21% 74%);
  --nav-gradient-end: hsl(219 72% 20%);
  --nav-gradient-start: hsl(219 72% 20%);
  --nav-logo: hsl(0 0% 100%);
  --odd-muted: hsl(211 100% 21%);
  --odd-muted-hover: hsl(211 100% 10%);
  --primary: hsl(211 100% 50%);
  --primary-foreground: hsl(0 0% 100%);
  --primary-muted: hsl(211 100% 26%);
  --primary-text: hsl(206 100% 82%);
  --sb-card-header: hsl(199 22% 49%);
  --sb-card-header-foreground: hsl(180 100% 100%);
  --sb-inv-card-header: hsl(198 100% 84%);
  --sb-inv-card-header-foreground: hsl(218 17% 19%);
  --success: hsl(168 59% 45%);
  --success-foreground: hsl(0 0% 0%);
  --success-muted: hsl(189 100% 10%);
  --success-text: hsl(157 64% 74%);
  --tone-blue: hsl(210 100% 56%);
  --tone-blue-foreground: hsl(180 100% 100%);
  --tone-bronze: hsl(23 43% 46%);
  --tone-bronze-foreground: hsl(180 100% 100%);
  --tone-flipped: hsl(0 0% 0%);
  --tone-flipped-foreground: hsl(180 100% 100%);
  --tone-gold: hsl(46 68% 47%);
  --tone-gold-foreground: hsl(218 17% 19%);
  --tone-gray: hsl(218 31% 90%);
  --tone-gray-foreground: hsl(218 17% 19%);
  --tone-green: hsl(99 100% 35%);
  --tone-green-foreground: hsl(180 100% 100%);
  --tone-jade: hsl(158 80% 55%);
  --tone-jade-foreground: hsl(218 17% 19%);
  --tone-navy: hsl(219 50% 47%);
  --tone-navy-foreground: hsl(180 100% 100%);
  --tone-orange: hsl(29 100% 45%);
  --tone-orange-foreground: hsl(180 100% 100%);
  --tone-pink: hsl(313 100% 45%);
  --tone-pink-foreground: hsl(180 100% 100%);
  --tone-purple: hsl(260 48% 54%);
  --tone-purple-foreground: hsl(180 100% 100%);
  --tone-red: hsl(0 100% 46%);
  --tone-red-foreground: hsl(180 100% 100%);
  --tone-silver: hsl(218 11% 66%);
  --tone-silver-foreground: hsl(218 17% 19%);
  --tone-yellow: hsl(54 92% 54%);
  --tone-yellow-foreground: hsl(218 17% 19%);
  --warning: hsl(55 100% 67%);
  --warning-foreground: hsl(218 17% 19%);
  --warning-muted: hsl(54 100% 12%);
  --warning-text: hsl(55 100% 67%);

  /* === Generated Interaction Tokens === */
  --primary-hover: hsl(211 100% 60%);
  --primary-active: hsl(211 100% 70%);
  --inv-primary-hover: hsl(211 100% 60%);
  --inv-primary-active: hsl(211 100% 70%);
  --fill-medium-hover: hsl(217 66% 30%);
  --fill-medium-active: hsl(217 66% 40%);
  --inv-fill-medium-hover: hsl(215 33% 83%);
  --inv-fill-medium-active: hsl(215 33% 73%);
  --transparent-hover: hsl(213 92% 95% / 10%);
  --transparent-active: hsl(213 92% 95% / 20%);
  --inv-transparent-hover: hsl(214 37% 4% / 10%);
  --inv-transparent-active: hsl(214 37% 4% / 20%);
  --fill-low-hover: hsl(216 86% 24%);
  --fill-low-active: hsl(216 86% 34%);
  --inv-fill-low-hover: hsl(214 37% 86%);
  --inv-fill-low-active: hsl(214 37% 76%);
  --primary-muted-hover: hsl(211 100% 36%);
  --primary-muted-active: hsl(211 100% 46%);
  --inv-primary-muted-hover: hsl(204 100% 87%);
  --inv-primary-muted-active: hsl(204 100% 77%);
  --foreground-high-hover: hsl(211 100% 77%);
  --inv-foreground-high-hover: hsl(218 17% 34%);
  --accent-hover: hsl(210 40% 88%);
  --accent-active: hsl(210 40% 78%);
  --inv-accent-hover: hsl(218 17% 29%);
  --inv-accent-active: hsl(218 17% 39%);
  --cta-1-hover: hsl(0 100% 56%);
  --cta-1-active: hsl(0 100% 66%);
  --inv-cta-1-hover: hsl(0 100% 56%);
  --inv-cta-1-active: hsl(0 100% 66%);
  --cta-2-hover: hsl(45 100% 61%);
  --cta-2-active: hsl(45 100% 71%);
  --inv-cta-2-hover: hsl(45 100% 61%);
  --inv-cta-2-active: hsl(45 100% 71%);
  --cta-3-hover: hsl(0 0% 100% / 28%);
  --cta-3-active: hsl(0 0% 100% / 38%);
  --inv-cta-3-hover: hsl(0 0% 50% / 10%);
  --inv-cta-3-active: hsl(0 0% 50% / 20%);
  --cta-4-hover: hsl(0 0% 90%);
  --cta-4-active: hsl(0 0% 80%);
  --inv-cta-4-hover: hsl(0 0% 10%);
  --inv-cta-4-active: hsl(0 0% 20%);
  --nav-transparent-hover: hsl(218 92% 91% / 10%);
  --nav-transparent-active: hsl(218 92% 91% / 20%);
  --nav-foreground-medium-hover: hsl(211 100% 77%);
}