feat(ui): unify global visual identity, theme tokens and report filters

frontend/src/pages/app/DashboardPage.tsx

@@ -229,7 +229,7 @@ export default function DashboardPage() {
       )}
 
       {hasError && !isLoading && (
-        <p className="rounded-xl border border-red-900/80 bg-red-950/40 px-4 py-3 text-sm text-red-200">
+        <p className="rounded-xl border px-4 py-3 text-sm text-[var(--ui-danger)]" style={{ borderColor: 'color-mix(in srgb, var(--ui-danger) 55%, var(--ui-border))', backgroundColor: 'color-mix(in srgb, var(--ui-danger) 12%, transparent)' }}>
           Alguns dados não foram carregados. As métricas visíveis podem estar incompletas.
         </p>
       )}
@@ -345,7 +345,14 @@ export default function DashboardPage() {
               <p className={isLight ? 'text-slate-600' : 'text-slate-400'}>Documentos emitidos no período</p>
               <p className={`text-xl font-semibold ${isLight ? 'text-slate-900' : 'text-white'}`}>{metrics.periodDocsCount}</p>
             </div>
-            <div className={`rounded-lg border px-3 py-2 ${isLight ? 'border-amber-200 bg-amber-50 text-amber-900' : 'border-amber-800/70 bg-amber-950/30 text-amber-100'}`}>
+            <div
+              className="rounded-lg border px-3 py-2"
+              style={{
+                borderColor: 'color-mix(in srgb, var(--ui-warning) 55%, var(--ui-border))',
+                backgroundColor: 'color-mix(in srgb, var(--ui-warning) 12%, transparent)',
+                color: 'var(--ui-warning)',
+              }}
+            >
               <p className="text-xs uppercase tracking-wide">Ação recomendada</p>
               <p className="mt-1">
                 {metrics.byStatus.completed > 0