*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;min-height:100vh}

.login-bg{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#EBF0F7 0%,#D6E0EE 50%,#C8D5E8 100%);
  padding:20px;
}

.login-card{
  width:100%;max-width:400px;
  background:#FFFFFF;
  border-radius:12px;
  box-shadow:0 8px 32px rgba(13,39,79,.12),0 2px 8px rgba(13,39,79,.06);
  padding:40px 36px 28px;
  position:relative;overflow:hidden;
}

.login-brand{text-align:center;margin-bottom:32px;}
.login-logo{
  width:56px;height:56px;margin:0 auto 14px;
  background:linear-gradient(135deg,#0D274F,#0072E4);
  border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:24px;font-weight:800;letter-spacing:1px;
}
.login-title{font-size:20px;font-weight:700;color:#0D274F;margin-bottom:4px;}
.login-subtitle{font-size:13px;color:#607793;font-weight:400;}

.field{margin-bottom:18px;}
.field label{display:block;font-size:12px;font-weight:600;color:#3A5068;margin-bottom:6px;}
.field input{
  width:100%;padding:11px 14px;
  border:1px solid #D1DAE6;border-radius:8px;
  font-size:14px;font-family:inherit;color:#1E293B;
  background:#F8FAFC;
  transition:border-color .2s,box-shadow .2s;
  outline:none;
}
.field input::placeholder{color:#94A3B8;}
.field input:focus{border-color:#0072E4;box-shadow:0 0 0 3px rgba(0,114,228,.12);background:#fff;}

.login-error{
  font-size:13px;color:#C42B1C;min-height:20px;
  margin-bottom:8px;opacity:0;transition:opacity .2s;
}
.login-error.visible{opacity:1;}

.login-btn{
  width:100%;padding:12px;
  background:linear-gradient(135deg,#0072E4,#005BBB);
  color:#fff;border:none;border-radius:8px;
  font-size:15px;font-weight:600;font-family:inherit;
  cursor:pointer;transition:opacity .2s,transform .1s;
}
.login-btn:hover:not(:disabled){opacity:.92;transform:translateY(-1px);}
.login-btn:active:not(:disabled){transform:translateY(0);}
.login-btn:disabled{opacity:.65;cursor:not-allowed;}

.marquee-wrap{
  height:0;overflow:hidden;opacity:0;
  transition:height .3s,opacity .3s;
  margin-top:0;
}
.marquee-wrap.active{height:28px;opacity:1;margin-top:16px;}

.marquee-track{
  display:flex;width:max-content;
  animation:marqueeScroll 8s linear infinite;
}
.marquee-text{
  font-size:12px;font-weight:700;letter-spacing:6px;
  color:#0072E4;opacity:.35;white-space:nowrap;
  text-transform:uppercase;
}
@keyframes marqueeScroll{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}

.login-footer{
  text-align:center;font-size:11px;color:#94A3B8;
  margin-top:28px;padding-top:16px;border-top:1px solid #F1F5F9;
}