:root[theme="dark"] {
  /* Primary Brand Colors */
  --u-color-primary:           var(--u-blue-600);
  --u-color-primary-light:     var(--u-blue-500);
  --u-color-primary-dark:      var(--u-blue-700);
  --u-color-primary-hover:     var(--u-blue-700);

  /* Background Colors */
  --u-color-background:        var(--u-neutral-100);
  --u-color-surface:           var(--u-neutral-200);
  --u-color-surface-elevated:  var(--u-neutral-300);

  /* Border Colors */
  --u-color-border:            var(--u-border-color);
  --u-color-border-light:      var(--u-border-color-weak);
  --u-color-border-strong:     var(--u-border-color-strong);

  /* Text Colors */
  --u-color-text:              var(--u-text-color);
  --u-color-text-secondary:    var(--u-soft-text-color);
  --u-color-text-tertiary:     var(--u-neutral-600);
  --u-color-text-inverse:      var(--u-text-color-inverse);

  /* Semantic Colors */
  --u-color-success:           var(--u-green-600);
  --u-color-success-light:     var(--u-green-200);
  --u-color-warning:           var(--u-yellow-600);
  --u-color-warning-light:     var(--u-yellow-200);
  --u-color-error:             var(--u-red-600);
  --u-color-error-light:       var(--u-red-200);
  --u-color-info:              var(--u-blue-600);
  --u-color-info-light:        var(--u-blue-200);

  /* Shadow */
  --u-shadow-sm:               0 1px 2px var(--u-shadow-weak);
  --u-shadow-md:               0 4px 6px var(--u-shadow-normal);
  --u-shadow-lg:               0 10px 15px var(--u-shadow-medium);
  --u-shadow-xl:               0 20px 25px var(--u-shadow-strong);
}