.login-body {
  display: grid;
  place-items: center;
  padding: 28px;
  background:
    radial-gradient(circle at 15% 12%, rgba(31,94,255,.15), transparent 30%),
    radial-gradient(circle at 88% 85%, rgba(74,193,155,.12), transparent 26%),
    #f3f8f7;
}
.login-shell {
  width: min(1080px, 100%);
  min-height: 620px;
  display: grid;
  grid-template-columns: minmax(430px, .9fr) minmax(420px, 1.1fr);
  overflow: hidden;
  border-radius: 30px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 32px 90px rgba(15,23,42,.18);
  border: 1px solid rgba(255,255,255,.9);
}
.login-card { padding: 48px; display: flex; flex-direction: column; }
.login-brand { display:flex; align-items:center; gap:14px; }
.login-copy { margin-top: 72px; }
.login-copy h2 { font-size: 38px; margin: 6px 0 8px; }
.login-copy p { color: var(--muted); margin:0; max-width: 390px; line-height:1.55; }
.login-form { margin-top: 30px; display:grid; gap:16px; }
.login-field span { display:block; font-size:12px; font-weight:800; margin-bottom:7px; }
.login-field input {
  width:100%; border:1px solid var(--line); background:#f8fbfa; border-radius:14px;
  padding:14px 15px; outline:none; transition:.18s ease;
}
.login-field input:focus { border-color:var(--primary); box-shadow:0 0 0 4px rgba(31,94,255,.10); background:#fff; }
.login-button {
  border:0; cursor:pointer; border-radius:14px; padding:14px 18px; color:#fff; font-weight:800;
  background: linear-gradient(135deg, #054547, #0AD88D); box-shadow:0 10px 24px rgba(10,216,141,.20);
}
.login-button:disabled { opacity:.7; cursor:wait; }
.login-error { color:var(--danger); background:rgba(189,49,69,.08); border:1px solid rgba(189,49,69,.16); padding:11px 12px; border-radius:12px; font-size:12px; }
.login-footer { margin-top:auto; padding-top:28px; color:var(--muted); font-size:11px; }
.login-visual { position:relative; padding:54px; overflow:hidden; color:#fff; background:linear-gradient(150deg,#054547,#07595a 58%,#0AD88D); display:flex; align-items:flex-end; }
.visual-orb { position:absolute; width:430px; height:430px; border-radius:50%; right:-110px; top:-115px; border:1px solid rgba(255,255,255,.18); box-shadow:inset 0 0 80px rgba(255,255,255,.08); }
.visual-orb:after { content:""; position:absolute; width:240px; height:240px; border-radius:50%; left:55px; bottom:-70px; background:rgba(63,203,157,.22); filter:blur(2px); }
.visual-content { position:relative; z-index:1; max-width:430px; }
.visual-content span { font-size:11px; font-weight:900; letter-spacing:.18em; color:#69f0bd; }
.visual-content strong { display:block; font-size:34px; line-height:1.08; letter-spacing:-.04em; margin:13px 0; }
.visual-content p { color:rgba(255,255,255,.68); line-height:1.6; }
@media (max-width: 880px) {
  .login-shell { grid-template-columns:1fr; min-height:unset; }
  .login-visual { display:none; }
  .login-card { min-height:620px; padding:34px; }
}
@media (max-width: 520px) {
  .login-body { padding:0; place-items:stretch; }
  .login-shell { min-height:100vh; border-radius:0; }
  .login-card { min-height:100vh; padding:28px 22px; }
  .login-copy { margin-top:54px; }
  .login-copy h2 { font-size:32px; }
}
.setup-copy { margin-top: 48px; }
.password-note { color: var(--muted); font-size: 11px; line-height: 1.45; margin-top: -4px; }

.login-brand .brand-logo { width: 220px; max-height: 82px; object-fit: contain; object-position: left center; }
.login-brand > div:last-child { display:none; }
.login-button { color:#054547; background:#0AD88D; box-shadow:0 10px 24px rgba(10,216,141,.22); }
.login-visual { background:linear-gradient(150deg,#054547,#07595a 70%,#087069); }
.visual-content span { color:#68f0bd; }