Bordas e Sombras

Bordas e sombras não são um detalhe decorativo: elas estruturam a percepção de profundidade, separam as zonas clicáveis das zonas de informação e dão identidade aos componentes de um design system. Quando um border-radius passa de 12px para 0 em todos os cards de um site, é toda a identidade visual que muda de um universo "moderno e acolhedor" para uma renderização "rígida" sem que nenhum teste funcional sinalize qualquer coisa. Em interfaces de negócio, uma sombra removida de um botão de ação principal o torna visualmente plano e menos perceptível, o que se traduz em erros de uso. As regressões dessa categoria nascem com frequência de um reset CSS introduzido para resolver um caso isolado, de uma limpeza de folha de estilos que remove um box-shadow considerado inútil, de uma mudança na ordem de carregamento entre staging e produção que altera a cascata, ou de uma borda adicionada sem tratar border-collapse em uma tabela, o que cria bordas duplas irregulares. Os outline e os separadores de acessibilidade também são afetados por redesigns globais, com consequências diretas no foco visível. O Delta-QA trata essa categoria comparando as capturas de referência a cada nova versão: a análise pixel detecta as mudanças de raio, o aparecimento ou desaparecimento de uma sombra, as variações de espessura de traço e as modificações de cor de borda. O diff visual localiza cada card, cada botão e cada separador cuja aparência mudou, o que permite validar um redesign de tokens de elevação ou de raio via regressão visual sem ter que comparar manualmente os componentes um a um.