/* Tokens de design Z360 -- variante clara (base: projects/z360-mockup/styles.css) */
:root{
  --bg:#eef3f7;
  --surface:#ffffff;
  --surface-2:#f6f9fb;
  --navy:#001e3b;
  --navy-2:#0e355a;
  --cyan:#09a5c1;
  --cyan-1:#e3f4f7;
  --cyan-2:#b7e3ea;
  --cyan-3:#7ecdda;
  --cyan-4:#3bafc4;
  --cyan-5:#077b91;
  --mint:#22c7ae;
  --violet:#8b3fb0;
  --magenta:#c24fd6;
  --glow:#cbfaf5;
  --line:#dbe5ee;
  --line-strong:#c4d3e0;
  --ink:#0f2438;
  --ink-soft:#5c7186;
  --ink-faint:#8698a8;
  --ok:#1f9d73;
  --warn:#e0a516;
  --crit:#c0392b;
  /* Severidade X.733 - a escala tem que ler como rampa, com Maior e Menor
     distinguiveis a olho: crit vermelho > maior LARANJA > menor AMARELO >
     info ciano. --warn (ambar) continua servindo o resto da plataforma;
     Maior ganha laranja proprio para nao empatar com o amarelo de Menor. */
  --sev-maior:#e8720c;
  --sev-menor:#d4a017;
  --radius:14px;
  --shadow-card:0 1px 2px rgba(15,36,56,.04), 0 8px 24px -12px rgba(15,36,56,.14);
  --shadow-pop:0 4px 10px rgba(15,36,56,.08), 0 20px 40px -16px rgba(15,36,56,.22);
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;height:100%;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:'Inter',system-ui,sans-serif;
  font-size:14px;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.display{
  font-family:'Poppins',system-ui,sans-serif;
  letter-spacing:-0.01em;
  text-wrap:balance;
  margin:0;
}
button{font-family:inherit;cursor:pointer;}
a{color:inherit;text-decoration:none;}
::selection{background:var(--glow);}
.tabular{font-variant-numeric:tabular-nums;}