.template-root[data-brand="theme-5"] {
  /* color */
  --brand-tokens-brand-100: #fff4ed;
  --brand-tokens-brand-200: #ffe5d4;
  --brand-tokens-brand-300: #ffc7a8;
  --brand-tokens-brand-400: #ffa071;
  --brand-tokens-brand-50: #ffffff;
  --brand-tokens-brand-500: #ff6d38;
  --brand-tokens-brand-600: #fe4711;
  --brand-tokens-brand-700: #ef2c07;
  --brand-tokens-brand-800: #c61d08;
  --brand-tokens-brand-900: #c61d08;
  --brand-tokens-brand-950: #7e1810;
  --brand-tokens-greyscale-10: #ffffff;
  --brand-tokens-greyscale-100: #d5d5d5;
  --brand-tokens-greyscale-1000: #0e0d0c;
  --brand-tokens-greyscale-200: #bdbdbd;
  --brand-tokens-greyscale-300: #959595;
  --brand-tokens-greyscale-400: #7b7b7b;
  --brand-tokens-greyscale-50: #efefef;
  --brand-tokens-greyscale-500: #666666;
  --brand-tokens-greyscale-600: #5f5f5f;
  --brand-tokens-greyscale-700: #4a4948;
  --brand-tokens-greyscale-800: #1d1b1a;
  --brand-tokens-greyscale-900: #151210;
  --brand-tokens-greyscale-950: #131110;
  /* string */
  --brand-tokens-typography-body: "Google Sans Flex";
  --brand-tokens-typography-labels: "Google Sans Flex";
  --brand-tokens-typography-titles-a: "Anton";
  --brand-tokens-typography-titles-b: "Stack Sans Headline";
  /* tint (hand-authored, moved from render/styles/tint.css) */
  --tint-light: var(--brand-tokens-brand-200); /* #ffe5d4 apricot (100 is near-white) */
}