body[data-login-role=platform]{--accent:#4665ed;--accent-dark:#304ecf;--accent-soft:#eef1ff;--accent-ring:#d5ddff;--login-bg:#eef1ff;--login-ink:#303960;--login-orbit:#cbd5ff}
body[data-login-role=merchant]{--accent:#8b5be8;--accent-dark:#7243cb;--accent-soft:#f3edff;--accent-ring:#e1d2ff;--login-bg:#f2ecfc;--login-ink:#4b376b;--login-orbit:#e1cef5}
body[data-login-role=promoter]{--accent:#d96b54;--accent-dark:#bc523f;--accent-soft:#fff0eb;--accent-ring:#f9d6ca;--login-bg:#fff0e9;--login-ink:#68423c;--login-orbit:#f3cbbb}
.login-layout{min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr) minmax(440px,42%);background:var(--login-bg,#eef1ff)}.login-hero{padding:43px clamp(40px,6vw,96px);display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;min-height:800px}.login-hero:before{content:'';position:absolute;width:540px;height:540px;border:1px solid var(--login-orbit);border-radius:50%;right:-210px;top:160px;opacity:.8}.login-hero:after{content:'';position:absolute;width:670px;height:670px;border:1px solid var(--login-orbit);border-radius:50%;right:-275px;top:95px;opacity:.45}.login-hero .brand{position:relative;z-index:2;width:fit-content;padding:0;font-size:21px;color:var(--login-ink)}.login-hero .brand small{color:var(--accent);opacity:.65}.login-hero .mark{width:42px;height:42px}.login-copy{position:relative;z-index:2;margin-top:-135px}.login-eyebrow{color:var(--accent);font-size:11px;letter-spacing:.16em;font-weight:700;margin-bottom:24px}.login-hero h1{font-size:clamp(38px,4.1vw,66px);font-weight:800;line-height:1.25;letter-spacing:-2px;color:var(--login-ink);margin:0}.login-hero h1 span{color:var(--accent)}.login-hero p{color:var(--login-ink);opacity:.6;line-height:1.9;font-size:13px;max-width:320px;margin:23px 0 0}.login-footer{color:var(--login-ink);opacity:.43;font-size:10px;letter-spacing:.08em;position:relative;z-index:2}.login-illustration{width:315px;height:240px;position:absolute;right:6%;bottom:9%;z-index:1;transform:rotate(-5deg)}.login-illustration svg{width:100%;height:100%}.login-panel{background:#ffffffeb;display:grid;place-items:center;padding:45px clamp(35px,5vw,75px);position:relative}.login-card{width:100%;max-width:350px}.login-back{display:inline-flex;align-items:center;gap:8px;color:#9099af;font-size:11px;margin-bottom:39px}.login-back:hover,.login-continue:hover{color:var(--accent)}.login-card>.mark{width:38px;height:38px;margin-bottom:22px}.login-card h2{font-size:29px;font-weight:750;color:#2b3149;letter-spacing:-.5px;margin:0}.login-card>p{font-size:11px;line-height:1.8;color:#9098ac;margin:12px 0 25px}.login-portals{display:flex;gap:5px;padding:5px;background:#f5f6fb;border:1px solid #edeff6;border-radius:11px;margin-bottom:30px}.login-portals a{flex:1;text-align:center;color:#959db0;font-size:10px;padding:10px 3px;white-space:nowrap;border-radius:7px;font-weight:550}.login-portals a[aria-current]{background:#fff;color:var(--accent);box-shadow:0 3px 10px #27326708;font-weight:750}.login-portals a:hover{color:var(--accent)}.login-card .field{margin-bottom:20px}.login-card .field label{font-size:11px;color:#707b94}.login-card input{width:100%;height:46px;border-color:#e5e8f1;border-radius:10px;background:#fdfdff;font-size:12px;padding:12px 14px}.login-card input:focus{border-color:var(--accent);background:#fff}.login-card input::placeholder{color:#a7aec0}.login-card .btn{width:100%;margin-top:11px;padding:15px;border-radius:10px;font-size:12px;font-weight:650;letter-spacing:.04em;box-shadow:0 8px 16px color-mix(in srgb,var(--accent) 16%,transparent)}.login-error{background:#fff1f0;border:1px solid #f2dcda;color:#ac5a56;border-radius:9px;font-size:11px;line-height:1.7;padding:11px 13px;margin:3px 0 10px}.login-error[hidden]{display:none}.login-hint{display:block;text-align:center;font-size:10px;color:#a3abbe;margin-top:21px}.login-continue{display:block;text-align:center;font-size:11px;color:#8a94ab;margin-top:24px}.login-session{margin-top:2px;color:#7e7892;font-size:11px;line-height:1.9}.login-card a:focus-visible{outline:3px solid var(--accent-ring);outline-offset:3px}
@media(max-width:1100px){.login-layout{grid-template-columns:minmax(0,1fr) 440px}.login-hero{padding:40px}.login-hero h1{font-size:44px}.login-copy{margin-top:-160px}.login-illustration{width:280px;right:5%;bottom:10%}.login-panel{padding:40px}.login-hero p{max-width:240px}}
@media(max-width:800px){.login-layout{grid-template-columns:1fr}.login-hero{display:flex;min-height:230px;height:230px;padding:27px 30px}.login-hero .brand{font-size:17px}.login-hero .brand .mark{width:32px;height:32px}.login-hero .brand small{font-size:8px;margin-top:3px}.login-copy{margin:0}.login-eyebrow,.login-footer,.login-hero p{display:none}.login-hero h1{font-size:31px;letter-spacing:-1px;line-height:1.3}.login-hero h1 br{display:none}.login-hero h1 span{display:block}.login-illustration{width:180px;height:145px;right:20px;bottom:-15px;opacity:.9}.login-hero:before{width:330px;height:330px;top:-25px;right:-110px}.login-hero:after{width:430px;height:430px;top:-75px;right:-160px}.login-panel{min-height:calc(100vh - 230px);padding:34px 30px 42px;align-items:start;border-radius:23px 23px 0 0;margin-top:-18px;z-index:3}.login-card{max-width:390px}.login-back{margin-bottom:24px}.login-card>.mark{display:none}.login-card h2{font-size:25px}.login-card>p{margin-bottom:22px}.login-portals{margin-bottom:25px}}
@media(max-width:400px){.login-hero{padding:25px}.login-hero h1{font-size:28px}.login-illustration{width:150px;right:6px;bottom:-20px}.login-panel{padding:28px 25px 38px}.login-portals a{font-size:10px;padding:10px 1px}}