.login.auth-screen{width:min(100%,408px);max-width:408px;margin:0 auto;padding:24px;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;justify-content:center;color:#171717}
.auth-screen .auth-wordmark{display:block;width:fit-content;margin:0 auto 36px;color:#171717;text-decoration:none;font-size:26px;font-weight:600;letter-spacing:-1px}
.auth-screen h1{font-family:inherit;font-size:30px;line-height:1.2;font-weight:500;letter-spacing:-1px;text-align:center;margin:0 0 10px}
.auth-screen .auth-description{text-align:center;color:#6b6b6b;font-size:14px;line-height:1.5;margin:0 0 28px}
.auth-screen button,.auth-screen input{border-radius:0;min-height:44px;font:inherit}
.auth-screen input{display:block;width:100%;border:1px solid #bdbdbd;background:white;padding:10px 12px;color:#171717}
.auth-screen label{display:block;font-size:14px;margin:0 0 8px}
.auth-screen #passwordField{margin-top:18px}.auth-screen #passwordHint{display:block;margin-top:7px;font-size:12px;color:#6b6b6b}
.auth-screen #googleLogin{width:100%;margin:0;background:white;border:1px solid #bdbdbd;color:#171717}.auth-screen #googleLogin:hover{background:#f5f5f5}
.auth-screen form{margin:0}.auth-screen #emailLogin{display:block;width:100%;margin:22px 0 0;background:#171717;border:1px solid #171717;color:white}.auth-screen #emailLogin:hover{background:#353535}
.auth-screen .auth-text-button{width:auto;min-height:0;margin:0;padding:0;border:0;background:transparent;color:#171717;font-size:14px;text-decoration:underline;text-underline-offset:3px}.auth-screen .auth-text-button:hover{background:transparent;text-decoration-thickness:2px}
.auth-screen #resetPassword{display:block;margin:12px 0 0 auto;font-size:13px}.auth-screen .auth-switch{text-align:center;font-size:14px;line-height:1.6;margin:24px 0 0;color:#6b6b6b}.auth-screen .auth-switch:has(>span[hidden]+button[hidden]){display:none}
.auth-screen #loginError,.auth-screen #loginStatus{font-size:14px;line-height:1.5;overflow-wrap:anywhere;margin:18px 0 0}.auth-screen #loginError{color:#984c32}.auth-screen #loginStatus{color:#444}.auth-screen #loginError:empty,.auth-screen #loginStatus:empty{display:none}
.auth-screen .auth-invitation{display:block;text-align:center;font-size:12px;line-height:1.6;color:#737373;margin-top:28px}.auth-screen [hidden]{display:none!important}.auth-screen button:disabled{opacity:.45;cursor:default}.auth-screen :is(button,input,a):focus-visible{outline:2px solid #171717;outline-offset:3px}

.auth-screen #passwordLogin{display:block;width:100%;margin:12px 0 0;background:white;border:1px solid #bdbdbd;color:#171717}.auth-screen #passwordLogin:hover{background:#f5f5f5}.auth-screen #backToMethods{display:block;margin:0 0 24px}

.auth-screen[data-mode="signin"] h1{margin-bottom:28px}

.auth-screen[data-progress="true"] > :not(#authTitle):not(#loginStatus):not(#loginError){display:none!important}
.auth-screen[data-progress="true"] #loginStatus{text-align:center}
.auth-screen[data-progress="true"] #loginStatus::before{content:"";display:block;width:20px;height:20px;margin:0 auto 18px;border:2px solid #ddd;border-top-color:#171717;border-radius:50%;animation:auth-spin .8s linear infinite}
@keyframes auth-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.auth-screen[data-progress="true"] #loginStatus::before{animation:none}}

.auth-screen .auth-wordmark { position:absolute;top:28px;left:36px;margin:0;font-size:24px; }
.auth-screen #backToMethods { margin:8px 0 24px; }
.auth-screen[data-mode="signin"]:has(#backToMethods:not([hidden])) h1 { margin-bottom:8px; }
@media(max-width:600px) { .auth-screen .auth-wordmark {top:24px;left:24px;} }
@media(max-height:600px) { .login.auth-screen {justify-content:flex-start;padding-top:100px;padding-bottom:32px;} }
