:root{--yuna-purple:#5b55bd;--yuna-purple-dark:#4d47ad;--yuna-blue:#7e9cff;--yuna-pink:#f43f91;--ink:#252338;--muted:#8c8ca2;--line:#e8e9f4;--surface:#fff}
*{box-sizing:border-box}html,body{min-height:100%;margin:0}body.login-page{font-family:'Nunito Sans',sans-serif;color:var(--ink);background:#f4f6ff;min-height:100vh;padding:26px;display:flex;align-items:center;justify-content:center}.login-shell{width:min(1480px,100%);margin:auto}.login-brand{display:flex;align-items:center;justify-content:center;gap:13px;margin:0 auto 25px}.login-logo{width:54px;height:54px;object-fit:contain;display:block}.brand-copy{text-align:left;line-height:1.08}.brand-title{font-size:27px;font-weight:900;letter-spacing:-.7px;color:var(--yuna-purple)}.brand-subtitle{font-size:13px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:#74738a;margin-top:5px}.login-content{min-height:650px;display:grid;grid-template-columns:1.08fr .92fr;background:#fff;border:1px solid rgba(104,102,186,.09);border-radius:30px;overflow:hidden;box-shadow:0 24px 70px rgba(68,65,142,.10)}.visual-panel{position:relative;isolation:isolate;overflow:hidden;min-height:650px;background:linear-gradient(145deg,#edf0ff 0%,#f9f3ff 48%,#fff0f7 100%);display:flex;align-items:center;justify-content:center;padding:25px 34px 175px}.visual-panel:before{content:"";position:absolute;z-index:-1;width:570px;height:570px;border-radius:50%;background:linear-gradient(135deg,rgba(126,156,255,.23),rgba(244,63,145,.13));top:60px;left:50%;transform:translateX(-50%)}.visual-glow{position:absolute;border-radius:50%;filter:blur(2px);z-index:-1}.visual-glow-one{width:180px;height:180px;background:rgba(126,156,255,.16);left:-70px;top:55px}.visual-glow-two{width:140px;height:140px;background:rgba(244,63,145,.13);right:-40px;bottom:95px}.store-illustration{display:block;width:min(100%,570px);max-height:510px;object-fit:contain;filter:drop-shadow(0 24px 28px rgba(103,75,160,.12));position:relative;z-index:1}.visual-caption{position:absolute;left:48px;right:48px;bottom:39px;text-align:center}.caption-kicker{font-size:10px;letter-spacing:2.6px;font-weight:900;color:var(--yuna-purple)}.visual-caption h1{font-size:27px;line-height:1.12;font-weight:900;letter-spacing:-.6px;margin:9px 0 7px;color:#28243f}.visual-caption h1 span{color:var(--yuna-pink)}.visual-caption p{font-size:13px;color:#7c7b91;margin:0}.visual-dots{position:absolute;bottom:17px;display:flex;gap:6px}.visual-dots i{width:5px;height:5px;border-radius:50%;background:#c5c7e8}.visual-dots i:first-child{width:18px;border-radius:8px;background:var(--yuna-purple)}.form-panel{display:flex;align-items:center;justify-content:center;padding:55px 8%}.form-inner{width:100%;max-width:430px}.mobile-logo-wrap{display:none}.welcome-label{font-size:10px;letter-spacing:1.8px;color:var(--yuna-purple);font-weight:900;display:flex;align-items:center;gap:8px}.welcome-dot{height:7px;width:7px;border-radius:50%;background:#f45a9d;box-shadow:0 0 0 4px #ffe5f0}.form-inner h2{font-size:40px;font-weight:900;letter-spacing:-1.5px;margin:13px 0 5px;color:#201f30}.form-description{font-size:14px;color:#85859b;margin:0 0 34px}.form-label{font-size:12px;font-weight:800;color:#4d4b63;margin-bottom:9px}.input-wrap{position:relative;display:flex;align-items:center}.input-wrap>svg{position:absolute;left:17px;width:21px;height:21px;fill:none;stroke:#8582c9;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;z-index:2}.input-wrap .form-control{height:57px;border:1px solid #e1e3f2;border-radius:15px;padding:0 49px;background:#fafbff;font-size:14px;color:#29273d;box-shadow:none;transition:border-color .2s,box-shadow .2s}.input-wrap .form-control::placeholder{color:#b0b0c0}.input-wrap .form-control:focus{border-color:#8c9cff;background:#fff;box-shadow:0 0 0 4px rgba(126,156,255,.13)}.password-toggle{position:absolute;right:13px;border:0;background:transparent;padding:5px;color:#88869f;display:grid;place-items:center}.password-toggle svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.form-meta{display:flex;justify-content:flex-start;align-items:center;margin:13px 0 22px}.secure-note{font-size:11px;color:#9291a5}.secure-icon{display:inline-grid;place-items:center;width:16px;height:16px;margin-right:5px;border-radius:50%;background:#e4f8ef;color:#169c6b;font-size:10px;font-weight:900}.login-button{height:57px;width:100%;border:0;border-radius:15px;padding:0 20px;background:linear-gradient(100deg,var(--yuna-purple),#7169d8);color:#fff;font-size:14px;font-weight:900;display:flex;align-items:center;justify-content:center;position:relative;box-shadow:0 12px 23px rgba(91,85,189,.22);transition:transform .18s,box-shadow .18s}.login-button:hover,.login-button:focus{color:#fff;transform:translateY(-1px);box-shadow:0 15px 26px rgba(91,85,189,.27)}.button-arrow{position:absolute;right:18px;font-size:22px;font-weight:500;line-height:1}.login-message{display:none;font-size:12px;padding:10px 12px;border-radius:10px;margin:-8px 0 14px}.login-message.show{display:block}.login-message.error{background:#fff0f2;color:#bd3451}.login-message.success{background:#eaf9f2;color:#18835a}.form-footer{display:flex;align-items:center;gap:12px;margin:30px 0 9px;color:#aaa9bb;font-size:10px;white-space:nowrap}.footer-line{height:1px;background:#eeedf5;flex:1}.copyright{text-align:center;font-size:10px;color:#b2b1c1;margin:0}
@media(max-width:900px){body.login-page{padding:8px 16px 16px;align-items:flex-start;justify-content:center}.login-content{grid-template-columns:1fr;min-height:0;max-width:540px;margin:auto}.visual-panel{min-height:320px;padding:8px 20px 100px}.visual-panel:before{width:320px;height:320px;top:10px}.store-illustration{max-height:270px;width:min(100%,340px)}.visual-caption{bottom:19px;left:18px;right:18px}.visual-caption h1{font-size:21px;margin:5px 0}.visual-caption p{font-size:11px}.caption-kicker{font-size:9px}.visual-dots{display:none}.form-panel{padding:32px 28px 27px}.form-inner h2{font-size:32px;margin-top:10px}.form-description{margin-bottom:24px}.login-brand{margin-bottom:15px}.login-logo{width:45px;height:45px}.brand-title{font-size:23px}}
@media(max-width:480px){body.login-page{padding:4px 12px 12px;background:#f5f6ff;align-items:flex-start;justify-content:center}.login-brand{margin-bottom:12px}.login-content{border-radius:22px}.visual-panel{min-height:255px;padding:0 14px 77px}.visual-panel:before{width:250px;height:250px;top:0}.store-illustration{max-height:205px;width:min(100%,270px)}.visual-caption{bottom:13px}.visual-caption h1{font-size:18px}.visual-caption p{font-size:10px}.form-panel{padding:27px 21px 23px}.form-inner h2{font-size:30px}.input-wrap .form-control{height:53px}.login-button{height:54px}.form-footer{margin-top:23px}}
