<!doctype html>
<html lang="pt-BR" translate="no">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="google" content="notranslate">
    
    <!-- Preload critical fonts for LCP optimization -->
    <link rel="preload" href="/fonts/inter-latin-400.woff2" as="font" type="font/woff2" crossorigin>
    <link rel="preload" href="/fonts/inter-latin-600.woff2" as="font" type="font/woff2" crossorigin>
    
    <title>Macpet</title>
    <meta name="description" content="Macpet" />
    <meta name="author" content="Macpet" />
    
    <meta property="og:description" content="Macpet" />
    <meta property="og:type" content="website" />
    <meta property="og:image" content="https://storage.googleapis.com/gpt-engineer-file-uploads/MzuKDiMQmwUX4V96MQXlKd1eZzg1/social-images/social-1768958443272-macpet-sede.png">

    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:site" content="@macpet" />
    <meta name="twitter:image" content="https://storage.googleapis.com/gpt-engineer-file-uploads/MzuKDiMQmwUX4V96MQXlKd1eZzg1/social-images/social-1768958443272-macpet-sede.png">
    
    <link rel="icon" href="/favicon.ico" sizes="any">
    <link rel="icon" type="image/png" href="/favicon.png">

    <!-- Route hints for Lovable editor — injected synchronously before React mounts -->
    <script>
      window.__LOVABLE_ROUTE_HINTS__ = [
        "/",
        "/esqueci-senha",
        "/resetar-senha",
        "/p/demo",
        "/painel",
        "/metas",
        "/comercial",
        "/admin",
        "/admin/audit-logs",
        "/admin/api-docs",
        "/admin/bubble-sync",
        "/sku",
        "/estoque",
        "/crm",
        "/crm/reativacao-itens",
        "/crm/reativacao-estoque",
        "/import-data",
        "/query-debug",
        "/changelog",
        "/pesquisas",
        "/chatbot",
        "/despesas",
        "/fretes",
        "/193",
        "/qualidade",
        "/qualidade/rnc",
        "/melhorias",
        "/pcp",
        "/programacao",
        "/calculadora",
        "/admin/calculadora",
        "/rh",
        "/usuarios"
      ];
    </script>
    <meta property="og:title" content="Macpet">
    <meta name="twitter:title" content="Macpet">

    <!-- Critical CSS for login page (eliminates render-blocking) -->
    <style id="critical-css">
/* Reset + font */
*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid}
html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:'Inter',system-ui,sans-serif}
body{margin:0;-webkit-font-smoothing:antialiased}

/* CSS Variables (light mode for login) */
:root{
--background:220 20% 96%;--foreground:222 47% 11%;
--primary:0 72% 50%;--primary-foreground:0 0% 100%;
--muted-foreground:215 20% 40%;
--border:220 13% 82%;--input:220 13% 82%;--ring:0 72% 50%;
--radius:0.625rem;
}

/* Layout */
.min-h-screen{min-height:100vh}
.flex{display:flex}
.hidden{display:none}
.w-full{width:100%}
.relative{position:relative}
.absolute{position:absolute}
.inset-0{inset:0}
.overflow-hidden{overflow:hidden}
.items-center{align-items:center}
.justify-center{justify-content:center}
.flex-col{flex-direction:column}
.justify-end{justify-content:flex-end}

/* Spacing */
.p-8{padding:2rem}
.p-12{padding:3rem}
.space-y-8>:not([hidden])~:not([hidden]){margin-top:2rem}
.space-y-6>:not([hidden])~:not([hidden]){margin-top:1.5rem}
.space-y-2>:not([hidden])~:not([hidden]){margin-top:0.5rem}
.space-x-2>:not([hidden])~:not([hidden]){margin-left:0.5rem}
.mt-2{margin-top:0.5rem}
.mr-2{margin-right:0.5rem}
.pt-4{padding-top:1rem}
.gap-2{gap:0.5rem}
.gap-3{gap:0.75rem}

/* Sizing */
.max-w-md{max-width:28rem}
.h-10{height:2.5rem}
.h-12{height:3rem}
.h-5{height:1.25rem}
.w-5{width:1.25rem}
.w-auto{width:auto}
.w-48{width:12rem}
.h-48{height:12rem}
.w-64{width:16rem}
.h-32{height:8rem}
.w-96{width:24rem}

