/* ============================================================================
   design-system.css — o ÚNICO arquivo que um consumidor linka.
   Só @import — nenhuma regra mora aqui. Ordem importa: tokens → adições →
   (shell tokens ANTES do tema escuro) → componentes → casca → telas.
   ========================================================================== */

/* --- tokens base (v2, reescritos no lugar — D-DS2-2) -------------------- */
@import url("tokens/typography.css");
@import url("tokens/colors.css");
@import url("tokens/spacing.css");
@import url("tokens/radius.css");
@import url("tokens/elevation.css");
@import url("tokens/motion.css");
@import url("tokens/base.css");

/* --- adições ------------------------------------------------------------ */
@import url("tokens/semantic-extras.css");    /* tokens que substituem literais do dump */
@import url("tokens/component-metrics.css");  /* dimensões intrínsecas dos componentes */
@import url("tokens/shell.css");              /* casca (sidebar) e prévia de conversa */
@import url("tokens/atendente.css");          /* tela do Atendente (tile, glifo, coluna da prévia) */
@import url("tokens/painel.css");            /* tela do Painel (data viz + métricas) */
@import url("tokens/theme-dark.css");         /* html[data-theme="dark"] */
@import url("tokens/login-hero.css");         /* exceção documentada: vitrine da tela de login */

/* --- camada de componente --------------------------------------------- */
@import url("components.css");

/* --- casca e telas ------------------------------------------------------ */
@import url("shell.css");                     /* casca do painel */
@import url("screens/atendente.css");         /* tela do Atendente */
@import url("screens/painel.css");           /* tela do Painel */