/* ─────────────────────────────────────────────────────────────────
     Chrome Android <111 fallback — OKLCH / color-mix(in oklab,...)
     ─────────────────────────────────────────────────────────────────
     Tailwind v4 compila modifiers de opacidade (bg-X/40, text-X/80)
     pra `color-mix(in oklab, …)` e a paleta `text-green-700`,
     `bg-emerald-50` etc. pra `oklch(...)`. Chrome Android <111 (muito
     comum em celulares mais simples no campo) não suporta nenhuma das
     duas → texto/fundo viram fantasma, repaint corrompe e a tela
     "treme" no scroll (issue clássico: Dashboard v21, AnimalProfile v22).

     Gate duplo: dispara se o browser NÃO suporta OKLCH OU NÃO suporta
     color-mix(in oklab,...). Browsers modernos (Chrome 111+, Safari
     16.4+, Firefox 113+) ignoram completamente este bloco.

     CSS gerado a partir das classes REALMENTE usadas em pages/
     e components/ (script em scripts/, regenerar quando adicionar
     classes Tailwind novas que dependam de oklch/color-mix).
     ───────────────────────────────────────────────────────────────── */
@supports (not (color: oklch(0% 0 0))) or (not (color: color-mix(in oklab, black, white))) {
  .bg-background { background-color: hsl(120, 20%, 98%) !important; }
  .text-teal-700 { color: #0f766e !important; }
  .bg-border\/60 { background-color: hsla(120, 15%, 90%, 0.6) !important; }
  .bg-border\/40 { background-color: hsla(120, 15%, 90%, 0.4) !important; }
  .bg-border\/50 { background-color: hsla(120, 15%, 90%, 0.5) !important; }
  .text-background { color: hsl(120, 20%, 98%) !important; }
  .border-background { border-color: hsl(120, 20%, 98%) !important; }
  .bg-foreground { background-color: hsl(140, 30%, 15%) !important; }
  .text-foreground { color: hsl(140, 30%, 15%) !important; }
  .border-foreground { border-color: hsl(140, 30%, 15%) !important; }
  .bg-card { background-color: hsl(0, 0%, 100%) !important; }
  .text-card { color: hsl(0, 0%, 100%) !important; }
  .border-card { border-color: hsl(0, 0%, 100%) !important; }
  .bg-card-foreground { background-color: hsl(140, 30%, 15%) !important; }
  .text-card-foreground { color: hsl(140, 30%, 15%) !important; }
  .border-card-foreground { border-color: hsl(140, 30%, 15%) !important; }
  .bg-primary { background-color: hsl(142, 60%, 25%) !important; }
  .text-primary { color: hsl(142, 60%, 25%) !important; }
  .border-primary { border-color: hsl(142, 60%, 25%) !important; }
  .bg-primary-foreground { background-color: hsl(0, 0%, 100%) !important; }
  .text-primary-foreground { color: hsl(0, 0%, 100%) !important; }
  .border-primary-foreground { border-color: hsl(0, 0%, 100%) !important; }
  .bg-secondary { background-color: hsl(130, 30%, 90%) !important; }
  .text-secondary { color: hsl(130, 30%, 90%) !important; }
  .border-secondary { border-color: hsl(130, 30%, 90%) !important; }
  .bg-muted { background-color: hsl(120, 10%, 94%) !important; }
  .text-muted { color: hsl(120, 10%, 94%) !important; }
  .border-muted { border-color: hsl(120, 10%, 94%) !important; }
  .bg-muted-foreground { background-color: hsl(140, 10%, 45%) !important; }
  .text-muted-foreground { color: hsl(140, 10%, 45%) !important; }
  .border-muted-foreground { border-color: hsl(140, 10%, 45%) !important; }
  .bg-accent { background-color: hsl(32, 95%, 44%) !important; }
  .text-accent { color: hsl(32, 95%, 44%) !important; }
  .border-accent { border-color: hsl(32, 95%, 44%) !important; }
  .bg-destructive { background-color: hsl(0, 70%, 50%) !important; }
  .text-destructive { color: hsl(0, 70%, 50%) !important; }
  .border-destructive { border-color: hsl(0, 70%, 50%) !important; }
  .bg-border { background-color: hsl(120, 15%, 90%) !important; }
  .text-border { color: hsl(120, 15%, 90%) !important; }
  .border-border { border-color: hsl(120, 15%, 90%) !important; }
  .bg-input { background-color: hsl(120, 15%, 90%) !important; }
  .text-input { color: hsl(120, 15%, 90%) !important; }
  .border-input { border-color: hsl(120, 15%, 90%) !important; }
  .bg-ring { background-color: hsl(142, 60%, 25%) !important; }
  .text-ring { color: hsl(142, 60%, 25%) !important; }
  .border-ring { border-color: hsl(142, 60%, 25%) !important; }
  * { border-color: hsl(120, 15%, 90%); }
  .bg-muted\/40 { background-color: hsla(120, 10%, 94%, 0.4) !important; }
  .bg-muted\/50 { background-color: hsla(120, 10%, 94%, 0.5) !important; }
  .bg-muted\/60 { background-color: hsla(120, 10%, 94%, 0.6) !important; }
  .bg-muted\/70 { background-color: hsla(120, 10%, 94%, 0.7) !important; }
  .bg-primary\/5 { background-color: hsla(142, 60%, 25%, 0.05) !important; }
  .bg-primary\/10 { background-color: hsla(142, 60%, 25%, 0.1) !important; }
  .bg-primary\/15 { background-color: hsla(142, 60%, 25%, 0.15) !important; }
  .bg-primary\/20 { background-color: hsla(142, 60%, 25%, 0.2) !important; }
  .bg-primary\/30 { background-color: hsla(142, 60%, 25%, 0.3) !important; }
  .bg-primary\/90 { background-color: hsla(142, 60%, 25%, 0.9) !important; }
  .bg-destructive\/10 { background-color: hsla(0, 70%, 50%, 0.1) !important; }
  .text-foreground\/50 { color: hsla(140, 30%, 15%, 0.5) !important; }
  .text-foreground\/60 { color: hsla(140, 30%, 15%, 0.6) !important; }
  .text-foreground\/80 { color: hsla(140, 30%, 15%, 0.8) !important; }
  .text-muted-foreground\/40 { color: hsla(140, 10%, 45%, 0.4) !important; }
  .text-muted-foreground\/50 { color: hsla(140, 10%, 45%, 0.5) !important; }
  .text-muted-foreground\/60 { color: hsla(140, 10%, 45%, 0.6) !important; }
  .text-muted-foreground\/70 { color: hsla(140, 10%, 45%, 0.7) !important; }
  .text-primary\/60 { color: hsla(142, 60%, 25%, 0.6) !important; }
  .text-primary\/70 { color: hsla(142, 60%, 25%, 0.7) !important; }
  .text-primary\/80 { color: hsla(142, 60%, 25%, 0.8) !important; }
  .text-primary\/85 { color: hsla(142, 60%, 25%, 0.85) !important; }
  .border-border\/30 { border-color: hsla(120, 15%, 90%, 0.3) !important; }
  .border-border\/40 { border-color: hsla(120, 15%, 90%, 0.4) !important; }
  .border-border\/50 { border-color: hsla(120, 15%, 90%, 0.5) !important; }
  .border-border\/60 { border-color: hsla(120, 15%, 90%, 0.6) !important; }
  .border-primary\/15 { border-color: hsla(142, 60%, 25%, 0.15) !important; }
  .border-primary\/20 { border-color: hsla(142, 60%, 25%, 0.2) !important; }
  .border-primary\/30 { border-color: hsla(142, 60%, 25%, 0.3) !important; }
  .border-primary\/40 { border-color: hsla(142, 60%, 25%, 0.4) !important; }
  .border-primary\/50 { border-color: hsla(142, 60%, 25%, 0.5) !important; }
  .border-destructive\/30 { border-color: hsla(0, 70%, 50%, 0.3) !important; }
  .border-destructive\/50 { border-color: hsla(0, 70%, 50%, 0.5) !important; }
  .border-muted\/40 { border-color: hsla(120, 10%, 94%, 0.4) !important; }
  .border-muted-foreground\/40 { border-color: hsla(140, 10%, 45%, 0.4) !important; }
  .text-white { color: rgb(255, 255, 255) !important; }
  .text-white\/40 { color: rgba(255, 255, 255, 0.4) !important; }
  .text-white\/50 { color: rgba(255, 255, 255, 0.5) !important; }
  .text-white\/55 { color: rgba(255, 255, 255, 0.55) !important; }
  .text-white\/60 { color: rgba(255, 255, 255, 0.6) !important; }
  .text-white\/70 { color: rgba(255, 255, 255, 0.7) !important; }
  .text-white\/75 { color: rgba(255, 255, 255, 0.75) !important; }
  .text-white\/80 { color: rgba(255, 255, 255, 0.8) !important; }
  .text-white\/85 { color: rgba(255, 255, 255, 0.85) !important; }
  .text-black { color: rgb(0, 0, 0) !important; }
  .bg-white { background-color: rgb(255, 255, 255) !important; }
  .bg-white\/10 { background-color: rgba(255, 255, 255, 0.1) !important; }
  .bg-white\/15 { background-color: rgba(255, 255, 255, 0.15) !important; }
  .bg-white\/20 { background-color: rgba(255, 255, 255, 0.2) !important; }
  .bg-white\/25 { background-color: rgba(255, 255, 255, 0.25) !important; }
  .bg-white\/30 { background-color: rgba(255, 255, 255, 0.3) !important; }
  .bg-white\/60 { background-color: rgba(255, 255, 255, 0.6) !important; }
  .bg-white\/90 { background-color: rgba(255, 255, 255, 0.9) !important; }
  .bg-black { background-color: rgb(0, 0, 0) !important; }
  .bg-black\/50 { background-color: rgba(0, 0, 0, 0.5) !important; }
  .border-white { border-color: rgb(255, 255, 255) !important; }
  .border-white\/20 { border-color: rgba(255, 255, 255, 0.2) !important; }
  .border-white\/25 { border-color: rgba(255, 255, 255, 0.25) !important; }
  .border-white\/30 { border-color: rgba(255, 255, 255, 0.3) !important; }
  .border-white\/40 { border-color: rgba(255, 255, 255, 0.4) !important; }
  .border-black { border-color: rgb(0, 0, 0) !important; }
  /* Gradient defaults — Tailwind v4 emits color-mix for gradient stops; force literal stops */
  [class*="bg-gradient-to"] { background-image: var(--tw-bg-gradient, none); }
  .bg-gradient-to-br.from-primary.to-primary\/70 {
    background-image: linear-gradient(to bottom right, hsl(142, 60%, 25%), hsla(142, 60%, 25%, 0.7)) !important;
  }
  .bg-gradient-to-r.from-primary.to-primary\/80 {
    background-image: linear-gradient(to right, hsl(142, 60%, 25%), hsla(142, 60%, 25%, 0.8)) !important;
  }

  /* ── Paleta Tailwind (apenas classes em uso) ──────────────── */
  .bg-amber-100 { background-color: #fef3c7 !important; }
  .bg-amber-200 { background-color: #fde68a !important; }
  .bg-amber-300 { background-color: #fcd34d !important; }
  .bg-amber-50 { background-color: #fffbeb !important; }
  .bg-amber-500 { background-color: #f59e0b !important; }
  .bg-amber-700 { background-color: #b45309 !important; }
  .bg-blue-100 { background-color: #dbeafe !important; }
  .bg-blue-200 { background-color: #bfdbfe !important; }
  .bg-blue-400\/40 { background-color: rgba(96, 165, 250, 0.4) !important; }
  .bg-blue-50 { background-color: #eff6ff !important; }
  .bg-blue-600 { background-color: #2563eb !important; }
  .bg-cyan-100 { background-color: #cffafe !important; }
  .bg-emerald-100 { background-color: #d1fae5 !important; }
  .bg-emerald-50 { background-color: #ecfdf5 !important; }
  .bg-emerald-50\/60 { background-color: rgba(236, 253, 245, 0.6) !important; }
  .bg-emerald-500 { background-color: #10b981 !important; }
  .bg-emerald-600 { background-color: #059669 !important; }
  .bg-emerald-700 { background-color: #047857 !important; }
  .bg-gray-100 { background-color: #f3f4f6 !important; }
  .bg-gray-200 { background-color: #e5e7eb !important; }
  .bg-gray-400\/40 { background-color: rgba(156, 163, 175, 0.4) !important; }
  .bg-gray-50 { background-color: #f9fafb !important; }
  .bg-green-100 { background-color: #dcfce7 !important; }
  .bg-green-50 { background-color: #f0fdf4 !important; }
  .bg-green-50\/40 { background-color: rgba(240, 253, 244, 0.4) !important; }
  .bg-green-600 { background-color: #16a34a !important; }
  .bg-indigo-100 { background-color: #e0e7ff !important; }
  .bg-lime-100 { background-color: #ecfccb !important; }
  .bg-orange-100 { background-color: #ffedd5 !important; }
  .bg-orange-400 { background-color: #fb923c !important; }
  .bg-orange-50 { background-color: #fff7ed !important; }
  .bg-orange-50\/40 { background-color: rgba(255, 247, 237, 0.4) !important; }
  .bg-orange-50\/50 { background-color: rgba(255, 247, 237, 0.5) !important; }
  .bg-orange-500 { background-color: #f97316 !important; }
  .bg-orange-600 { background-color: #ea580c !important; }
  .bg-pink-100 { background-color: #fce7f3 !important; }
  .bg-pink-50 { background-color: #fdf2f8 !important; }
  .bg-purple-100 { background-color: #f3e8ff !important; }
  .bg-purple-50 { background-color: #faf5ff !important; }
  .bg-purple-600 { background-color: #9333ea !important; }
  .bg-purple-700 { background-color: #7e22ce !important; }
  .bg-red-100 { background-color: #fee2e2 !important; }
  .bg-red-50 { background-color: #fef2f2 !important; }
  .bg-red-50\/50 { background-color: rgba(254, 242, 242, 0.5) !important; }
  .bg-red-50\/60 { background-color: rgba(254, 242, 242, 0.6) !important; }
  .bg-red-600 { background-color: #dc2626 !important; }
  .bg-red-700 { background-color: #b91c1c !important; }
  .bg-rose-100 { background-color: #ffe4e6 !important; }
  .bg-rose-50 { background-color: #fff1f2 !important; }
  .bg-rose-600 { background-color: #e11d48 !important; }
  .bg-rose-700 { background-color: #be123c !important; }
  .bg-sky-100 { background-color: #e0f2fe !important; }
  .bg-sky-50 { background-color: #f0f9ff !important; }
  .bg-sky-50\/60 { background-color: rgba(240, 249, 255, 0.6) !important; }
  .bg-sky-600 { background-color: #0284c7 !important; }
  .bg-sky-700 { background-color: #0369a1 !important; }
  .bg-slate-100 { background-color: #f1f5f9 !important; }
  .bg-slate-200 { background-color: #e2e8f0 !important; }
  .bg-teal-100 { background-color: #ccfbf1 !important; }
  .bg-teal-50 { background-color: #f0fdfa !important; }
  .bg-yellow-100 { background-color: #fef9c3 !important; }
  .bg-zinc-100 { background-color: #f4f4f5 !important; }
  .border-amber-200 { border-color: #fde68a !important; }
  .border-amber-300 { border-color: #fcd34d !important; }
  .border-amber-400 { border-color: #fbbf24 !important; }
  .border-blue-200 { border-color: #bfdbfe !important; }
  .border-blue-300 { border-color: #93c5fd !important; }
  .border-blue-400 { border-color: #60a5fa !important; }
  .border-cyan-400 { border-color: #22d3ee !important; }
  .border-emerald-200 { border-color: #a7f3d0 !important; }
  .border-emerald-300 { border-color: #6ee7b7 !important; }
  .border-emerald-400 { border-color: #34d399 !important; }
  .border-emerald-500 { border-color: #10b981 !important; }
  .border-gray-200 { border-color: #e5e7eb !important; }
  .border-gray-300 { border-color: #d1d5db !important; }
  .border-gray-400 { border-color: #9ca3af !important; }
  .border-gray-700 { border-color: #374151 !important; }
  .border-gray-800 { border-color: #1f2937 !important; }
  .border-green-200 { border-color: #bbf7d0 !important; }
  .border-green-300 { border-color: #86efac !important; }
  .border-green-500 { border-color: #22c55e !important; }
  .border-indigo-200 { border-color: #c7d2fe !important; }
  .border-indigo-400 { border-color: #818cf8 !important; }
  .border-lime-400 { border-color: #a3e635 !important; }
  .border-orange-200 { border-color: #fed7aa !important; }
  .border-orange-300 { border-color: #fdba74 !important; }
  .border-orange-400 { border-color: #fb923c !important; }
  .border-pink-200 { border-color: #fbcfe8 !important; }
  .border-pink-400 { border-color: #f472b6 !important; }
  .border-purple-200 { border-color: #e9d5ff !important; }
  .border-purple-300 { border-color: #d8b4fe !important; }
  .border-purple-400 { border-color: #c084fc !important; }
  .border-red-200 { border-color: #fecaca !important; }
  .border-red-300 { border-color: #fca5a5 !important; }
  .border-red-400 { border-color: #f87171 !important; }
  .border-red-900\/40 { border-color: rgba(127, 29, 29, 0.4) !important; }
  .border-rose-100 { border-color: #ffe4e6 !important; }
  .border-rose-200 { border-color: #fecdd3 !important; }
  .border-rose-300 { border-color: #fda4af !important; }
  .border-rose-400 { border-color: #fb7185 !important; }
  .border-sky-100 { border-color: #e0f2fe !important; }
  .border-sky-200 { border-color: #bae6fd !important; }
  .border-slate-400 { border-color: #94a3b8 !important; }
  .border-teal-400 { border-color: #2dd4bf !important; }
  .border-yellow-400 { border-color: #facc15 !important; }
  .border-zinc-400 { border-color: #a1a1aa !important; }
  .from-blue-600 { --tw-gradient-from: #2563eb; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent) !important; }
  .from-cyan-600 { --tw-gradient-from: #0891b2; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent) !important; }
  .from-emerald-500 { --tw-gradient-from: #10b981; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent) !important; }
  .from-indigo-600 { --tw-gradient-from: #4f46e5; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent) !important; }
  .from-orange-500 { --tw-gradient-from: #f97316; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent) !important; }
  .from-purple-600 { --tw-gradient-from: #9333ea; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent) !important; }
  .from-sky-500 { --tw-gradient-from: #0ea5e9; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent) !important; }
  .text-amber-500 { color: #f59e0b !important; }
  .text-amber-600 { color: #d97706 !important; }
  .text-amber-700 { color: #b45309 !important; }
  .text-amber-800 { color: #92400e !important; }
  .text-amber-900 { color: #78350f !important; }
  .text-blue-500 { color: #3b82f6 !important; }
  .text-blue-600 { color: #2563eb !important; }
  .text-blue-700 { color: #1d4ed8 !important; }
  .text-blue-800 { color: #1e40af !important; }
  .text-blue-900 { color: #1e3a8a !important; }
  .text-cyan-700 { color: #0e7490 !important; }
  .text-emerald-300 { color: #6ee7b7 !important; }
  .text-emerald-400 { color: #34d399 !important; }
  .text-emerald-600 { color: #059669 !important; }
  .text-emerald-700 { color: #047857 !important; }
  .text-emerald-800 { color: #065f46 !important; }
  .text-emerald-800\/80 { color: rgba(6, 95, 70, 0.8) !important; }
  .text-emerald-900 { color: #064e3b !important; }
  .text-gray-400 { color: #9ca3af !important; }
  .text-gray-500 { color: #6b7280 !important; }
  .text-gray-600 { color: #4b5563 !important; }
  .text-gray-700 { color: #374151 !important; }
  .text-gray-800 { color: #1f2937 !important; }
  .text-gray-900 { color: #111827 !important; }
  .text-green-600 { color: #16a34a !important; }
  .text-green-700 { color: #15803d !important; }
  .text-green-700\/80 { color: rgba(21, 128, 61, 0.8) !important; }
  .text-green-700\/90 { color: rgba(21, 128, 61, 0.9) !important; }
  .text-green-800 { color: #166534 !important; }
  .text-green-900 { color: #14532d !important; }
  .text-indigo-700 { color: #4338ca !important; }
  .text-lime-700 { color: #4d7c0f !important; }
  .text-orange-500 { color: #f97316 !important; }
  .text-orange-600 { color: #ea580c !important; }
  .text-orange-700 { color: #c2410c !important; }
  .text-orange-800 { color: #9a3412 !important; }
  .text-pink-700 { color: #be185d !important; }
  .text-purple-600 { color: #9333ea !important; }
  .text-purple-700 { color: #7e22ce !important; }
  .text-red-300 { color: #fca5a5 !important; }
  .text-red-400 { color: #f87171 !important; }
  .text-red-50 { color: #fef2f2 !important; }
  .text-red-500 { color: #ef4444 !important; }
  .text-red-600 { color: #dc2626 !important; }
  .text-red-700 { color: #b91c1c !important; }
  .text-red-800 { color: #991b1b !important; }
  .text-rose-600 { color: #e11d48 !important; }
  .text-rose-700 { color: #be123c !important; }
  .text-rose-700\/80 { color: rgba(190, 18, 60, 0.8) !important; }
  .text-sky-700 { color: #0369a1 !important; }
  .text-sky-700\/80 { color: rgba(3, 105, 161, 0.8) !important; }
  .text-slate-400 { color: #94a3b8 !important; }
  .text-slate-600 { color: #475569 !important; }
  .text-slate-700 { color: #334155 !important; }
  .text-yellow-600 { color: #ca8a04 !important; }
  .text-yellow-700 { color: #a16207 !important; }
  .text-zinc-600 { color: #52525b !important; }
  .to-blue-700 { --tw-gradient-to: #1d4ed8 !important; }
  .to-cyan-700 { --tw-gradient-to: #0e7490 !important; }
  .to-emerald-700 { --tw-gradient-to: #047857 !important; }
  .to-indigo-700 { --tw-gradient-to: #4338ca !important; }
  .to-sky-600 { --tw-gradient-to: #0284c7 !important; }
  }