/* ============================================================
   Nossa Bússola — TABLET EM PÉ (a partir de 600px de largura, na vertical). Carregada com <link media=>.
   É o desenho do celular ocupando a tela inteira: abas embaixo, cartões largos, janelas no centro.
   Deitado, o tablet cai na versão desktop (desktop.css). Celular não entra aqui.
   ============================================================ */
@media (min-width: 600px) and (orientation: portrait) {
  .app { max-width: none; margin: 0; --nb-screen-pad: 40px; }
  .tela { padding-left: var(--nb-screen-pad); padding-right: var(--nb-screen-pad); }
  .appbar { padding-top: 20px; }
  .appbar.grande .tit { font-size: var(--nb-text-3xl); }

  /* abas embaixo, na largura toda, sem espalhar os botões demais */
  .tabbar { max-width: none; justify-content: center; gap: 24px; padding-left: 24px; padding-right: 24px; }
  .tabbar button { flex: 0 1 160px; }

  /* módulos em 3 colunas; pares de indicadores mais folgados */
  .grade2:has(> .tile) { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
  .grade2:has(> .card.stat) { gap: 14px; }
  .linha { min-height: 60px; }

  /* botão flutuante, chat e aviso acompanham a largura nova */
  .fab { right: 40px; }
  .sd-chat-form { max-width: none; padding-left: 40px; padding-right: 40px; }
  .toast { max-width: 520px; }

  /* janelas abrem no centro, como diálogo */
  .sheet-fundo { align-items: center; padding: 32px; }
  .sheet { max-width: 600px; border-radius: var(--nb-radius-lg); padding: 24px 32px 32px; max-height: 88vh; animation: none; }
  .sheet .alca { display: none; }

  /* entrada */
  .perfis { max-width: 460px; margin: 0 auto; padding-top: 14vh; }
}
