:root{--benjie-blue:#012185;--action-blue:#135ef2;--benjie-orange:#f46e06;--success-green:#0aa54b;--deep-navy:#061a62;--secondary:#566596;--border:#e2e6f0;--background:#fbfbfc;--white:#fff}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{color:var(--deep-navy);background:#eef1f7;font-family:Instrument Sans,Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:16px}a{color:inherit;text-decoration:none}button,input{font:inherit}.auth-screen{background:var(--background);width:100%;max-width:430px;min-height:100dvh;margin:auto;position:relative;overflow:hidden;box-shadow:0 20px 60px #071f5c26}.auth-blue-zone{min-height:72dvh;padding:max(14px, env(safe-area-inset-top)) 24px 130px;color:#fff;background:radial-gradient(circle at -15% 31%,#063ab3 0 23%,#0000 23.5%),radial-gradient(circle at 104% 37%,#0739af 0 25%,#0000 25.5%),linear-gradient(160deg,#012185,#002381 58%,#06329e);position:relative;overflow:hidden}.auth-statusbar{justify-content:space-between;align-items:center;height:27px;font-size:14px;font-weight:700;display:flex}.auth-brand-area{text-align:center;justify-items:center;margin-top:63px;display:grid}.auth-logo{object-fit:contain;width:176px;max-width:70vw;height:auto;display:block}.auth-tagline{color:#fff;margin:16px 0 0;font-size:18px;font-weight:500;line-height:1.4}.auth-tagline strong{color:#ffab17;font-weight:650}.welcome-visual{height:330px;margin-top:42px;position:relative}.visual-wallet{width:230px;height:270px;position:absolute;bottom:5px;left:50%;transform:translate(-50%)}.visual-card{width:172px;height:145px;color:var(--deep-navy);background:linear-gradient(160deg,#fff,#e8eefb);border-radius:15px;padding:16px;position:absolute;top:0;left:34px;transform:rotate(5deg);box-shadow:0 15px 35px #00000038}.visual-card span{font-size:12px;display:block}.visual-card strong{margin-top:3px;font-size:15px;display:block}.visual-card small{color:var(--success-green);font-size:12px;position:absolute;top:48px;right:13px}.visual-card svg{width:100%;height:58px;margin-top:14px}.wallet-shape{background:linear-gradient(145deg,#135ef2,#02348f);border:1px solid #ffffff4d;border-radius:22px 22px 35px 35px;height:132px;position:absolute;bottom:22px;left:25px;right:20px;box-shadow:0 20px 35px #00000047}.wallet-shape:after{content:"";background:linear-gradient(145deg,#1969ef,#093b9c);border-radius:13px;width:69px;height:49px;position:absolute;top:33px;right:-4px}.coin{color:#a75a00;background:linear-gradient(145deg,#ffe27a,#ffad17);border-radius:50%;place-items:center;font-size:17px;font-weight:900;display:grid;position:absolute;box-shadow:0 5px 14px #00000040}.coin--one{width:48px;height:48px;bottom:4px;left:25px}.coin--two{width:42px;height:42px;bottom:0;right:13px}.visual-stat{z-index:5;color:#fff;background:linear-gradient(155deg,#0f54ccbf,#052b85a6);border:1px solid #ffffff29;border-radius:14px;width:105px;min-height:103px;padding:12px;position:absolute;box-shadow:0 13px 35px #0000002b}.visual-stat span,.visual-stat b{display:block}.visual-stat span{font-size:12px}.visual-stat strong{margin:6px 0;font-size:27px;display:block}.visual-stat b{font-size:12px}.visual-stat--left{top:100px;left:14px;transform:rotate(-6deg)}.visual-stat--right{top:102px;right:8px;transform:rotate(7deg)}.visual-stat--top{place-items:center;width:61px;min-height:61px;padding:0;display:grid;top:9px;right:46px}.visual-stat--top strong{margin:0}.welcome-card{z-index:10;width:calc(100% - 46px);padding:27px 25px calc(30px + env(safe-area-inset-bottom));text-align:center;background:#fff;border-radius:26px 26px 0 0;margin:-103px auto 0;position:relative;box-shadow:0 -5px 25px #061a6214}.welcome-card h1,.login-heading h1{color:var(--deep-navy);margin:0;font-size:27px;font-weight:750;line-height:1.25}.welcome-card p,.login-heading p{color:var(--secondary);font-size:16px;line-height:1.5}.welcome-card p{margin:12px 0 24px}.auth-primary-button,.auth-secondary-button,.biometric-button{border-radius:16px;justify-content:center;align-items:center;width:100%;min-height:56px;font-size:16px;font-weight:650;display:flex}.auth-primary-button{color:#fff;cursor:pointer;background:linear-gradient(100deg,#f56d05,#ff4b08);border:0;box-shadow:0 8px 17px #f46e062e}.auth-secondary-button{border:1.5px solid var(--action-blue);color:var(--action-blue);background:#fff;margin-top:14px}.login-blue-zone{min-height:47dvh;padding-bottom:130px}.auth-brand-area--login{margin-top:62px}.login-card{z-index:10;background:#fff;border-radius:25px;width:calc(100% - 46px);margin:-115px auto 0;padding:31px 25px 26px;position:relative;box-shadow:0 8px 28px #061a621a}.login-heading{text-align:center;margin-bottom:24px}.login-heading p{margin:8px 0 0;font-size:15px}.login-form{gap:18px;display:grid}.auth-field{gap:8px;display:grid}.auth-field>span{color:var(--deep-navy);font-size:15px;font-weight:650}.auth-input-shell{border:1px solid var(--border);background:#fff;border-radius:15px;grid-template-columns:37px minmax(0,1fr) auto;align-items:center;min-height:56px;display:grid}.auth-input-icon{color:#62729c;place-items:center;font-size:21px;display:grid}.auth-input-shell input{width:100%;min-width:0;color:var(--deep-navy);background:0 0;border:0;outline:0;font-size:15px}.auth-input-shell input::placeholder{color:#808aa3}.password-eye{color:#6373a1;cursor:pointer;background:0 0;border:0;width:45px;height:50px}.forgot-row{text-align:right;margin-top:-4px}.forgot-row a{color:var(--action-blue);font-size:14px;font-weight:550}.auth-divider{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:15px;margin:19px 0;display:grid}.auth-divider span{background:var(--border);height:1px}.auth-divider strong{color:var(--secondary);font-size:13px;font-weight:500}.biometric-button{border:1px solid var(--border);color:var(--deep-navy);background:#fff;gap:11px;font-size:14px}.biometric-icon{color:var(--action-blue);font-size:25px}.activation-block{text-align:center;gap:3px;margin-top:22px;display:grid}.activation-block strong{color:var(--deep-navy);font-size:13px}.activation-block a{color:var(--action-blue);font-size:13px}.login-security{min-height:64px;color:var(--secondary);justify-content:center;align-items:center;gap:8px;font-size:13px;display:flex}@media (width>=700px){body{padding:28px 0}.auth-screen{border-radius:28px;min-height:calc(100vh - 56px)}}@media (width<=370px){.auth-blue-zone{padding-left:19px;padding-right:19px}.auth-logo{width:158px}.auth-tagline{font-size:16px}.welcome-card,.login-card{width:calc(100% - 28px)}.welcome-card h1,.login-heading h1{font-size:25px}}@media (width>=700px){body{padding:28px 24px}.auth-screen{border-radius:30px;max-width:760px;min-height:calc(100vh - 56px)}.auth-blue-zone{min-height:660px;padding-left:42px;padding-right:42px}.auth-brand-area{margin-top:52px}.auth-logo{width:190px}.auth-tagline{font-size:19px}.welcome-visual{max-width:520px;margin-left:auto;margin-right:auto}.welcome-card,.login-card{width:min(100% - 80px,610px)}.welcome-card{padding:34px 38px 38px}.login-card{padding:38px 40px 34px}.welcome-card h1,.login-heading h1{font-size:30px}}@media (width>=1050px){body{background:linear-gradient(135deg,#eef2f8,#f7f9fc);place-items:center;min-height:100vh;padding:32px;display:grid}.auth-screen{border-radius:32px;width:min(1180px,100vw - 64px);max-width:1180px;min-height:720px;box-shadow:0 30px 80px #061a6224}.auth-screen--welcome{background:#fff;grid-template-columns:minmax(0,1.12fr) minmax(380px,.88fr);display:grid}.auth-screen--welcome .auth-blue-zone{border-radius:32px 0 0 32px;min-height:720px;padding:26px 54px 46px}.auth-screen--welcome .auth-brand-area{margin-top:40px}.auth-screen--welcome .welcome-visual{height:410px;margin-top:34px}.auth-screen--welcome .welcome-card{width:auto;max-width:none;min-height:720px;box-shadow:none;border-radius:0 32px 32px 0;flex-direction:column;justify-content:center;align-items:center;margin:0;padding:60px 58px;display:flex}.auth-screen--welcome .welcome-card h1{font-size:36px}.auth-screen--welcome .welcome-card p{font-size:17px}.auth-screen--welcome .auth-primary-button,.auth-screen--welcome .auth-secondary-button{max-width:390px}.auth-screen--login{background:#fff;grid-template-columns:minmax(0,.92fr) minmax(470px,1.08fr);display:grid}.auth-screen--login .login-blue-zone{border-radius:32px 0 0 32px;min-height:720px;padding:26px 54px 46px}.auth-screen--login .auth-brand-area--login{margin-top:145px}.auth-screen--login .login-card{border-radius:24px;align-self:center;width:min(100% - 90px,520px);margin:0 auto;padding:42px 44px 38px;box-shadow:0 12px 38px #061a6214}.auth-screen--login .login-heading h1{font-size:34px}.auth-screen--login .login-security{width:54%;min-height:42px;position:absolute;bottom:12px;right:0}}@media (width>=1450px){.auth-screen{max-width:1260px}.auth-screen--welcome,.auth-screen--login,.auth-screen--welcome .auth-blue-zone,.auth-screen--welcome .welcome-card,.auth-screen--login .login-blue-zone{min-height:760px}.auth-logo{width:205px}.auth-tagline{font-size:20px}.auth-screen--welcome .welcome-card h1{font-size:38px}}@media (width<=370px){.auth-screen{max-width:100%}.auth-blue-zone{padding-left:18px;padding-right:18px}.welcome-card,.login-card{width:calc(100% - 24px)}.auth-input-shell{grid-template-columns:34px minmax(0,1fr) auto}}
