/* UIComponents: identity design tokens. Process CMYK is approximate. */
:root, [data-brand="uicomponents"] {
  --brand-primary: #DB2777;
  --brand-primary-rgb: 219 39 119;
  --brand-secondary: #CA8A04;
  --brand-secondary-rgb: 202 138 4;
  --brand-ink: #291727;
  --brand-ink-rgb: 41 23 39;
  --brand-paper: #FEF6FA;
  --brand-paper-rgb: 254 246 250;
  --brand-white: #FFFFFF;
  --brand-white-rgb: 255 255 255;
  --brand-black: #111111;
  --brand-black-rgb: 17 17 17;
  --brand-font-display: "Menlo";
  --brand-font-weight: 700;
  --brand-clear-space-ratio: 0.125;
  --brand-unit-at-128: 16px;
  --brand-min-horizontal-width: 229px;
  --brand-min-stacked-width: 104px;
  --brand-min-wordmark-width: 95px;
  --brand-min-symbol-width: 32px;
  --brand-min-avatar-width: 48px;
  --brand-reverse-primary: #DB2777;
  --brand-reverse-secondary: #CA8A04;
  --brand-reverse-ink: #70646F;
}

/* Assigned, bundled supporting families; logo lettering remains the selected artwork. */
:root, [data-brand="uicomponents"] {
  --brand-font-display: "IBM Plex Mono";
  --brand-font-body: "Source Sans 3";
  --brand-clear-space-ratio: 0.125;
  --brand-unit-at-128: 16px;
}