@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root{--g:#08a65a;--gd:#087b45;--r:#ed2028;--ink:#17231e}
*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Inter,Arial;color:var(--ink);overflow-x:hidden;background:#06180f}
body:before{content:"";position:fixed;inset:0;z-index:-3;background:url("background.png") center/cover no-repeat;transform:scale(1.04);animation:bg 18s ease-in-out infinite alternate}
body:after{content:"";position:fixed;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(0,65,37,.22),rgba(255,255,255,.05) 50%,rgba(0,0,0,.34))}
#particles{position:fixed;inset:0;z-index:-1;pointer-events:none}.particle{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff;box-shadow:0 0 12px #fff;animation:up linear infinite}
main{min-height:100vh;display:grid;grid-template-columns:.9fr 1.1fr}.brand{display:flex;align-items:center;padding:6vw;color:#fff}.brand-inner{max-width:590px;animation:slide .8s ease}.logo{font-size:62px;font-weight:800;letter-spacing:-5px;line-height:.8;text-shadow:0 8px 25px #0002}.logo i,.mini-logo i{color:var(--r);font-style:normal;margin-right:-4px}.logo span,.mini-logo span{color:var(--g)}.logo b,.mini-logo b{color:var(--r)}.tag{display:block;margin:12px 0 52px 54px;font-size:10px;letter-spacing:2.5px}.brand em{font-size:11px;font-style:normal;font-weight:800;letter-spacing:2.5px;color:#d8ffeb}.brand h1{font-size:clamp(40px,4.2vw,66px);line-height:1;letter-spacing:-3px;margin:13px 0 20px}.brand h1 strong{color:#b9ffd8}.brand p{font-size:14px;line-height:1.7;max-width:510px;color:#ffffffdc}.benefits{margin-top:35px;display:grid;gap:15px}.benefits>div{display:flex;align-items:center;gap:13px}.benefits>div>i{width:43px;height:43px;border-radius:50%;display:grid;place-items:center;background:#fffffff0;color:var(--g);font-style:normal;font-weight:800}.benefits>div>i.red{color:var(--r)}.benefits b,.benefits small{display:block}.benefits b{font-size:13px}.benefits small{font-size:11px;color:#ffffffad;margin-top:3px}
.login-area{display:grid;place-items:center;padding:40px 5vw}.card{width:min(100%,550px);padding:32px 39px 26px;border:1px solid #ffffffc9;border-radius:30px;background:#ffffffe8;backdrop-filter:blur(20px);box-shadow:0 35px 90px #0004,0 2px 0 #fff inset;animation:card .8s cubic-bezier(.2,.8,.2,1);position:relative;overflow:hidden;transition:transform .15s ease}.card:before{content:"";position:absolute;top:-80%;left:-70%;width:55%;height:180%;background:#fff4;transform:rotate(20deg);animation:shine 7s infinite}.card>*{position:relative;z-index:1}header{display:flex;justify-content:space-between;align-items:flex-start}.mini-logo{font-size:31px;font-weight:800;letter-spacing:-2.5px;line-height:.85}.mini-logo i{font-size:28px}.mini-logo+small{display:block;margin:5px 0 0 26px;font-size:7px;letter-spacing:1.2px;color:#718079;font-weight:700}header>button{border:1px solid #dce6e0;background:#ffffffa8;border-radius:10px;padding:8px 11px;color:#68756f;font-size:11px}.head{text-align:center;margin:30px 0 24px}.head em{font-size:10px;color:var(--g);font-style:normal;font-weight:800;letter-spacing:2px}.head h2{font-size:36px;letter-spacing:-1.5px;margin:7px 0}.head p{font-size:13px;color:#7b8781;margin:0}.roles{display:grid;grid-template-columns:1fr 1fr;padding:5px;background:#edf3ef;border-radius:15px;position:relative;margin-bottom:24px}.roles button{height:46px;border:0;background:transparent;border-radius:11px;z-index:2;color:#77837d;font-weight:700;font-size:11px;cursor:pointer}.roles button.active{color:#fff}.roles span{position:absolute;left:5px;top:5px;width:calc(50% - 7px);height:46px;border-radius:11px;background:linear-gradient(110deg,#078d4d,#0bb967);box-shadow:0 7px 18px #08a65a38;transition:.35s}.roles.partner span{transform:translateX(calc(100% + 5px));background:linear-gradient(110deg,#df1b24,#f33d42);box-shadow:0 7px 18px #ed20282e}form>label{display:block;font-size:11px;font-weight:700;color:#44524c;margin-bottom:16px}.input{height:53px;margin-top:7px;position:relative;color:#9aa6a0}.input>input{width:100%;height:100%;border:1px solid #dfe8e3;border-radius:14px;background:#ffffffc9;padding:0 45px;outline:none;color:var(--ink);transition:.25s}.input>input:focus{border-color:#08a65a88;box-shadow:0 0 0 4px #08a65a17;background:#fff}.input>input::placeholder{color:#a1aca7}.input>button{position:absolute;right:4px;top:5px;width:42px;height:42px;border:0;background:transparent;color:#8c9992;cursor:pointer}.input{padding-left:15px;display:flex;align-items:center}.input>input{position:absolute;left:0;top:0}.input>button{z-index:3}.options{display:flex;justify-content:space-between;align-items:center;margin:2px 0 20px;font-size:11px}.remember{font-weight:500!important;color:#637069!important;margin:0!important;display:flex!important;align-items:center;gap:7px}.remember input{display:none}.remember i{width:17px;height:17px;border:1.5px solid #cbd6d0;border-radius:5px;background:#fff}.remember input:checked+i{background:var(--g);border-color:var(--g);box-shadow:inset 0 0 0 4px #fff}.options a{color:var(--r);font-weight:700;text-decoration:none}.submit{width:100%;height:56px;border:0;border-radius:15px;background:linear-gradient(100deg,#078f4e,#0ab965);color:#fff;font-size:14px;font-weight:800;cursor:pointer;box-shadow:0 13px 28px #08a65a38;transition:.2s}.submit:hover{transform:translateY(-2px);box-shadow:0 17px 32px #08a65a4a}.or{display:flex;align-items:center;gap:12px;justify-content:center;color:#a0aaa5;font-size:11px;margin:22px 0}.or span{height:1px;background:#e0e7e3;flex:1}.register{text-align:center;font-size:11px;color:#75817b}.register a{color:var(--gd);font-weight:800;text-decoration:none;margin-left:4px}.security{text-align:center;color:#a0aaa5;font-size:9px;margin-top:19px}.security:first-letter{color:var(--g)}#toast{position:fixed;z-index:20;left:50%;bottom:24px;transform:translate(-50%,100px);opacity:0;background:#10231a;color:#fff;padding:13px 18px;border-radius:12px;font-size:12px;transition:.35s;box-shadow:0 15px 45px #0004}#toast.show{transform:translate(-50%,0);opacity:1}
@keyframes card{from{opacity:0;transform:translateY(30px) scale(.97)}to{opacity:1;transform:none}}@keyframes slide{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:none}}@keyframes bg{to{transform:scale(1.09) translate(-8px,-5px)}}@keyframes shine{0%,55%{left:-70%;opacity:0}65%{opacity:1}85%,100%{left:140%;opacity:0}}@keyframes up{from{transform:translateY(105vh);opacity:0}15%{opacity:.7}90%{opacity:.15}to{transform:translateY(-10vh);opacity:0}}
@media(max-width:950px){main{grid-template-columns:1fr}.brand{min-height:380px;padding:45px 7vw 90px}.login-area{margin-top:-65px;padding:0 20px 35px}.benefits{grid-template-columns:repeat(3,1fr)}.benefits small{display:none}}
@media(max-width:600px){.brand{min-height:320px;padding:28px 24px 80px}.logo{font-size:43px}.logo i{font-size:38px}.tag{margin:8px 0 30px 38px;font-size:8px}.brand h1{font-size:34px;letter-spacing:-1.5px}.brand p{font-size:12px}.benefits{display:none}.login-area{padding:0 12px 25px}.card{padding:25px 19px 22px;border-radius:24px}.head h2{font-size:30px}.roles button{font-size:10px}.options{font-size:10px}}
/* Production form integration and accessible responsive layout. */
.home-link{position:relative;z-index:2;display:inline-block;margin:16px 24px 0;color:white;font-size:13px;text-decoration:none;font-weight:700}
main{min-height:calc(100svh - 48px)}
.language{border:1px solid #dce6e0;border-radius:10px;padding:8px 11px;color:#68756f;font-size:11px}
.login-area{min-width:0;padding:24px 4vw}
.card{max-width:550px}
form>label{margin:0 0 7px;font-size:13px}
form>.input{margin:0 0 16px}
.input>input{font:inherit;font-size:16px}
.input-icon{position:relative;z-index:2;pointer-events:none}
.options{gap:10px;flex-wrap:wrap;font-size:12px}
.remember{position:relative;min-height:24px;cursor:pointer}
.remember input{display:block;position:absolute;left:0;top:3px;width:18px;height:18px;margin:0;opacity:0}
.remember input:focus-visible+i{outline:3px solid #08a65a88;outline-offset:3px}
a:focus-visible,button:focus-visible{outline:3px solid #08a65a;outline-offset:3px}
.roles button{font-size:12px}.roles button:disabled,.submit:disabled{cursor:wait;opacity:.7}
.message{margin:14px 0 0;padding:12px;border-radius:10px;background:#edf5ef;color:#24583e;font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.message[data-type=error]{color:#96272e;background:#fff0ef}.message[data-type=success]{color:#087b45;background:#eaf8ef}
[hidden]{display:none!important}
.login-footer{position:relative;width:min(760px,calc(100% - 32px));margin:0 auto 16px}
.login-footer .support-hours{margin:0;background:#ffffffed;text-align:center}
.login-footer .support-hours p{margin:0 0 8px}
body[data-page=unified-login] .cookie-notice{position:relative;inset:auto;width:calc(100% - 32px);margin:0 auto 16px}
@media(min-width:951px) and (max-height:800px){.card{padding:24px 32px 20px}.head{margin:18px 0}.head h2{font-size:32px}.roles{margin-bottom:18px}.or{margin:16px 0}.brand{padding:4vw}.tag{margin-bottom:32px}}
@media(max-width:950px){.brand{display:none}main{display:block;min-height:calc(100svh - 48px)}.login-area{margin:0;min-height:calc(100svh - 48px);padding:20px}.card{width:min(100%,550px)}}
@media(max-width:600px){.home-link{margin:14px 16px 0}.login-area{padding:16px 12px 24px}.card{padding:22px 18px}.head{margin:20px 0}.roles{margin-bottom:18px}.roles button{font-size:11px}.options{font-size:11px}.or{margin:18px 0}.cookie-notice{flex-wrap:wrap}.cookie-notice button{margin-left:auto}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}