/* OZORA — estilo do login, da administração e dos avisos de sessão/manutenção (mesmas cores do painel) */
:root{
  --bg:#06122a; --surface:#0b1c3b; --surface-2:#10264d; --line:#1c3766;
  --fg:#e9eff9; --muted:#97a8c6; --accent:#5a8dff; --accent-ink:#04112b;
  --oz-navy:#05214f; --oz-blue:#1438c8; --oz-green:#2e9d3a;
  --ok:#3ddc84; --warn:#f5b83d; --down:#ff5c61; --maint:#7d8c96;
  --f-display:"Saira",ui-sans-serif,system-ui,sans-serif;
  --f-body:"Open Sans",ui-sans-serif,system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  color-scheme:dark;
}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]){
  --bg:#eef2f9; --surface:#ffffff; --surface-2:#f3f6fc; --line:#d3dcec;
  --fg:#0a1a38; --muted:#52627e; --accent:#1438c8; --accent-ink:#ffffff;
  --ok:#17a35a; --warn:#c98600; --down:#d93a3f; --maint:#6b7b85; color-scheme:light;}}
:root[data-theme="light"]{
  --bg:#eef2f9; --surface:#ffffff; --surface-2:#f3f6fc; --line:#d3dcec;
  --fg:#0a1a38; --muted:#52627e; --accent:#1438c8; --accent-ink:#ffffff;
  --ok:#17a35a; --warn:#c98600; --down:#d93a3f; --maint:#6b7b85; color-scheme:light;}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--f-body);font-size:14px;line-height:1.5}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
a{color:var(--accent)}
h1,h2,h3{font-family:var(--f-display);font-weight:600;line-height:1.15}

/* Botões e campos */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--line);background:var(--surface-2);color:var(--fg);font:inherit;font-weight:500;padding:8px 14px;border-radius:8px;cursor:pointer;white-space:nowrap;text-decoration:none}
.btn:hover{border-color:var(--accent)}
.btn:focus-visible,.inp:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.btn.pri{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}
.btn.pri:hover{filter:brightness(1.08)}
.btn.dan{color:var(--down)}
.btn.sm{padding:4px 10px;font-size:12.5px}
.btn:disabled{opacity:.55;cursor:default}
.lnk{background:none;border:0;padding:0;color:var(--accent);font:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
label.f{display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--muted);font-weight:500}
.inp,select.inp,textarea.inp{width:100%;background:var(--bg);border:1px solid var(--line);color:var(--fg);font:inherit;font-size:14px;padding:9px 11px;border-radius:8px}
textarea.inp{min-height:84px;resize:vertical}
.pw{position:relative;display:block}
.pw .inp{padding-right:78px}
.pw button{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:none;border:0;color:var(--accent);font:inherit;font-size:12.5px;cursor:pointer;padding:4px 6px}
.err{border:1px solid color-mix(in srgb,var(--down) 50%,transparent);background:color-mix(in srgb,var(--down) 10%,transparent);border-radius:8px;padding:9px 12px;font-size:13px}
.note{border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);background:color-mix(in srgb,var(--accent) 9%,transparent);border-radius:8px;padding:9px 12px;font-size:13px}
.warnbox{border:1px solid color-mix(in srgb,var(--warn) 55%,transparent);background:color-mix(in srgb,var(--warn) 10%,transparent);border-radius:8px;padding:9px 12px;font-size:13px}
.rules{list-style:none;margin:2px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--muted)}
.rules li::before{content:"○ ";color:var(--muted)}
.rules li.ok{color:var(--ok)}
.rules li.ok::before{content:"✓ "}
.chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;padding:1px 8px;border-radius:99px;border:1px solid var(--line);color:var(--muted);white-space:nowrap}
.chip.ok{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 45%,transparent)}
.chip.warn{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 45%,transparent)}
.chip.down{color:var(--down);border-color:color-mix(in srgb,var(--down) 45%,transparent)}
.chip.acc{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 45%,transparent)}

/* Login: foto da Ozônio na Amazônia à esquerda, formulário à direita */
.oz-band{height:4px;background:linear-gradient(90deg,var(--oz-navy) 0%,var(--oz-blue) 45%,var(--oz-green) 100%)}
.login{min-height:100vh;display:grid;grid-template-columns:1.15fr 1fr}
.login-art{position:relative;isolation:isolate;overflow:hidden;padding:44px clamp(24px,5vw,72px);display:flex;flex-direction:column;justify-content:space-between;gap:32px;color:#fff;background:#05214f;
  --sombra:0 1px 2px rgba(0,0,0,.9),0 2px 6px rgba(0,0,0,.75),0 0 24px rgba(0,0,0,.55)}
