@import 'tailwindcss';

/* TODO: Documentation for how this will work in the wild. */
@source "../../../packages/react";

@theme {
  --font-sans:
    InterVariable, ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
    'Noto Color Emoji';
}

.body {
  @apply antialiased font-[510] font-sans text-[0.8125rem] @7xl/root:text-[0.9375rem] leading-normal tracking-[-0.0125em];
}

:root {
  font-feature-settings: 'cv01', 'ss01', 'ss03';
}

/* Make reduced-transparency variant */
@custom-variant reduced-transparency @media (prefers-reduced-transparency: reduce);