:root{color-scheme:light;--ink:#0f172a;--muted:#64748b;--line:#dfe7f1;--blue:#2563eb;--blue-dark:#1d4ed8;--green:#059669;--danger:#dc2626}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;color:var(--ink);font:15px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f8fafc}
.auth-page{min-height:100vh;display:grid;grid-template-columns:minmax(360px,.95fr) minmax(540px,1.05fr)}
.auth-aside{position:relative;overflow:hidden;padding:44px clamp(38px,6vw,88px);display:flex;flex-direction:column;justify-content:space-between;color:#fff;background:linear-gradient(145deg,#0f3fae,#2563eb 56%,#0891b2)}
.auth-aside:before,.auth-aside:after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.14)}
.auth-aside:before{width:520px;height:520px;right:-260px;top:-190px}
.auth-aside:after{width:370px;height:370px;left:-220px;bottom:-170px}
.brand{position:relative;z-index:1;display:block;width:205px;height:60px;overflow:hidden;border-radius:13px;background:#fff}
.brand img{position:absolute;width:230px;height:auto;left:-13px;top:-21px}
.aside-copy{position:relative;z-index:1;max-width:520px}
.aside-copy .tag{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(255,255,255,.1);font-size:.76rem;font-weight:700}
.aside-copy .tag:before{content:"";width:7px;height:7px;border-radius:50%;background:#6ee7b7}
.aside-copy h1{margin:22px 0 15px;font-size:clamp(2.45rem,4.8vw,4.5rem);line-height:1;letter-spacing:-.058em}
.aside-copy p{margin:0;max-width:470px;color:#dbeafe;font-size:1.03rem}
.benefits{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:10px 18px;color:#dbeafe;font-size:.8rem}
.benefits span{display:flex;align-items:center;gap:7px}
.benefits svg{width:17px}
.auth-main{padding:38px clamp(28px,6vw,90px);display:flex;flex-direction:column;background:#fff}
.top-link{align-self:flex-end;color:var(--muted);font-size:.88rem}
.top-link a{margin-left:5px;color:var(--blue);font-weight:750;text-decoration:none}
.form-wrap{width:min(100%,470px);margin:auto}
.form-wrap h2{margin:0 0 8px;font-size:clamp(1.9rem,3.5vw,2.6rem);letter-spacing:-.045em}
.subtitle{margin:0 0 30px;color:var(--muted)}
.field{margin-bottom:17px}
.field label{display:block;margin-bottom:7px;color:#334155;font-size:.82rem;font-weight:700}
.control{position:relative}
.control input{width:100%;height:50px;padding:0 14px;border:1px solid var(--line);border-radius:11px;outline:none;background:#fff;color:var(--ink);font:inherit;transition:.18s}
.control input::placeholder{color:#a3afc0}
.control input:focus{border-color:#60a5fa;box-shadow:0 0 0 3px #dbeafe}
.control input.invalid{border-color:#f87171;box-shadow:0 0 0 3px #fee2e2}
.password input{padding-right:48px}
.toggle-password{position:absolute;right:5px;top:5px;width:40px;height:40px;border:0;border-radius:8px;background:transparent;color:#64748b;cursor:pointer}
.toggle-password svg{width:19px}
.row{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:3px 0 22px}
.check{display:flex;align-items:center;gap:8px;color:#64748b;font-size:.82rem}
.check input{width:16px;height:16px;accent-color:var(--blue)}
.text-link{color:var(--blue);font-size:.82rem;font-weight:700;text-decoration:none}
.submit{width:100%;height:50px;border:0;border-radius:11px;color:#fff;background:var(--blue);font:750 .94rem inherit;cursor:pointer;box-shadow:0 12px 28px rgba(37,99,235,.19);transition:.18s}
.submit:hover{background:var(--blue-dark);transform:translateY(-1px)}
.submit:disabled{opacity:.65;cursor:not-allowed;transform:none}
.message{min-height:22px;margin-top:10px;font-size:.79rem}
.message.error{color:var(--danger)}
.message.success{color:var(--green)}
.legal{margin:24px 0 0;color:#94a3b8;font-size:.74rem;text-align:center}
.legal a{color:#64748b}
.name-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.password-hint{margin:7px 0 0;color:#94a3b8;font-size:.72rem}
@media(max-width:900px){.auth-page{grid-template-columns:1fr}
.auth-aside{min-height:280px;padding:28px 30px}
.aside-copy{margin:45px 0}
.aside-copy h1{font-size:2.7rem}
.benefits{display:none}
.auth-main{min-height:calc(100vh - 280px);padding:28px}
.top-link{margin-bottom:45px}
}
@media(max-width:520px){.auth-aside{min-height:225px;padding:20px}
.brand{width:166px;height:48px}
.brand img{width:187px;left:-11px;top:-17px}
.aside-copy{margin:27px 0 5px}
.aside-copy .tag{font-size:.66rem}
.aside-copy h1{margin:14px 0 9px;font-size:2.1rem}
.aside-copy p{font-size:.86rem}
.auth-main{min-height:calc(100vh - 225px);padding:22px 20px 30px}
.top-link{margin-bottom:34px}
.form-wrap h2{font-size:1.8rem}
.subtitle{margin-bottom:24px}
.name-row{grid-template-columns:1fr}
.control input,.submit{height:48px}
}

/* Compact, stronger authentication typography. */
body{font-size:14px}
.form-wrap{width:min(100%,440px)}
.form-wrap h2{font-size:clamp(1.7rem,2.6vw,2.2rem);font-weight:800}
.subtitle{margin-bottom:25px;font-size:.92rem;font-weight:600}
.field{margin-bottom:14px}
.field label{margin-bottom:6px;font-size:.77rem;font-weight:800}
.control input{height:46px;font-size:.86rem;font-weight:650}
.control input::placeholder{font-weight:550}
.toggle-password{top:3px;height:40px;font-size:.78rem;font-weight:750}
.row{margin:2px 0 18px}
.check,.text-link{font-size:.77rem;font-weight:700}
.submit{height:46px;font-size:.87rem;font-weight:800}
.top-link{font-size:.82rem;font-weight:600}
.top-link a{font-weight:800}
.aside-copy h1{font-size:clamp(2.2rem,4vw,3.8rem);font-weight:800}
.aside-copy p{font-size:.94rem;font-weight:550}
.benefits{font-size:.75rem;font-weight:700}
.password-hint,.legal{font-size:.7rem;font-weight:550}
@media(max-width:520px){.form-wrap h2{font-size:1.7rem}.subtitle{font-size:.87rem}.control input,.submit{height:46px}.top-link{font-size:.78rem}}
@media(max-width:700px){.auth-aside{display:none}.auth-page{display:block;min-height:100dvh}.auth-main{min-height:100dvh;padding:24px 20px 30px}.top-link{margin-bottom:32px}}
@media(max-width:700px){
  body{background:#f4f7fb}
  .auth-main{display:block;padding:22px 16px 28px;background:linear-gradient(180deg,#f8fbff,#f4f7fb)}
  .top-link{width:100%;margin:0 auto 18px;text-align:center;font-size:.74rem}
  .form-wrap{width:min(100%,430px);margin:0 auto;padding:24px 20px 22px;border:1px solid #e1e8f2;border-radius:18px;background:#fff;box-shadow:0 16px 42px rgba(15,23,42,.08)}
  .form-wrap:before{display:block;width:190px;height:58px;margin:0 auto 20px;background:url('../pay-rupee-logo.png') center/contain no-repeat;content:""}
  .form-wrap h2{font-size:1.55rem;text-align:center;letter-spacing:-.035em}
  .subtitle{margin-bottom:21px;font-size:.8rem;text-align:center}
  .field{margin-bottom:13px}.field label{font-size:.73rem}.control input{height:46px;border-radius:10px;font-size:.82rem}
  .row{gap:10px;margin:3px 0 18px}.check,.text-link{font-size:.7rem}.check{white-space:nowrap}.check input{width:17px;height:17px;flex:0 0 17px}
  .submit{height:46px;border-radius:10px;font-size:.82rem}
  .server-alert{margin-bottom:15px;padding:10px 12px;border:1px solid #fecaca;border-radius:9px;color:#b91c1c;background:#fff7f7;font-size:.7rem;font-weight:700}
}
@media(max-width:380px){.auth-main{padding:15px 10px 22px}.form-wrap{padding:20px 15px}.top-link{margin-bottom:12px}.check,.text-link{font-size:.65rem}}
@media(max-width:700px){.auth-main{position:relative;display:flex;align-items:center;justify-content:center;padding-top:70px}.auth-main .top-link{position:absolute;top:22px;right:16px;left:16px;margin:0}.auth-main .form-wrap{margin:auto}}
@media(max-width:700px){.auth-main{padding-top:28px}.auth-main .form-wrap{order:1;margin:0 auto}.auth-main .top-link{position:static;order:2;margin:16px 0 0;text-align:center}}