:root{
    --cor-primaria:   <?= $corOf('cor_primaria',   '#0b1f3a') ?>;
    --cor-secundaria: <?= $corOf('cor_secundaria', '#0ea5e9') ?>;
    --cor-destaque:   <?= $corOf('cor_destaque',   '#38bdf8') ?>;
    --cor-fundo:      <?= $corOf('cor_fundo',      '#f0f9ff') ?>;
    --cor-texto:      <?= $corOf('cor_texto',      '#1e293b') ?>;
    --cor-btn-texto:  <?= $corOf('cor_btn_texto',  '#ffffff') ?>;
}
body.auth{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:1.5rem;
    background:
    radial-gradient(1200px 600px at 50% -10%, color-mix(in srgb, var(--cor-secundaria) 18%, transparent), transparent),
    var(--cor-fundo);}
.auth-card{
    width:100%;
    max-width:400px;
    background:#fff;
    border-radius:16px;
    box-shadow:var(--shadow-lg);padding:2.5rem 2rem 2rem;
}
.auth-brand{
    text-align:center;
    margin-bottom:1.75rem;
}
.auth-brand img{
    height:54px;
    width:auto;
    margin:0 auto .25rem;
}
.auth-brand h1{
    font-size:1.5rem;
    color:var(--cor-primaria);
}
.auth-brand .sub{color:#64748b;font-size:.88rem;margin-top:.3rem;}
.field{margin-bottom:1.1rem;}
.field label{display:block;font-size:.8rem;font-weight:600;color:var(--cor-primaria);margin-bottom:.4rem;}
.field input{width:100%;padding:.72rem .9rem;border:1.5px solid #e2e8f0;border-radius:var(--radius);
    font-size:.95rem;background:#f8fafc;color:var(--cor-texto);font-family:inherit;
    transition:border-color var(--trans),box-shadow var(--trans),background var(--trans);}
.field input:focus{outline:none;border-color:var(--cor-secundaria);background:#fff;
    box-shadow:0 0 0 3px color-mix(in srgb, var(--cor-secundaria) 22%, transparent);}
.btn-full{width:100%;justify-content:center;margin-top:.4rem;}
.erro{background:#fef2f2;border:1px solid #fecaca;color:#b91c1c;padding:.7rem .9rem;
    border-radius:var(--radius);font-size:.85rem;margin-bottom:1.25rem;text-align:center;}
.senha-wrap{position:relative;}
.senha-wrap input{padding-right:42px;}
.olho{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:0;
    padding:4px;cursor:pointer;font-size:1.1rem;line-height:1;color:#94a3b8;}
.voltar{display:block;text-align:center;margin-top:1.5rem;font-size:.82rem;color:#64748b;}
.voltar:hover{color:var(--cor-secundaria);}