Frontend completo (Etapas 11-18) e extensões de backend (Etapas 13 e 18)

Adiciona o frontend Next.js em frontend/ (setup, design system,
autenticação/tema, layout/navegação, área master, área tenant completa:
clientes, produtos, vendas, recebimentos, whatsapp, e-mail, alertas,
equipe e perfil). Estende o backend de forma aditiva e autorizada:
cookie httpOnly para refresh token (Etapa 13) e CRUD de equipe +
edição de perfil do tenant (Etapa 18, módulo src/modules/equipe/ novo
e PUT /tenant/perfil). Detalhes completos em Etapas/V2/*.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

frontend/hooks/use-media-query.ts

@@ -0,0 +1,32 @@
+'use client';
+
+import { useSyncExternalStore } from 'react';
+
+function subscribe(query: string, callback: () => void) {
+  const mql = window.matchMedia(query);
+  mql.addEventListener('change', callback);
+  return () => mql.removeEventListener('change', callback);
+}
+
+/**
+ * Fonte única de verdade para os breakpoints usados por componentes que
+ * mudam de comportamento entre desktop e mobile (Table ↔ cards,
+ * Modal ↔ Sheet). SSR-safe: retorna `false` no servidor e sincroniza no
+ * client via `useSyncExternalStore`, evitando mismatch de hidratação.
+ */
+export function useMediaQuery(query: string): boolean {
+  return useSyncExternalStore(
+    (callback) => subscribe(query, callback),
+    () => window.matchMedia(query).matches,
+    () => false,
+  );
+}
+
+/** Breakpoint `md` (768px) do schema de arquitetura — desktop acima, mobile abaixo. */
+export function useIsDesktop(): boolean {
+  return useMediaQuery('(min-width: 768px)');
+}
+
+export function usePrefersReducedMotion(): boolean {
+  return useMediaQuery('(prefers-reduced-motion: reduce)');
+}