@mixin cygnus-reach-tokens() {
  /* background */
  --background-primary: light-dark(
    var(--color-neutral-10),
    var(--color-neutral-90)
  );
  --background-secondary: light-dark(
    var(--color-neutral-20),
    var(--color-neutral-80)
  );
  --background-tertiary: light-dark(
    var(--color-neutral-30),
    var(--color-neutral-70)
  );
  --background-brand: light-dark(
    var(--color-primary-60),
    var(--color-primary-70)
  );
  --background-brandDisabled: light-dark(
    var(--color-primary-20),
    var(--color-primary-40)
  );
  --background-inverse: light-dark(
    var(--color-neutral-90),
    var(--color-neutral-10)
  );

  /* surface */
  --surface-primary: light-dark(
    var(--color-neutral-white),
    var(--color-neutral-70)
  );
  --surface-secondary: light-dark(
    var(--color-neutral-10),
    var(--color-neutral-60)
  );
  --surface-tertiary: light-dark(
    var(--color-neutral-20),
    var(--color-neutral-50)
  );
  --surface-disabled: light-dark(
    var(--color-neutral-20),
    var(--color-neutral-80)
  );
  --surface-transparent: light-dark(
    var(--color-neutral-transparent),
    var(--color-neutral-transparent)
  );

  /* surface/brand */
  --surface-brandPrimary: light-dark(
    var(--color-primary-60),
    var(--color-primary-70)
  );
  --surface-brandSecondary: light-dark(
    var(--color-primary-70),
    var(--color-primary-80)
  );
  --surface-brandTertiary: light-dark(
    var(--color-primary-80),
    var(--color-primary-90)
  );
  --surface-brandLight: light-dark(
    var(--color-primary-transparent20),
    var(--color-primary-transparent20)
  );
  /* surface/neutral */
  --surface-neutralPrimary: light-dark(
    var(--color-neutral-60),
    var(--color-neutral-10)
  );
  --surface-neutralSecondary: light-dark(
    var(--color-neutral-70),
    var(--color-neutral-20)
  );
  --surface-neutralTertiary: light-dark(
    var(--color-neutral-80),
    var(--color-neutral-30)
  );
  --surface-neutralLight: light-dark(
    var(--color-neutral-20),
    var(--color-neutral-whiteTransparent20)
  );
  /* surface/success */
  --surface-successPrimary: light-dark(
    var(--color-success-60),
    var(--color-success-60)
  );
  --surface-successSecondary: light-dark(
    var(--color-success-80),
    var(--color-success-80)
  );
  --surface-successTertiary: light-dark(
    var(--color-success-90),
    var(--color-success-90)
  );
  --surface-successLight: light-dark(
    var(--color-success-20),
    var(--color-success-transparent20)
  );
  /* surface/warning */
  --surface-warningPrimary: light-dark(
    var(--color-warning-60),
    var(--color-warning-60)
  );
  --surface-warningSecondary: light-dark(
    var(--color-warning-80),
    var(--color-warning-80)
  );
  --surface-warningTertiary: light-dark(
    var(--color-warning-90),
    var(--color-warning-90)
  );
  --surface-warningLight: light-dark(
    var(--color-warning-20),
    var(--color-warning-transparent20)
  );
  /* surface/error */
  --surface-errorPrimary: light-dark(
    var(--color-error-60),
    var(--color-error-60)
  );
  --surface-errorSecondary: light-dark(
    var(--color-error-80),
    var(--color-error-80)
  );
  --surface-errorTertiary: light-dark(
    var(--color-error-90),
    var(--color-error-90)
  );
  --surface-errorLight: light-dark(
    var(--color-error-20),
    var(--color-error-transparent20)
  );

  /* text */
  --text-primary: light-dark(var(--color-neutral-90), var(--color-neutral-10));
  --text-secondary: light-dark(
    var(--color-neutral-80),
    var(--color-neutral-20)
  );
  --text-tertiary: light-dark(var(--color-neutral-70), var(--color-neutral-30));
  --text-disabled: light-dark(var(--color-neutral-40), var(--color-neutral-40));
  --text-inverse: light-dark(
    var(--color-neutral-white),
    var(--color-neutral-90)
  );
  --text-brand: light-dark(var(--color-primary-70), var(--color-primary-60));
  --text-onFill: light-dark(
    var(--color-neutral-white),
    var(--color-neutral-white)
  );
  --text-onFillDisabled: light-dark(
    var(--color-neutral-whiteTransparent90),
    var(--color-neutral-whiteTransparent90)
  );
  --text-success: light-dark(var(--color-success-60), var(--color-success-60));
  --text-warning: light-dark(var(--color-warning-80), var(--color-warning-40));
  --text-error: light-dark(var(--color-error-60), var(--color-error-40));

  /* icon */
  --icon-primary: light-dark(var(--color-neutral-90), var(--color-neutral-10));
  --icon-secondary: light-dark(
    var(--color-neutral-80),
    var(--color-neutral-20)
  );
  --icon-tertiary: light-dark(var(--color-neutral-70), var(--color-neutral-30));
  --icon-disabled: light-dark(var(--color-neutral-40), var(--color-neutral-40));
  --icon-inverse: light-dark(
    var(--color-neutral-white),
    var(--color-neutral-90)
  );
  --icon-brand: light-dark(var(--color-primary-60), var(--color-primary-60));
  --icon-brandLight: light-dark(
    var(--color-primary-40),
    var(--color-primary-40)
  );
  --icon-onFill: light-dark(
    var(--color-neutral-white),
    var(--color-neutral-white)
  );
  --icon-onFillDisabled: light-dark(
    var(--color-neutral-whiteTransparent75),
    var(--color-neutral-whiteTransparent75)
  );
  --icon-success: light-dark(var(--color-success-60), var(--color-success-60));
  --icon-warning: light-dark(var(--color-warning-60), var(--color-warning-40));
  --icon-error: light-dark(var(--color-error-60), var(--color-error-40));

  /* border */
  --border-primary: light-dark(
    var(--color-neutral-30),
    var(--color-neutral-60)
  );
  --border-secondary: light-dark(
    var(--color-neutral-20),
    var(--color-neutral-50)
  );
  --border-tertiary: light-dark(
    var(--color-neutral-10),
    var(--color-neutral-40)
  );
  --border-disabled: light-dark(
    var(--color-neutral-30),
    var(--color-neutral-40)
  );
  --border-brand: light-dark(var(--color-primary-60), var(--color-primary-60));
  --border-brandDisabled: light-dark(
    var(--color-primary-30),
    var(--color-primary-70)
  );
  --border-neutral: light-dark(
    var(--color-neutral-60),
    var(--color-neutral-10)
  );
  --border-neutralDisabled: light-dark(
    var(--color-neutral-40),
    var(--color-neutral-40)
  );
  --border-success: light-dark(
    var(--color-success-60),
    var(--color-success-60)
  );
  --border-successDisabled: light-dark(
    var(--color-success-40),
    var(--color-success-40)
  );
  --border-warning: light-dark(
    var(--color-warning-60),
    var(--color-warning-60)
  );
  --border-warningDisabled: light-dark(
    var(--color-warning-40),
    var(--color-warning-40)
  );
  --border-error: light-dark(var(--color-error-60), var(--color-error-60));
  --border-errorDisabled: light-dark(
    var(--color-error-40),
    var(--color-error-40)
  );

  /* ui */
  --ui-divider: light-dark(var(--color-neutral-20), var(--color-neutral-70));
  --ui-overlay: light-dark(
    var(--color-neutral-blackTransparent35),
    var(--color-neutral-blackTransparent35)
  );
  --ui-system: light-dark(
    var(--color-neutral-black),
    var(--color-neutral-white)
  );
}
