*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% -10%,#e5ebff 0,transparent 42%),#f2f4f8;color:#172338;font:16px/1.5 "DM Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:#126467}button:focus-visible,a:focus-visible{outline:3px solid #d5a745;outline-offset:3px}[hidden]{display:none!important}.login-shell{max-width:500px;min-height:100dvh;margin:auto;padding:max(20px,env(safe-area-inset-top)) 18px max(20px,env(safe-area-inset-bottom));background:linear-gradient(140deg,#e8eeff 0%,#f7f8fb 52%,#e3f5f0 100%)}.brand{display:flex;align-items:center;gap:11px;color:#172338;padding:6px 4px 22px}.brand img{border-radius:14px;box-shadow:0 5px 18px #0002}.brand strong{display:block;font-size:25px;letter-spacing:-.7px}.brand span{display:block;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:#92a0b3}.home-link{margin-left:auto;width:44px;height:44px;border:1px solid #e9edf4;background:#fff;border-radius:50%;color:#315bea;text-align:center;text-decoration:none;font-size:29px}.welcome-card{position:relative;overflow:hidden;border-radius:30px;background:linear-gradient(135deg,#273f94 0%,#315bea 65%,#4974f0 100%);box-shadow:0 12px 24px #315bea2c;color:#fff;padding:24px 22px 20px}.welcome{position:relative;z-index:1}.welcome p{margin:0;color:#c9e2df;font-size:16px}.welcome h1{font-size:26px;margin:4px 0 8px;letter-spacing:-.7px}.welcome>span{font-size:14px;color:#d3e5e4;display:block;max-width:280px}.city-art{height:245px;position:relative;margin:10px -22px 0;overflow:hidden;background:radial-gradient(ellipse at 60% 76%,#55b1ab55,transparent 60%)}.moon{position:absolute;top:24px;right:50px;width:46px;height:46px;border-radius:50%;background:#f3dfa5;box-shadow:0 0 60px #e8cf7c60}.tower{position:absolute;bottom:34px;background:repeating-linear-gradient(0deg,transparent 0 14px,#8cb7b63b 15px 17px),repeating-linear-gradient(90deg,#123e52 0 12px,#d9b657a6 13px 16px,#17495b 17px 23px);border:1px solid #8cb7b66b;border-top:3px solid #d6bb74;box-shadow:12px 8px 0 #062f3b}.tower-a{left:20%;width:65px;height:125px;transform:skewY(-6deg)}.tower-b{left:42%;width:83px;height:194px;transform:skewY(-5deg)}.tower-c{left:67%;width:53px;height:97px;transform:skewY(5deg)}.city-ground{position:absolute;bottom:0;height:45px;width:100%;background:linear-gradient(#062f3b,#114555);border-top:1px solid #b3cdad55}.orbit{position:absolute;bottom:12px;width:120%;left:-10%;height:35px;border-top:2px solid #cfb66b88;border-radius:50%;transform:rotate(-7deg)}.login-actions{display:flex;gap:12px;position:relative;z-index:1}.gold-button{display:flex;justify-content:center;align-items:center;gap:20px;min-height:56px;border:1px solid #efd68c;background:linear-gradient(110deg,#f0d079,#b98a35);color:#183c43;border-radius:30px;font-weight:750;flex:1;box-shadow:0 5px 18px #0001}.gold-button span{font-size:25px}.biometric{width:56px;height:56px;flex:none;border-radius:50%;border:1px solid #9fbcac60;background:#0c454b;color:#eed289;padding:13px}.biometric svg{width:100%;height:100%}#passkey-login-message:not(:empty){margin-top:12px;font-size:14px;color:#ffedc7}.login-panel{margin-top:16px;background:#fff;border-radius:26px;padding:22px;box-shadow:0 10px 30px #183c4310}.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}h2{font-size:20px;margin:0}.close-button{width:36px;height:36px;border-radius:50%;border:0;background:#fff0ef;color:#bd3939;font-size:25px}#account>label{display:block;font-size:14px;font-weight:600;margin:12px 0 5px}#account>input,#account .login-password-field>input{width:100%;min-height:50px;border-radius:13px;border:1px solid #cbdcda;padding:10px 13px;font-size:16px;background:#f7faf9;color:#183c43}input:focus{outline:2px solid #398e8a;outline-offset:1px}.form-options{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0;font-size:13px}.remember{display:flex;align-items:center;gap:6px}.remember input{width:18px;height:18px;accent-color:#176b68}.submit-login{width:100%;margin-top:16px}.validation{font-size:14px;color:#b32630}.validation ul{padding-left:18px}.validation-summary-valid{display:none}.register-link{display:block;text-align:center;margin-top:17px;font-weight:600}.external-logins{display:flex;gap:10px;margin-top:16px}.external-logins button{flex:1;background:#edf6f4;border:1px solid #c5d9d5;border-radius:12px;padding:10px;color:#185a59}.qr-card{display:flex;align-items:center;gap:18px;background:#fff;border:1px solid #fff9;border-radius:27px;padding:18px;margin-top:20px;box-shadow:0 10px 28px #163e4010}.qr-frame{padding:10px;background:white;border-radius:17px;flex:none;border:2px solid #1b6261}#mobile-link-qr{width:116px;height:116px}#mobile-link-qr img,#mobile-link-qr canvas{width:116px;height:116px}.qr-info{min-width:0}.qr-info>span{font-size:13px;color:#4b6b6a}.qr-info h2{font-size:18px;margin:3px 0}.mobile-address{font-size:12px;overflow-wrap:anywhere}.qr-info button{display:block;margin-top:12px;border:0;border-radius:22px;background:#0f5957;color:white;font-size:14px;font-weight:600;padding:10px 18px}#share-status{font-size:12px;margin:6px 0 0;overflow-wrap:anywhere}#share-status:empty{display:none}footer{text-align:center;font-size:12px;letter-spacing:1px;color:#657e7b;padding:26px 0 6px}footer span{margin:0 8px}@media(max-width:360px){.login-shell{padding-left:12px;padding-right:12px}.qr-card{gap:12px;padding:12px}.qr-frame{padding:7px}#mobile-link-qr,#mobile-link-qr img,#mobile-link-qr canvas{width:100px;height:100px}.welcome-card{padding-left:18px;padding-right:18px}.city-art{height:210px}}@media(min-width:600px){.login-shell{margin:24px auto;border-radius:32px;min-height:0;box-shadow:0 0 70px rgba(29,49,88,.08)}}
/* Compact sign-in screen: no decorative image and no page overflow. */
html{height:100%}
body{height:100dvh;overflow:hidden;display:grid;place-items:center;padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
.login-shell{width:100%;max-width:460px;min-height:0;max-height:100%;margin:0 auto;padding:18px;border-radius:26px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.brand{padding:0 0 16px}.brand img{width:42px;height:42px}.brand strong{font-size:22px}.brand span{font-size:10px}
.city-art{display:none}.welcome-card{padding:20px;border-radius:22px}.welcome h1{font-size:23px;margin:4px 0 6px}.welcome p{font-size:14px}.welcome>span{max-width:none;font-size:13px}.login-actions{margin-top:20px}.gold-button{min-height:48px}.biometric{width:48px;height:48px;padding:11px}
.qr-card{margin-top:14px;padding:14px;gap:14px;border-radius:20px}.qr-frame{padding:8px;border-radius:13px}.qr-info h2{font-size:16px}.qr-info button{margin-top:8px;padding:8px 16px;min-height:40px}
footer{padding:16px 0 0;font-size:11px}
.login-panel{margin-top:0;padding:18px;border-radius:22px}.panel-heading{margin-bottom:10px}.form-options{flex-wrap:wrap;margin:12px 0}.register-link{margin-top:12px}
.login-form-open .welcome-card,.login-form-open .qr-card{display:none}
@media(max-height:600px){.login-shell{padding:12px}.brand{padding-bottom:12px}.welcome-card{padding:16px}.login-actions{margin-top:14px}.qr-card{padding:10px;margin-top:10px}#mobile-link-qr,#mobile-link-qr img,#mobile-link-qr canvas{width:100px;height:100px}footer{display:none}}

/* Let the native mobile keyboard manage focus and scrolling while signing in. */
body.login-form-open{height:auto;min-height:100dvh;overflow-y:auto;display:block}
.login-form-open .login-shell{max-height:none;overflow:visible;margin:0 auto}
#account input:not([type="hidden"]){touch-action:manipulation;user-select:text;-webkit-user-select:text}

/* Native document scrolling while the iOS keyboard is active. */
html:has(body.login-form-open){height:auto;min-height:100%}
body.login-form-open{height:auto;overflow:visible;min-height:100svh}
.login-form-open .login-shell{overflow:visible;overscroll-behavior:auto;max-height:none}

.login-help-links{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;margin-top:14px;font-size:14px}.login-help-links a{padding:6px 0}.external-login-section{border-top:1px solid #e5eaf2;margin-top:14px;padding-top:12px}.external-login-heading{text-align:center;font-size:13px;color:#64748b;margin:0}.external-login-section .external-logins{flex-wrap:wrap;margin-top:10px}.external-logins button{min-height:44px;min-width:100px}.external-login-empty{text-align:center;font-size:13px;color:#64748b;margin:8px 0 0}

.brand .login-brand-name{display:flex;align-items:center;gap:7px;min-width:0}.brand .login-brand-name strong{font-size:clamp(15px,4.4vw,20px);line-height:1.3;letter-spacing:-.35px}.login-phone-icon{flex:none;color:#315bea}

.workspace-login .qr-frame{border-color:#315bea}.workspace-login .qr-info>span,.workspace-login .qr-info h2,.workspace-login .qr-info .mobile-address,.workspace-login #share-status{color:#315bea}.workspace-login .qr-info button{background:#315bea;color:#fff}

/* Workspace sign-in uses the ATFSoft primary palette. */
.workspace-login .login-panel a{color:#315bea}.workspace-login .gold-button{background:#315bea;border-color:#315bea;color:#fff;box-shadow:0 5px 18px #315bea22}.workspace-login .gold-button:hover{background:#264bd1;border-color:#264bd1}.workspace-login .remember input{accent-color:#315bea}.workspace-login input:focus{outline-color:#315bea}.workspace-login #account>input,.workspace-login #account .login-password-field>input{color:#1d2b45;border-color:#d9e1f2;background:#f7f9ff}.workspace-login .external-logins button{color:#315bea;border-color:#d9e1f2;background:#eef2ff}.workspace-login .biometric{background:#eef2ff;border-color:#d9e1f2;color:#315bea}.workspace-login footer{color:#64748b}

/* Contrast the welcome action against its blue card. */
.workspace-login .welcome-card #open-login{background:#fff;color:#284dcc;border:1px solid #fff;box-shadow:0 6px 16px rgba(15,32,96,.22);font-weight:700}.workspace-login .welcome-card #open-login:hover{background:#eef2ff;border-color:#eef2ff;box-shadow:0 8px 20px rgba(15,32,96,.28)}.workspace-login .welcome-card #open-login:active{background:#e1e8ff;box-shadow:0 2px 6px rgba(15,32,96,.2)}.workspace-login .welcome-card #open-login:focus-visible{outline:2px solid #fff;outline-offset:4px}
