/* Public access: captures of the isolated demo workspace. */
html:has(#loginScreen:not([hidden])){zoom:1!important}
body:has(#loginScreen:not([hidden])) #pwaInstallBanner{display:none!important}
#loginScreen{--login-primary:#082c70;--login-accent:#ffbe00;--auth-ink:#152b4c;--auth-muted:#6b7d94;--auth-line:#d6e1ef;--auth-surface:#fff;box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);min-height:100svh;padding:0;gap:0;background:var(--auth-surface);color:var(--auth-ink);font-family:Inter,ui-sans-serif,system-ui,sans-serif}
#loginScreen[hidden],#loginScreen [hidden][hidden]{display:none!important}
#loginScreen .login-visual{box-sizing:border-box;position:relative;overflow:hidden;border:0;border-radius:0;min-width:0;padding:clamp(32px,4vw,70px) clamp(24px,3.3vw,64px) 25px;background:linear-gradient(135deg,var(--login-primary),color-mix(in srgb,var(--login-primary) 75%,#051a42));color:white;display:flex;flex-direction:column;justify-content:center;gap:24px}
#loginScreen .login-visual-inner{width:100%;max-width:960px;margin:auto;position:relative}
#loginScreen .login-eyebrow{font-size:10px;letter-spacing:.2em;font-weight:650;color:#d1e4ff;margin:0 0 14px}
#loginScreen .login-visual h1{font-size:clamp(28px,3vw,49px);font-weight:600;line-height:1.15;letter-spacing:-.045em;color:#fff;margin:0 0 12px;overflow-wrap:anywhere}
#loginScreen .login-visual-inner>p:not(.login-eyebrow){max-width:620px;margin:0 0 32px;color:#d9e8ff;font-size:14px;line-height:1.7;overflow-wrap:anywhere}
#loginScreen .login-product{position:relative;width:100%;max-width:min(100%,max(300px,calc((100svh - 430px)*1.3)));padding:0 7% 8% 0;box-sizing:border-box;margin:25px auto 10px;isolation:isolate}
#loginScreen .login-desktop-frame{border-radius:14px;overflow:hidden;border:1px solid #ffffff90;background:#fff;box-shadow:0 22px 65px #08275045;transform:perspective(1800px) rotateY(3deg)}
#loginScreen .login-browser-bar{height:30px;display:flex;align-items:center;justify-content:space-between;gap:16px;background:#f9fafc;border-bottom:1px solid #e1e8f2;padding:0 14px;color:#8b9bb2;font-size:8px}
#loginScreen .login-browser-bar>span{color:#b7c6d9;letter-spacing:2px;white-space:nowrap}
#loginScreen .login-browser-bar>b{background:#edf1f7;color:#7a8ba3;flex:1;text-align:center;padding:4px 8px;font-size:8px;font-weight:500;border-radius:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#loginScreen .login-browser-bar svg{width:10px;height:10px}
#loginScreen .login-desktop-frame>img{display:block;width:100%;height:auto}
#loginScreen .login-phone-frame{position:absolute;right:-1%;bottom:4%;width:24%;padding:6px;background:#fff;border-radius:24px;border:1px solid #e3e9f3;box-shadow:0 18px 45px #092b6670;transform:rotate(2deg);overflow:hidden}
#loginScreen .login-phone-frame img{display:block;width:100%;height:auto;border-radius:18px}
#loginScreen .login-phone-speaker{width:32%;height:8px;position:absolute;top:6px;left:34%;background:#fff;border-radius:0 0 8px 8px;z-index:1}
#loginScreen figcaption{position:absolute;bottom:1%;left:0;color:#c4d9f6;font-size:9px;letter-spacing:.02em}
#loginScreen .login-referral{align-self:center;display:flex;align-items:center;gap:14px;background:#0a214d;color:#fff;border:1px solid #ffffff15;box-shadow:0 8px 30px #071a3c22;border-radius:60px;padding:15px 18px;margin:10px 0;text-decoration:none;font-size:12px;max-width:100%;box-sizing:border-box}
#loginScreen .login-referral>span{display:grid;place-items:center;background:#ffffff10;border:1px solid #ffffff20;width:37px;height:37px;border-radius:50%;flex-shrink:0}
#loginScreen .login-referral svg{width:19px;height:19px;color:var(--login-accent)}
#loginScreen .login-referral div{line-height:1.6}#loginScreen .login-referral strong{display:block;color:var(--login-accent)}
#loginScreen .login-referral>b{padding:12px 15px;border-radius:30px;color:#0a214d;background:var(--login-accent);font-size:10px;white-space:nowrap}
#loginScreen .login-visual-foot{display:block;align-self:center;text-align:center;font-size:9px;line-height:1.8;color:#c4d9f6;letter-spacing:.01em;margin:8px 0 0}
#loginScreen .login-panel{display:flex;align-items:center;justify-content:center;min-width:0;padding:34px clamp(28px,4vw,76px);box-sizing:border-box;background:var(--auth-surface)}
#loginScreen:not(.registration-mode) #loginForm.login-form{box-sizing:border-box;width:100%!important;max-width:390px!important;padding:0!important;background:transparent;border:0;border-radius:0;box-shadow:none;margin:auto}
#loginScreen .login-mobile-brand{display:flex!important;align-items:center;justify-content:center;overflow:hidden;height:117px;width:100%;margin:0 0 26px}
#loginScreen .login-mobile-brand img{width:240.5px!important;height:160.55px!important;max-width:71.5%!important;object-fit:contain}
#loginScreen .login-mobile-brand img[data-custom-logo]{width:65%!important;max-width:221px!important;height:104px!important}
#loginScreen .login-kicker{font-size:10px;font-weight:650;letter-spacing:.15em;color:var(--login-primary);text-transform:uppercase;margin:0 0 10px}
#loginScreen #authTitle{color:var(--auth-ink);font:600 clamp(24px,2.25vw,34px)/1.2 Inter,system-ui,sans-serif;letter-spacing:-.04em;margin:0 0 10px;overflow-wrap:anywhere}
#loginScreen #authSub{font-size:13px;color:var(--auth-muted);line-height:1.65;margin:0 0 30px;overflow-wrap:anywhere}
#loginScreen #loginFields{display:grid;gap:23px}
#loginScreen #loginFields>label{display:block;margin:0;font-size:12px;font-weight:550;line-height:1.5;color:var(--auth-ink);text-transform:none!important;letter-spacing:normal!important}
#loginScreen .login-field-label{display:block;margin-bottom:4px}
#loginScreen .login-input{display:block;position:relative}
#loginScreen .login-input>svg{display:none}
#loginScreen #loginFields .login-input input{box-sizing:border-box;display:block;width:100%;height:43px;min-height:43px;padding:6px 0;border:0;border-bottom:1px solid var(--auth-line);border-radius:0!important;background:transparent;color:var(--auth-ink);font:400 14px/1.5 Inter,system-ui,sans-serif;outline:none;box-shadow:none;transition:border-color .15s}
#loginScreen #loginFields .login-input input:focus{border-bottom:2px solid var(--login-primary)}
#loginScreen #loginFields input::placeholder{color:#9caac0;font-size:12px}
#loginScreen #loginFields .password-wrap input{padding-right:54px}
#loginScreen #loginFields .password-wrap button{position:absolute;top:0;right:0;height:43px;min-height:43px;width:48px;margin:0;padding:0;border:0;background:transparent;color:var(--login-primary);font-size:11px;font-weight:600;transform:none;cursor:pointer}
#loginScreen #forgotPassword{justify-self:start;border:0;background:transparent;padding:0;margin:0;color:var(--login-primary);font-size:11px;font-weight:600;cursor:pointer}
#loginScreen #loginSubmit{display:flex;align-items:center;justify-content:center;gap:14px;width:100%;height:46px;min-height:46px;border:0!important;border-radius:30px!important;background:linear-gradient(105deg,#0b2147,var(--login-primary))!important;color:#fff;font-size:12px;font-weight:650;margin:26px 0 0;padding:12px 24px;box-shadow:0 7px 15px #102f5e12;cursor:pointer}
#loginScreen #loginSubmit:hover{filter:brightness(1.1)}#loginScreen #loginSubmit:disabled{opacity:.6;cursor:wait}
#loginScreen .login-divider{color:var(--auth-muted);font-size:9px;margin:21px 0 15px}
#loginScreen .login-divider::before,#loginScreen .login-divider::after{background:var(--auth-line)}
#loginScreen .google-auth-button{box-sizing:border-box;height:44px;min-height:44px;border:1px solid var(--auth-line);border-radius:30px;background:transparent;color:var(--auth-ink);font-size:12px;gap:10px;box-shadow:none}
#loginScreen .google-auth-button svg{width:18px;height:18px}
#loginScreen .login-hint{font-size:11px;line-height:1.6;margin:24px 0 0;text-align:center}
#loginScreen .login-hint a{color:var(--login-primary);text-decoration:none;font-weight:600}
#loginScreen .login-legal{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;font-size:10px;margin:22px 0 0;color:var(--auth-muted)}
#loginScreen .login-legal a{color:var(--auth-muted);text-decoration:none}
#loginScreen .login-mobile-referral{display:none;margin-top:24px;text-align:center;font-size:11px;color:var(--login-primary)}
#loginScreen :is(button,a):focus-visible{outline:2px solid var(--login-primary);outline-offset:4px}
#loginScreen #authStatus:empty{display:none}#loginScreen #authStatus.show{font-size:12px;line-height:1.6;margin-top:18px;border-radius:8px}
#loginScreen.registration-mode{grid-template-columns:minmax(280px,.65fr) minmax(0,1.35fr)}
#loginScreen.registration-mode .login-panel{align-items:flex-start;padding:24px}
#loginScreen.registration-mode #loginForm.login-form{max-width:980px}
#loginScreen.registration-mode .login-mobile-brand{height:65px;margin-bottom:12px}
#loginScreen.registration-mode .login-mobile-brand img{width:146.25px!important;height:97.5px!important}
#loginScreen.registration-mode .login-product{margin-top:40px}#loginScreen.registration-mode .login-phone-frame{display:none}
html[data-theme=dark] #loginScreen{--auth-ink:#e6edf9;--auth-muted:#a3b6d0;--auth-line:#334760;--auth-surface:#101f34}
html[data-theme=dark] #loginScreen .login-mobile-brand img:not([data-custom-logo]){filter:brightness(0) invert(1)}
html[data-theme=dark] #loginScreen :is(.login-kicker,.login-hint a,#forgotPassword,.ghost-toggle,.login-mobile-referral){color:#8ab7f9}
@media(min-width:1700px){#loginScreen .login-visual{padding-inline:6vw}#loginScreen .login-product{margin-top:40px}#loginScreen:not(.registration-mode) #loginForm.login-form{max-width:400px!important}#loginScreen .login-mobile-brand{height:136.5px}#loginScreen .login-mobile-brand img{width:273px!important;height:182px!important}}
@media(max-width:1100px){#loginScreen{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}#loginScreen .login-visual{padding-inline:28px}#loginScreen .login-panel{padding:30px}#loginScreen .login-referral{font-size:10px;gap:9px;padding:12px}#loginScreen .login-referral>b{padding:10px;font-size:9px}#loginScreen .login-referral>span{display:none}}
@media(max-width:800px){#loginScreen,#loginScreen.registration-mode{display:flex;flex-direction:column;padding:0;gap:0}#loginScreen .login-visual{display:none!important}#loginScreen .login-panel,#loginScreen.registration-mode .login-panel{width:100%;min-height:100svh;padding:28px 28px 36px!important;align-items:center!important}#loginScreen:not(.registration-mode) #loginForm.login-form{width:100%!important;max-width:390px!important;padding:0!important}#loginScreen .login-mobile-brand{height:104px;margin-bottom:18px}#loginScreen .login-mobile-brand img{width:214.5px!important;height:143px!important}#loginScreen .login-mobile-referral{display:block}#loginScreen.registration-mode #loginForm.login-form{padding:0!important;width:100%!important;border:0!important;box-shadow:none!important}}
@media(max-width:360px){#loginScreen .login-panel{padding:20px!important}#loginScreen .login-mobile-brand{height:91px}#loginScreen .login-mobile-brand img{width:195px!important;height:130px!important}}
@media(prefers-reduced-motion:reduce){#loginScreen *{transition:none!important}}
@media(min-width:801px) and (max-height:800px){#loginScreen:not(.registration-mode) .login-mobile-brand{height:78px;margin-bottom:18px}#loginScreen:not(.registration-mode) .login-mobile-brand img{width:195px!important;height:130px!important}#loginScreen:not(.registration-mode) #authSub{margin-bottom:22px}#loginScreen:not(.registration-mode) #loginFields{gap:18px}#loginScreen:not(.registration-mode) .login-panel{padding-block:24px}}
