<meta name="viewport">
O acordo com a tela pequena: sem ele, o celular finge ser um desktop de 980 pixels.
Sem esta linha, o navegador do celular assume que a página foi feita para desktop: renderiza numa janela imaginária de uns 980 pixels e encolhe o resultado até caber. width=device-width, initial-scale=1 desfaz o teatro — a página assume a largura real do aparelho.
viewport-fit=cover estende a página para trás do recorte da câmera, com env(safe-area-inset-*) no CSS protegendo o conteúdo. O mito nocivo é user-scalable=no: travar o zoom é barreira de acessibilidade, e os navegadores modernos fazem o favor de ignorar o pedido.
<meta name="viewport"
content="width=device-width, initial-scale=1, viewport-fit=cover">