/* Tecas — cabeçalho em ecrãs estreitos (27/10/2026, aprovado pelo Nuno).
   Problema: abaixo de ~412px (com «Painel», abaixo de ~440px) os ícones do cabeçalho passavam do ecrã e a página deslizava para o lado.
   Solução: margens e espaços mais curtos e ícones de 40px (alvo de toque ≥ 40px); quando não há espaço, o logótipo fica só com o
   emblema (o nome «Tecas» está no próprio emblema; o texto continua lá para leitores de ecrã). Todos os ícones continuam visíveis,
   incluindo «Painel» (só administradores), até 320px. Cores da marca e fotografias não mudam. */
@media(max-width:449.98px){
 header.cab{padding:.4rem .55rem;gap:.3rem}
 .cab .logo{flex:none;min-width:0}
 .cab .logo img{width:40px;height:40px}
 .cab-menu{min-width:40px;min-height:40px;padding:0 .3rem}
 .cab .cab-icones{gap:.15rem;min-width:0}
 .cab .cab-icones .ic{width:40px;height:40px;flex:none}
 .cab .cab-icones .ic.ic-painel{width:auto;min-width:40px;height:40px;padding:0 .55rem;justify-content:center}
 .cab .ic svg{width:22px;height:22px}
 .cab:has(.ic-painel) .logo{gap:0}
 .cab:has(.ic-painel) .logo .logo-t{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
@media(max-width:399.98px){
 .cab .logo{gap:0}
 .cab .logo .logo-t{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}