/* ListQR — shared brand design-token package (ported 1:1 from Claude Design).
   This is the single source of truth for brand color, type, spacing & motion.
   Link THIS file before component CSS (site.css); it @imports every token.
   The app ships the same values in TheTrueQRAPP/src/theme/tokens.ts. */
@import url("tokens/fonts.css");
@import url("tokens/colors.css");
@import url("tokens/typography.css");
@import url("tokens/spacing.css");

/* Back-compat aliases: the website component CSS uses short font-var names. */
:root{
  --disp:var(--font-display);
  --ui:var(--font-ui);
  --ar:var(--font-ar);
  --mono:var(--font-mono);
}