.auth-locked{background:
  radial-gradient(circle at top left, rgba(223,244,168,.62), transparent 35%),
  radial-gradient(circle at bottom right, rgba(91,145,219,.18), transparent 28%),
  linear-gradient(135deg, #eff5f1 0%, #f7faf8 40%, #edf2ef 100%);
}
.auth-locked .sidebar,
.auth-locked main{display:none}

.login-gate{min-height:100vh;display:grid;place-items:center;padding:28px}
.login-shell{
  width:min(1120px,100%);
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:24px;
  align-items:stretch;
}
.login-spotlight{
  position:relative;
  overflow:hidden;
  border-radius:30px;
  padding:36px;
  color:#eef7f1;
  background:
    linear-gradient(160deg, rgba(10,24,17,.94), rgba(16,38,28,.86)),
    linear-gradient(120deg, #113423 0%, #1a5e40 45%, #214f7a 100%);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 30px 90px rgba(10,24,17,.22);
}
.login-spotlight::after{
  content:"";
  position:absolute;
  inset:auto -12% -28% auto;
  width:320px;
  height:320px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(223,244,168,.26), transparent 70%);
  pointer-events:none;
}
.login-brand{display:flex;align-items:center;gap:10px;font:800 20px Manrope;margin-bottom:24px}
.login-eyebrow{
  display:inline-flex;
  align-items:center;
  width:max-content;
  margin-bottom:12px;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(223,244,168,.12);
  color:#dff4a8;
  font-size:12px;
  letter-spacing:.02em;
}
.login-spotlight h1{
  font:800 clamp(28px,4vw,48px) Manrope;
  line-height:1.05;
  margin:0 0 14px;
  max-width:12ch;
  color:#fff;
}
.login-spotlight p{
  max-width:54ch;
  color:rgba(233,242,236,.8);
  font-size:15px;
  line-height:1.7;
}
.login-metrics{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin:28px 0 22px;
}
.login-metrics div{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  padding:16px;
}
.login-metrics strong{
  display:block;
  font:800 28px Manrope;
  color:#fff;
}
.login-metrics small{color:rgba(233,242,236,.72)}
.login-benefits{
  display:grid;
  gap:12px;
  margin-top:18px;
}
.login-benefits div{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:14px 16px;
  border-radius:16px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
}
.login-benefits span{
  width:22px;
  height:22px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#dff4a8;
  color:#173222;
  flex:0 0 auto;
  font-weight:700;
}
.login-benefits p{margin:0;color:rgba(233,242,236,.85)}
.login-card{
  width:100%;
  background:rgba(255,255,255,.84);
  backdrop-filter:blur(22px);
  border:1px solid rgba(230,236,231,.85);
  border-radius:30px;
  padding:34px;
  box-shadow:0 30px 90px rgba(18,37,27,.14);
  align-self:center;
}
.login-card-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:18px;
}
.login-lock,.login-chip{
  display:inline-flex;
  align-items:center;
  padding:7px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
}
.login-lock{background:#edf8f1;color:#176a45}
.login-chip{background:#fff8e8;color:#8b6420}
.login-card h2{font:800 30px Manrope;margin:0 0 8px}
.login-card p{margin:0 0 22px}
.login-form .field{margin:14px 0}
.login-form .field input{
  background:linear-gradient(180deg,#fff,#fbfcfb);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.login-form .field input:focus{
  outline:2px solid rgba(30,166,106,.18);
  border-color:#8ed4b0;
}
.login-hint{display:block;margin-top:12px;color:var(--muted)}
.login-error{margin-top:14px;padding:12px 14px;border-radius:10px;background:#fff4f4;color:#b10020;border:1px solid #f1c6cf}
@media(max-width:900px){
  .login-shell{grid-template-columns:1fr}
  .login-spotlight{order:2}
  .login-card{order:1}
}