/* Arveta — estilos de autenticação (login / ativação) */
:root{
  --bg:#0e1420; --card:#151d2e; --card2:#1a2438; --line:#26314a;
  --text:#e8edf6; --mut:#8f9cb8; --brand:#5b8cff; --brand2:#7aa5ff;
  --err:#ff6b6b; --ok:#4ade80;
}
*{box-sizing:border-box}
body{
  margin:0; min-height:100vh; display:flex; align-items:center; justify-content:center;
  font-family:"Inter",-apple-system,"Segoe UI",Roboto,sans-serif;
  background:radial-gradient(1200px 800px at 20% -10%, #16223a 0%, var(--bg) 55%);
  color:var(--text);
}
.card{
  width:min(420px,92vw); background:var(--card); border:1px solid var(--line);
  border-radius:16px; padding:36px 32px 28px; box-shadow:0 20px 60px rgba(0,0,0,.45);
}
.brand{display:flex; align-items:center; gap:10px; margin-bottom:22px}
.brand img{width:34px; height:34px}
.brand span{font-size:19px; font-weight:700; letter-spacing:.3px}
h1{font-size:20px; margin:0 0 4px}
p.sub{color:var(--mut); font-size:13.5px; margin:0 0 22px; line-height:1.5}
label{display:block; font-size:12.5px; color:var(--mut); margin:0 0 6px; font-weight:600; letter-spacing:.2px}
input{
  width:100%; padding:11px 12px; border-radius:9px; border:1px solid var(--line);
  background:var(--card2); color:var(--text); font-size:14.5px; margin-bottom:16px;
  outline:none; transition:border .15s;
}
input:focus{border-color:var(--brand)}
button{
  width:100%; padding:12px; border:0; border-radius:9px; cursor:pointer;
  background:linear-gradient(135deg,var(--brand),var(--brand2)); color:#fff;
  font-size:14.5px; font-weight:600; transition:opacity .15s;
}
button:hover{opacity:.92}
button:disabled{opacity:.55; cursor:default}
.err{
  display:none; background:rgba(255,107,107,.1); border:1px solid rgba(255,107,107,.35);
  color:var(--err); border-radius:8px; padding:10px 12px; font-size:13px; margin:-6px 0 16px;
}
.err.show{display:block}
.ok-msg{
  display:none; background:rgba(74,222,128,.1); border:1px solid rgba(74,222,128,.35);
  color:var(--ok); border-radius:8px; padding:10px 12px; font-size:13px; margin:-6px 0 16px;
}
.ok-msg.show{display:block}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:13px; word-break:break-all;
  background:var(--card2); border:1px solid var(--line); border-radius:8px; padding:10px 12px; margin-bottom:16px}
label.opt{display:flex; gap:8px; align-items:flex-start; font-weight:400; color:var(--text); font-size:13px; margin:0 0 14px; cursor:pointer}
label.opt input{width:auto; margin:2px 0 0; accent-color:var(--brand)}
footer{margin-top:22px; text-align:center; color:var(--mut); font-size:11.5px}
a{color:var(--brand2)}