/* Login único CEPEA no SST (nr101, 24/10/2026). Usa SÓ os tokens do portal (portal-tokens.css).
   Movimento: o cartão chega (P1 do portal) e o botão eleva ao passar; tudo desliga com reduced-motion. */
body.lu{margin:0;font-family:var(--f-ui);background:var(--fundo);color:var(--tinta);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--e-5)}
.lu-card{background:var(--superficie);border:1px solid var(--linha);border-radius:var(--raio-g);box-shadow:var(--sombra);padding:var(--e-6) var(--e-6);width:100%;max-width:460px;box-sizing:border-box}
.lu-card h1{font-family:var(--f-titulo);font-size:var(--t-4);color:var(--tinta);margin:var(--e-2) 0 var(--e-3);font-weight:600}
.lu-card p{color:var(--tinta-2);line-height:1.55;font-size:var(--t-1)}
.lu-card .lu-kick{font-size:var(--t-miudo);letter-spacing:.08em;text-transform:uppercase;color:var(--tinta-3);margin:0}
.lu-link{color:var(--marca);font-weight:600;text-decoration:underline;text-underline-offset:3px;display:inline-flex;align-items:center;min-height:var(--alvo)}
.lu-card .lu-sub{color:var(--tinta-2);font-size:var(--t-1);margin:0 0 var(--e-5)}
.lu-cepea{display:flex;align-items:center;justify-content:center;gap:var(--e-2);width:100%;min-height:var(--alvo);box-sizing:border-box;padding:var(--e-3) var(--e-4);border-radius:var(--raio-m);background:var(--marca);color:var(--sobre-marca);font-weight:700;font-size:var(--t-base);text-decoration:none;border:0;box-shadow:var(--sombra)}
.lu-cepea:hover{background:var(--marca-forte)}
.lu-cepea:focus-visible,.lu-form input:focus-visible,.lu-form button:focus-visible,.lu-link:focus-visible{outline:3px solid var(--marca);outline-offset:2px}
.lu-cepea svg{width:20px;height:20px;flex:none}
.lu-card .lu-nota{font-size:var(--t-miudo);color:var(--tinta-3);margin:var(--e-2) 0 0;text-align:center}
.lu-ou{display:flex;align-items:center;gap:var(--e-3);color:var(--tinta-3);font-size:var(--t-miudo);margin:var(--e-5) 0 var(--e-2)}
.lu-ou::before,.lu-ou::after{content:"";flex:1;height:1px;background:var(--linha)}
.lu-form label{display:block;font-size:var(--t-miudo);font-weight:600;color:var(--tinta-2);margin:var(--e-4) 0 var(--e-1)}
.lu-form input::placeholder{color:var(--tinta-3);opacity:1}
.lu-form input{width:100%;box-sizing:border-box;min-height:var(--alvo);padding:var(--e-3) var(--e-4);border:1.5px solid var(--linha-forte);border-radius:var(--raio-p);font:inherit;background:var(--superficie);color:var(--tinta)}
.lu-form .btn2{font:inherit;width:100%;min-height:var(--alvo);margin-top:var(--e-5);border-radius:var(--raio-m);border:1.5px solid var(--marca);background:transparent;color:var(--marca);font-weight:700;font-size:var(--t-base);cursor:pointer}
.lu-form .btn2:hover{background:var(--marca-fundo)}
.pw-wrap{position:relative}.pw-wrap input{padding-right:calc(var(--alvo) + var(--e-1))}
.pw-eye{position:absolute;right:var(--e-1);top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:var(--tinta-3);width:var(--alvo);height:var(--alvo);display:flex;align-items:center;justify-content:center;border-radius:var(--raio-p)}
.pw-eye svg{width:20px;height:20px}
.row-extra{display:flex;justify-content:flex-end;margin-top:var(--e-2);font-size:var(--t-miudo)}
.lu-card .lu-rodape{text-align:center;margin-top:var(--e-4);font-size:var(--t-miudo);color:var(--tinta-2)}
.msg{padding:var(--e-3);border-radius:var(--raio-p);margin-top:var(--e-4);font-size:var(--t-miudo);display:none}
.msg.ok{background:var(--ok-fundo);color:var(--ok);display:block}
.msg.err{background:var(--realce-fundo);color:var(--realce);display:block}
@media (prefers-reduced-motion: no-preference){
  .lu-entra{animation:lu-chega var(--dur-3) var(--curva) both}
  @keyframes lu-chega{from{opacity:0;translate:0 12px}}
  .lu-cepea{transition:translate var(--dur-2) var(--curva),box-shadow var(--dur-2) var(--curva),background-color var(--dur-1) var(--curva)}
  .lu-cepea:hover{translate:0 -2px;box-shadow:var(--sombra-alta)}
  .lu-cepea:active{translate:0 0;scale:.98;transition-duration:var(--dur-1)}
}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@media (max-width:480px){.lu-card{padding:var(--e-5) var(--e-4)}body.lu{padding:var(--e-3)}}
