/* Reference layout: an illustrated account landing page with a focused login card. */
.member-page #main .account-mode{display:none}
.member-page #main .login-stage{min-height:calc(100svh - 78px);padding:56px max(24px,calc((100vw - 1140px)/2))!important;background:radial-gradient(ellipse at 0 30%,#76890022,transparent 45%),radial-gradient(ellipse at 90% 100%,#76890018,transparent 40%),#090e11;overflow:hidden}
.member-page #main .login-layout{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(0,1fr);gap:56px;align-items:center;width:100%;max-width:1140px;margin:auto}
.member-page #main .login-story{padding:0;min-width:0;align-self:center}
.member-page #main .login-kicker{font-size:10px;letter-spacing:.22em;margin-bottom:24px;line-height:1.8}
.member-page #main .login-story h1{font-size:clamp(38px,4vw,56px);line-height:1.02;letter-spacing:-.045em;margin:0;font-weight:800;color:#f5f6f2}
.member-page #main .login-story h1 span{color:#d0ff35}
.member-page #main .login-story-lede{font-size:19px;line-height:1.5;max-width:480px;margin:24px 0 0;color:#c2c7cc}
.member-page #main .en-modular-login-art{display:block;width:calc(100% + 40px);max-width:none;height:auto!important;max-height:none!important;aspect-ratio:auto;object-fit:contain;margin:-8px -20px -4px;border-radius:0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent),linear-gradient(180deg,transparent,#000 8%,#000 85%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent),linear-gradient(180deg,transparent,#000 8%,#000 85%,transparent);-webkit-mask-composite:source-in;mask-composite:intersect}
.member-page #main .login-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:none;margin:0}
.member-page #main .login-benefit{display:flex;gap:10px;padding-right:12px;font-size:12px;line-height:1.5}
.member-page #main .login-benefit+.login-benefit{border-left:1px solid #ffffff25;padding-left:16px}
.member-page #main .login-benefit>.en-icon{width:26px;height:26px;flex:none;color:#d0ff35}
.member-page #main .login-benefit strong{font-size:14px;margin:0 0 3px}
.member-page #main .login-card{width:100%;max-width:470px;justify-self:end;padding:40px;background:#f8f7f3;color:#141619;border:1px solid #ffffffaa;border-radius:24px;box-shadow:0 24px 64px #0003}
.member-page #main .login-card-logo{width:56px;height:56px;margin-bottom:18px}
.member-page #main .login-card h2{font-size:36px;line-height:1.1;margin-bottom:10px}
.member-page #main .login-card-intro{font-size:14px;line-height:1.5;margin-bottom:28px;color:#65707b}
.member-page #main .login-form{gap:20px}
.member-page #main .login-field label{font-size:14px;font-weight:700}
.member-page #main .login-input-wrap input{min-height:54px;background:#fff;border:1px solid #d8dcdf;border-radius:10px;font-size:14px;padding-left:44px;color:#141619}
.member-page #main .login-input-wrap>.en-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:#65707b;pointer-events:none}
.member-page #main .login-password-label a{font-size:12px}
.member-page #main .login-reveal .en-icon{width:20px;height:20px}
.member-page #main .login-submit{background:#d0ff35;color:#111;min-height:54px;border-radius:10px;font-size:15px;margin-top:6px}
.member-page #main .login-submit:hover{background:#c2ee2d}
.member-page #main .login-new{margin:28px 0 0;text-align:center;font-size:13px;line-height:1.5;color:#65707b}
.member-page #main .login-new a{color:#141619;font-weight:700}
.member-page #main .signup-section{padding:48px 24px;background:#090e11}
.member-page #main .signup-inner{width:min(100%,680px);margin:auto}
@media(max-width:900px){.member-page #main .login-stage{min-height:0;padding:36px 24px!important}.member-page #main .login-layout{grid-template-columns:minmax(0,1fr);gap:32px;max-width:600px}.member-page #main .login-card{order:0;justify-self:center;max-width:100%}.member-page #main .login-story{order:1}.member-page #main .login-story h1{font-size:42px}.member-page #main .en-modular-login-art{width:100%;margin:0}}
@media(max-width:480px){.member-page #main .login-stage{padding:24px 18px!important}.member-page #main .login-card{padding:28px 24px;border-radius:20px}.member-page #main .login-card h2{font-size:32px}.member-page #main .login-password-label{flex-wrap:wrap}.member-page #main .login-story h1{font-size:36px}.member-page #main .login-story-lede{font-size:16px}.member-page #main .login-benefits{gap:8px}.member-page #main .login-benefit{display:block;padding-right:6px}.member-page #main .login-benefit+.login-benefit{padding-left:10px}.member-page #main .login-benefit .en-icon{margin-bottom:6px}.member-page #main .login-kicker{font-size:9px}}

/* Official logo and contrast on the dark registration section. */
.member-page #main .login-card-logo{display:block;width:64px;height:auto;aspect-ratio:auto;object-fit:contain;padding:0;background:transparent;border-radius:0;margin-bottom:22px}
.member-page #main .signup-section{color:#f5f6f2}
.member-page #main .signup-inner>p:first-child{color:#d0ff35}
.member-page #main .signup-inner h2{color:#f5f6f2}
.member-page #main .signup-intro{color:#c2c7cc}
.member-page #main .signup-intro a{color:#d0ff35;text-decoration:underline;text-underline-offset:3px}
.member-page #main .signup-intro a:focus-visible{outline:2px solid #d0ff35;outline-offset:4px}
.member-page #main .signup-form{color:#141619;color-scheme:light}
.member-page #main .signup-fields h3{color:#141619}
.member-page #main .signup-form label span{color:#535967}