:root {
  /* Dusk Blue Theme System - Primary Accent */
  --color-primary-accent: #3d5a80;      /* Core branding, focus, active states */
  --color-secondary-accent: #98c1d9;    /* Muted borders, secondary indicators */
  --color-success: #8acb88;             /* Confirmed states, validation green */
  --color-destructive: #ee6c4d;         /* Destructive actions, delete states */
  --color-highlight: #ede7b1;           /* Soft background highlights, alert fills */

  /* Surface and Background Canvas Layers */
  --color-bg-base: #f5f5f7;             /* Off-White: Body page background */
  --color-bg-surface: #ffffff;          /* Pure White: Content containers & inputs */
  --color-text-primary: #1a1a1a;        /* Off-Black: Highly legible typography */
  --color-text-muted: #666666;          /* Charcoal: Secondary text & descriptors */
  --color-border: #e5e7eb;              /* Light Gray: Soft layout boundaries */
  --color-border-hover: #cbd5e1;        /* Medium Gray: Input border hover state */
  
  /* Semi-transparent Blend Layers */
  --color-overlay-bg: rgba(26, 26, 26, 0.5); /* Modal blur backdrops */
  --color-neutral-shaded: rgba(26, 26, 26, 0.05); /* List alternate row shading */

  /* Structural Geometry Scales */
  --border-radius-sm: 4px;              /* Maximum sharp corner clip */
  --grid-gap-base: 20px;                /* Uniform layout gap density */
  --interactive-height: 44px;           /* Touch surface accessible bounds */
}