/* Typography */
.text-center{text-align:center}
.text-3xl{font-size:1.875rem;line-height:2.25rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-base{font-size:1rem;line-height:1.5rem}
.text-sm{font-size:0.875rem;line-height:1.25rem}
.font-bold{font-weight:700}
.font-medium{font-weight:500}
.font-normal{font-weight:400}
.whitespace-nowrap{white-space:nowrap}
.leading-none{line-height:1}

/* Colors */
.bg-white{background-color:#fff}
.bg-gray-50{background-color:#f9fafb}
.bg-gray-600{background-color:#4b5563}
.bg-gray-900{background-color:#111827}
.text-white{color:#fff}
.text-gray-900{color:#111827}
.text-gray-700{color:#374151}
.text-gray-600{color:#4b5563}
.text-gray-500{color:#6b7280}
.text-gray-400{color:#9ca3af}
.border-gray-200{border-color:#e5e7eb}

/* Form elements */
.rounded-md{border-radius:calc(var(--radius) - 2px)}
.rounded-lg{border-radius:var(--radius)}
.rounded-full{border-radius:9999px}
.border{border-width:1px}
.px-3{padding-left:0.75rem;padding-right:0.75rem}
.py-2{padding-top:0.5rem;padding-bottom:0.5rem}
.pr-12{padding-right:3rem}
input{font-family:inherit;font-size:100%;line-height:inherit;color:inherit;margin:0;padding:0}
input:focus{outline:none}
.placeholder\:text-gray-400::-moz-placeholder{color:#9ca3af}
.placeholder\:text-gray-400::placeholder{color:#9ca3af}

/* Button */
button{font-family:inherit;font-size:100%;line-height:inherit;color:inherit;margin:0;padding:0;cursor:pointer;background-color:transparent}
.inline-flex{display:inline-flex}
.px-4{padding-left:1rem;padding-right:1rem}

/* States */
.hover\:bg-gray-700:hover{background-color:#374151}
.hover\:text-primary:hover{color:hsl(0,72%,50%)}
.transition-colors{transition-property:color,background-color,border-color;transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-duration:150ms}
.disabled\:opacity-50:disabled{opacity:0.5}
.disabled\:pointer-events-none:disabled{pointer-events:none}
.focus\:border-primary:focus{border-color:hsl(0,72%,50%)}

/* Responsive */
@media(min-width:1024px){
.lg\:flex{display:flex}
.lg\:w-1\/2{width:50%}
}

/* Video side */
.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}
.from-red-900\/50{--tw-gradient-from:rgb(127 29 29/0.5);--tw-gradient-to:rgb(127 29 29/0);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.via-gray-900{--tw-gradient-to:rgb(17 24 39/0);--tw-gradient-stops:var(--tw-gradient-from),#111827,var(--tw-gradient-to)}
.to-green-900\/30{--tw-gradient-to:rgb(20 83 45/0.3)}
.opacity-0{opacity:0}
.opacity-100{opacity:1}
.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-duration:150ms}
.duration-700{transition-duration:700ms}
.object-cover{-o-object-fit:cover;object-fit:cover}
.z-10{z-index:10}
.pointer-events-none{pointer-events:none}
.blur-3xl{filter:blur(64px)}
.blur-2xl{filter:blur(40px)}
.rotate-45{transform:rotate(45deg)}
.grid{display:grid}
.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}
.-top-4{top:-1rem}
.-left-4{left:-1rem}
.-top-8{top:-2rem}
.right-0{right:0}
.bottom-0{bottom:0}
.left-0{left:0}
.top-12{top:3rem}
.left-12{left:3rem}
.bottom-12{bottom:3rem}
.right-12{right:3rem}
.bg-white\/30{background-color:rgb(255 255 255/0.3)}
.text-white\/80{color:rgb(255 255 255/0.8)}
.mb-2{margin-bottom:0.5rem}
    </style>
    <script type="module" crossorigin src="/assets/index-BKWVTuW7.js"></script>
    <link rel="modulepreload" crossorigin href="/assets/vendor-react-CG_OoK01.js">
    <link rel="modulepreload" crossorigin href="/assets/vendor-query-DNw7Ydp4.js">
    <link rel="modulepreload" crossorigin href="/assets/vendor-recharts-I6XTa_nK.js">
    <link rel="modulepreload" crossorigin href="/assets/vendor-supabase-B07dSRCg.js">
    <link rel="modulepreload" crossorigin href="/assets/vendor-forms-BZCh8OBU.js">
    <link rel="stylesheet" crossorigin href="/assets/index-C9epmD2J.css" media="print" onload="this.media='all'">
  <noscript><link rel="stylesheet" href="/assets/index-C9epmD2J.css"></noscript>
</head>

  <body>
    <div id="root"></div>
  </body>
</html>
