/* Logo imóvel como uma placa; somente a luz e os raios se movimentam. */
.electric-logo{position:relative;isolation:isolate;overflow:visible}
.electric-logo img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;display:block;transform:none!important}
.login-logo{width:min(430px,65vh);aspect-ratio:1;margin:auto;border:1px solid rgba(104,190,255,.38);background:#07101e;box-shadow:0 0 22px rgba(38,139,255,.38),0 0 54px rgba(22,104,215,.2)}
.small-logo{width:78px;aspect-ratio:1;padding:4px;border-radius:10px;background:linear-gradient(145deg,#13243b,#07101e);border:1px solid #31577d;box-shadow:0 0 13px rgba(34,139,255,.42),0 5px 14px rgba(0,0,0,.3)}
html[data-theme=light] .small-logo{background:linear-gradient(145deg,#fff,#dcecff);border-color:#8db8e2;box-shadow:0 0 12px rgba(25,112,205,.34),0 5px 14px rgba(31,59,91,.2)}
html[data-theme=light] .small-logo img{border-radius:6px}
.lightning-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3;overflow:visible}
.bolt{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.bolt-blue{stroke:#62c8ff;stroke-width:2.1;filter:drop-shadow(0 0 2px #d9f5ff) drop-shadow(0 0 5px #42a9ff) drop-shadow(0 0 11px #156cff)}
.bolt-red{stroke:#ff6b93;stroke-width:1.55;filter:drop-shadow(0 0 2px #ffe0e8) drop-shadow(0 0 5px #ff426f) drop-shadow(0 0 10px #d41445)}
.runner-a{stroke-dasharray:88 912;animation:lightning-run 4.1s linear infinite}
.runner-b{stroke-dasharray:52 948;animation:lightning-run 3.2s linear infinite reverse;animation-delay:-1.1s}
.runner-c{stroke-dasharray:36 964;animation:lightning-run 2.35s linear infinite;animation-delay:-.7s}
.runner-d{stroke-dasharray:22 978;animation:lightning-run 1.75s linear infinite reverse;animation-delay:-1.35s}
@keyframes lightning-run{from{stroke-dashoffset:1000;opacity:.25}8%{opacity:1}78%{opacity:.9}to{stroke-dashoffset:0;opacity:.25}}
.electric-logo:after{content:"";position:absolute;inset:6%;z-index:0;pointer-events:none;border-radius:18%;opacity:.28;box-shadow:0 0 24px rgba(75,175,255,.72),0 0 52px rgba(255,50,105,.28);animation:electric-flash 5.8s steps(1,end) infinite}
@keyframes electric-flash{0%,7%,11%,48%,52%,83%,100%{opacity:.18}8%{opacity:.72}9%{opacity:.24}10%{opacity:.92}49%{opacity:.42}50%{opacity:.86}84%{opacity:.55}}
@media(max-width:800px){.login-logo{width:220px}.small-logo{width:56px}}
@media(prefers-reduced-motion:reduce){.bolt,.electric-logo:after{animation:none!important}}

/* Login: o cartão acompanha o centro visual da placa, não o conjunto placa+título. */
@media(min-width:801px){
  .login-shell>.card{justify-self:center;transform:translateY(-34px)}
}

/* Estado do autenticador: mensagem centralizada e cor inequívoca. */
.login-shell .auth-state{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:10px 14px;
  text-align:center;
  font-weight:700;
  line-height:1.25;
}
.login-shell .auth-state.ok{background:#176b4d;color:#fff}
.login-shell .auth-state.bad{background:#991f2b;color:#fff}

@media(max-width:800px){
  .login-shell>.card{justify-self:stretch;transform:none;margin:0 auto;width:min(430px,100%)}
}