/* Foto levemente desfocada (só a foto; o texto fica nítido) e escurecida em cima e embaixo */
/* Infovias da Amazônia: foto um pouco opaca (sobre o azul da Ozônio) para as palavras se destacarem */
.login-art::before{content:"";position:absolute;inset:-24px;z-index:-2;background:url(login-infovias.webp) 50% center/cover no-repeat;filter:blur(1.5px) saturate(.95);opacity:.62}
.login-art::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(5,33,79,.72) 0%,rgba(5,33,79,.3) 34%,rgba(4,17,43,.55) 60%,rgba(3,12,32,.94) 100%)}
.login-art .brand{display:flex;align-items:center;gap:14px}
.login-art .brand img{width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 2px 8px rgba(0,0,0,.6))}
.login-art .brand b.ozora{display:block;font:700 34px/1 var(--f-display);letter-spacing:.2em;background:linear-gradient(95deg,#9cc4ff 0%,#7fd6f0 50%,#8af0a2 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 6px rgba(0,0,0,.7))}
.login-art .brand em.by{display:block;font:500 11px/1 var(--f-display);font-style:normal;letter-spacing:.16em;color:rgba(255,255,255,.85);margin-top:7px;text-shadow:var(--sombra)}
.login-art .brand em.by b{font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#fff}
.login-art .foot b{color:#fff}
.login-art .brand small{display:block;color:rgba(255,255,255,.92);font-size:13.5px;margin-top:4px;text-shadow:var(--sombra)}
.login-art h1{font-size:clamp(32px,3.8vw,52px);margin:0 0 10px;font-weight:700;max-width:14ch;text-shadow:0 2px 3px rgba(0,0,0,.9),0 4px 14px rgba(0,0,0,.7),0 0 40px rgba(0,0,0,.5)}
.login-art .lead{margin:0 0 26px;max-width:46ch;color:#fff;font-size:15.5px;line-height:1.55;text-shadow:var(--sombra)}
.login-art ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;max-width:48ch}
.login-art li{display:grid;grid-template-columns:34px 1fr;gap:10px;color:rgba(255,255,255,.94);text-shadow:var(--sombra)}
.login-art li span{font-family:var(--f-mono);color:#9af0a6;font-size:12.5px;padding-top:2px}
.login-art li b{color:#fff;font-weight:700;display:block}
.login-art .foot{color:rgba(255,255,255,.88);font-size:12.5px;display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;text-shadow:var(--sombra)}
.login-art .vbad{color:#fff!important;border-color:rgba(255,255,255,.5)!important;background:rgba(255,255,255,.14)!important}
.login-form .lf-tema{position:absolute;top:16px;right:16px}
.login-form{position:relative;display:flex;align-items:center;justify-content:center;padding:40px 16px;background:radial-gradient(900px 500px at 100% 0%,color-mix(in srgb,var(--oz-blue) 12%,transparent),transparent 70%),var(--bg)}
.login-form form{width:100%;max-width:380px;display:flex;flex-direction:column;gap:14px}
.login-form .lf-logo{width:52px;height:52px;object-fit:contain;margin-bottom:-2px}
.login-form h2{margin:0;font-size:26px}
.login-form .sub{margin:-8px 0 4px;color:var(--muted)}
.login-form .btn.pri{padding:11px;font-size:15px}
.login-form .esq{align-self:center;font-size:13.5px}
.login-form .help{color:var(--muted);font-size:12.5px;border-top:1px solid var(--line);padding-top:14px;margin-top:4px}
.login-form .help.ped{display:flex;align-items:center;justify-content:space-between;gap:14px}
.login-form .help.ped .iconbtn{width:38px;height:38px;border-radius:10px;color:var(--accent);transition:color .2s,border-color .2s,background .2s,transform .2s}
.login-form .help.ped .iconbtn:hover{background:color-mix(in srgb,var(--accent) 10%,var(--surface));transform:translateY(-1px)}
.login-form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.login-art .foot .dev{flex-basis:100%}
@media (max-width:860px){.login{grid-template-columns:1fr}.login-art{padding:24px 16px 28px;min-height:300px;gap:18px}.login-art h1{font-size:30px}.login-art .lead{margin-bottom:0}.login-art ol{display:none}}

@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}
