:root { --t1:#2264E8; --t2:#114BCC; --t3:#0D3796; --t4:#0D3796; --t5:#155DFC; --tint:color-mix(in srgb, var(--t1) 10%, white); --glow:color-mix(in srgb, var(--t1) 26%, transparent); }
body { margin:0; font-family:'Poppins','Roboto',system-ui,-apple-system,'Segoe UI',sans-serif; font-weight:500; background:#F5F6F8; color:#16181D; -webkit-font-smoothing:antialiased; font-size:15px; line-height:1.55; }
* { box-sizing:border-box; }
p { margin:0; padding:0; }
@font-face { font-family:'Poppins'; src:url('/promail_login/fonts/Poppins/Poppins-ExtraLight.ttf') format('truetype'); font-weight:200; font-style:normal; font-display:swap; }
@font-face { font-family:'Poppins'; src:url('/promail_login/fonts/Poppins/Poppins-Medium.ttf') format('truetype'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Poppins'; src:url('/promail_login/fonts/Poppins/Poppins-Bold.ttf') format('truetype'); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:'Poppins'; src:url('/promail_login/fonts/Poppins/Poppins-ExtraBold.ttf') format('truetype'); font-weight:800; font-style:normal; font-display:swap; }
@font-face { font-family:'Roboto'; src:url('/promail_login/fonts/Roboto/Roboto-Regular.woff2') format('woff2'),url('/promail_login/fonts/Roboto/Roboto-Regular.woff') format('woff'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Roboto'; src:url('/promail_login/fonts/Roboto/Roboto-Bold.woff2') format('woff2'),url('/promail_login/fonts/Roboto/Roboto-Bold.woff') format('woff'); font-weight:700; font-style:normal; font-display:swap; }
html { font-family:'Poppins','Roboto',system-ui,-apple-system,'Segoe UI',sans-serif; font-weight:500; font-size:15px; }
a { color:var(--t2); text-decoration:none; font-weight:500; }
a:hover { text-decoration:underline; }
input::placeholder { color:#B6BCC7; font-weight:200; }
input:focus { outline:none; border-color:var(--t1) !important; box-shadow:0 0 0 3px var(--glow); }
.tracking-pixel { display:none; }
.page-shell { min-height:100vh; display:flex; flex-direction:column; }
.rml-stage { flex:1; display:flex; align-items:center; justify-content:center; padding:44px 28px; }
.rml-shell { width:100%; max-width:1080px; background:#FFFFFF; border:1px solid #E4E7EC; border-radius:20px; box-shadow:0 1px 2px rgba(16,18,24,.04), 0 12px 32px rgba(16,18,24,.08); overflow:hidden; display:grid; grid-template-columns:1.05fr .95fr; animation:fadeIn .5s ease both; }
.rml-promo { position:relative; color:#fff; padding:38px 40px 40px; background:linear-gradient(155.86deg, #155dfc -5.1%, #114bcc 44.13%, #0d3796 99.3%); display:flex; flex-direction:column; overflow:hidden; }
.promo-pattern { position:absolute; inset:0; opacity:.14; pointer-events:none; background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.6) 0 1px,transparent 1px 9px); mask-image:radial-gradient(70% 60% at 80% 90%, #000 0%, transparent 75%); -webkit-mask-image:radial-gradient(70% 60% at 80% 90%, #000 0%, transparent 75%); }
.brand { position:relative; z-index:1; display:flex; flex-direction:column; align-items:flex-start; gap:3px; line-height:1; margin-bottom:26px; animation:fadeUp .5s ease .05s both; }
.brand-logo { height:36px; width:auto; display:block; image-rendering:-webkit-optimize-contrast; }
.promo-title { position:relative; z-index:1; font-weight:700; font-size:31px; line-height:1.18; letter-spacing:-.02em; margin:0 0 20px; animation:fadeUp .55s ease .12s both; }
.benefit-list { position:relative; z-index:1; list-style:none; margin:0 0 26px; padding:0; display:grid; gap:10px; animation:fadeUp .55s ease .24s both; }
.benefit-item { display:flex; align-items:flex-start; gap:11px; font-size:14.5px; color:rgba(255,255,255,.94); }
.benefit-check { flex:none; width:19px; height:19px; border-radius:50%; margin-top:2px; background:#fff; border:1px solid #fff; display:grid; place-items:center; }
.benefit-icon { width:10px; height:10px; stroke:#0D3796; stroke-width:4; fill:none; stroke-linecap:round; stroke-linejoin:round; }
.store-section { position:relative; z-index:1; margin-top:auto; padding-top:6px; animation:fadeUp .6s ease .34s both; }
.store-heading { font-weight:700; font-size:16px; letter-spacing:-.01em; margin:0 0 12px; color:#fff; }
.store-links { display:flex; flex-wrap:wrap; gap:10px; margin:0 0 20px; }
.store-link { display:block; transition:opacity .18s ease; }
.store-link:hover { opacity:.85; text-decoration:none; }
.app-store-badge { display:block; height:42px; width:auto; }
.play-store-badge { display:block; height:60px; width:auto; margin:-9px; }
.rml-auth { padding:40px 48px; display:flex; flex-direction:column; position:relative;}
.auth-header { margin-bottom:24px; animation:fadeUp .5s ease .15s both; }
.auth-title { font-weight:700; font-size:25px; letter-spacing:-.02em; margin:0 0 6px; }
.auth-description { margin:0; color:#626B7A; font-weight:500; font-size:14px; }
.login-form { display:flex; flex-direction:column; animation:fadeUp .55s ease .28s both; }
.form-group { margin-bottom:20px; }
.field-label { display:block; font-size:13px; font-weight:700; margin-bottom:7px; }
.text-input { width:100%; box-sizing:border-box; font-family:inherit; font-weight:500; font-size:15px; color:#16181D; padding:12px 14px; border:1px solid #E4E7EC; border-radius:8px; background:#FFFFFF; transition:border-color .16s ease,box-shadow .16s ease; }
.password-field { position:relative; display:flex; align-items:center; }
.password-input { padding-right:44px; }
.password-toggle { position:absolute; right:6px; border:0; background:transparent; cursor:pointer; font-family:inherit; font-size:12px; font-weight:700; color:#626B7A; padding:6px 8px; border-radius:6px; }
.password-toggle:hover { color:var(--t1) !important; background:var(--tint) !important; }
.field-help { font-size:11.5px; font-weight:500; color:#8A93A1; margin:7px 0 0; }
.forgot-row { display:flex; margin-top:8px; }
.forgot-link { font-size:12.5px; }
.remember-label { display:flex; align-items:center; gap:10px; margin:2px 0 24px; cursor:pointer; font-size:13.5px; font-weight:500; color:#626B7A; }
.remember-checkbox { width:18px; height:18px; accent-color:var(--t1); margin:0; }
.signin-button { width:100%; border:0; cursor:pointer; font-family:inherit; font-weight:700; font-size:15.5px; letter-spacing:.01em; color:#fff; padding:13px 18px; border-radius:8px; background:linear-gradient(155.86deg, #155dfc -5.1%, #114bcc 44.13%, #0d3796 99.3%); box-shadow:0 1px 2px var(--glow); transition:transform .12s ease,box-shadow .18s ease,filter .18s ease; }
.signin-button:hover { filter:brightness(1.08); box-shadow:0 6px 18px var(--glow) !important; }
.signin-button:active { transform:translateY(1px); }
.auth-footer { margin-top:auto; padding-top:32px; animation:fadeUp .6s ease .44s both; }
.signup-prompt { text-align:center; font-size:13.5px; color:#626B7A; margin:0 0 12px; }
.signup-link { font-weight:700; }
.legal-row { padding-top:14px; border-top:1px solid #E4E7EC; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:6px 14px; font-size:12.5px; font-weight:200; color:#8A93A1; }
.footer-link { color:#8A93A1; font-weight:200; }
.footer-link:hover { color:var(--t1) !important; }
.login-error { display:none; background:#FEFDBC; border-radius:8px; color:#E0001A; font-size:12px; font-weight:400; margin:0 0 18px; padding:9px 10px;position:absolute;top:0;width: 100%;  left: 0;  text-align: center; }
.login-error.is-visible { display:block; }
.metric-frame { display:none; }
.chat-panel { display:none; position:fixed; right:20px; bottom:80px; z-index:999; width:320px; overflow:hidden; border:2px solid #267CB5; border-radius:10px; background:#fff; box-shadow:0 12px 32px rgba(16,18,24,.18); }
.chat-panel.is-open { display:block; }
.chat-header { position:relative; margin:0; padding:10px 88px 10px 20px; background:#267CB5; color:#fff; font-family:'Poppins','Roboto',sans-serif; font-size:13px; font-weight:500; line-height:1.45; }
.chat-name { display:block; font-size:15px; font-weight:700; }
.chat-control { position:absolute; top:18px; width:20px; height:20px; padding:0; border:0; cursor:pointer; background-color:transparent; background-position:center; background-repeat:no-repeat; background-size:100% auto; }
.chat-reset { right:60px; background-image:url('https://businessemail.rediff.com/rediffmailpro/onlinebiz/images/sync.png'); }
.chat-close { right:20px; background-image:url('https://businessemail.rediff.com/rediffmailpro/onlinebiz/images/down_arr.png'); }
.chat-frame { display:block; width:100%; height:400px; border:0; border-radius:0; }
.chat-launcher { position:fixed; right:10px; bottom:8px; z-index:999; width:64px; height:64px; padding:0; border:0; cursor:pointer; background-color:transparent; background-image:url('https://businessemail.rediff.com/rediffmailpro/onlinebiz/images/icons/sprite.png'); background-position:0 0; background-repeat:no-repeat; animation:chatBounce 1s both; transform-origin:center bottom; }
@keyframes chatBounce {
  0%,20%,53%,80%,100% { animation-timing-function:cubic-bezier(.215,.61,.355,1); transform:translate3d(0,0,0); }
  40%,43% { animation-timing-function:cubic-bezier(.755,.05,.855,.06); transform:translate3d(0,-30px,0); }
  70% { animation-timing-function:cubic-bezier(.755,.05,.855,.06); transform:translate3d(0,-15px,0); }
  90% { transform:translate3d(0,-4px,0); }
}
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeUp { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:none; } }
@keyframes rise { from { opacity:0; transform:translateY(26px); } to { opacity:1; transform:none; } }
@keyframes slide { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
@media (max-width:980px) {
  .rml-shell { grid-template-columns:1fr !important; }
  .rml-auth { order:1; padding:34px 28px !important; }
  .rml-promo { order:2; padding:36px 28px 36px !important; }
  .rml-promo h1 { font-size:26px !important; }
}
@media (max-width:560px) {
  .rml-stage { padding:15px 14px !important; }
  .rml-auth { padding:28px 20px !important; }
  .rml-promo { padding:30px 20px 30px !important; }
  .chat-panel { right:10px; bottom:82px; width:calc(100% - 20px); }
  .login-error{padding: 5px 10px;border-radius: 0px;}
}
@media (prefers-reduced-motion:reduce) { * { animation:none !important; transition:none !important; } }