Lição 4: RTL e PWA — UI que funciona nos dois idiomas e se instala como um app

Um app fintech israelense conhecido: lindo — mas números alinhados à esquerda, botões vazando da tela no iOS, e uma fonte em inglês em conteúdo em hebraico. Quatro bugs em uma única captura de tela. Todos evitáveis com propriedades lógicas do CSS.

Uma propriedade lógica do CSS entende a direção do texto. Em vez de 'adicionar espaço à esquerda', ela diz 'adicionar espaço no início'. Em RTL, o 'início' é a direita. Em LTR, o 'início' é a esquerda.

CSS logical properties: Propriedades de CSS que se referem à direção do texto ('start', 'end') em vez da direção física ('left', 'right'). Funcionam corretamente tanto em RTL quanto em LTR.
PWA (Progressive Web App): Um app web que pode ser instalado na tela inicial do iOS/Android, funciona offline e aparece sem barra de endereço, como um app nativo.
BiDi (Bidirectional text): Texto que mistura direções — hebraico com números estrangeiros, nomes de marcas em inglês dentro de frases em hebraico. O `<bdi>` do HTML e o `unicode-bidi` do CSS lidam com isso.