.template-root[data-brand="theme-3"] {
  /* color */
  --brand-tokens-brand-100: #f5e0b1;
  --brand-tokens-brand-200: #fee4c5;
  --brand-tokens-brand-300: #fdd19d;
  --brand-tokens-brand-400: #e7b545;
  --brand-tokens-brand-50: #fcf7ea;
  --brand-tokens-brand-500: #fdbe75;
  --brand-tokens-brand-600: #fcab4d;
  --brand-tokens-brand-700: #fb9116;
  --brand-tokens-brand-800: #d57404;
  --brand-tokens-brand-900: #9e5603;
  --brand-tokens-brand-950: #824702;
  --brand-tokens-greyscale-10: #fef8f0;
  --brand-tokens-greyscale-100: #f5e2c7;
  --brand-tokens-greyscale-1000: #000000;
  --brand-tokens-greyscale-200: #ded1bd;
  --brand-tokens-greyscale-300: #cbb798;
  --brand-tokens-greyscale-400: #b99c72;
  --brand-tokens-greyscale-50: #fffbea;
  --brand-tokens-greyscale-500: #a28151;
  --brand-tokens-greyscale-600: #7c633e;
  --brand-tokens-greyscale-700: #57462b;
  --brand-tokens-greyscale-800: #312819;
  --brand-tokens-greyscale-900: #0c0a06;
  --brand-tokens-greyscale-950: #0a0906;
  /* string */
  --brand-tokens-typography-body: "Inter Tight";
  --brand-tokens-typography-labels: "Inter Tight";
  --brand-tokens-typography-titles-a: "Source Serif 4";
  --brand-tokens-typography-titles-b: "Source Serif 4";
  /* tint (hand-authored, moved from render/styles/tint.css) */
  /* Ramp quirk: brand-100 (#f5e0b1) is stronger than brand-200 — 200 is the wash. */
  --tint-light: var(--brand-tokens-brand-200); /* #fee4c5 peach cream */
}