/* Sign-in pages in the new look (Ahmed 4 Nov: "singin/singup page need to match new design and use always our new logo
   symbol"): the home page's sky behind, the symbol beside the name, a white card so every field reads clearly. Loaded last
   in <head> by signup, join, auth-action and the two verify pages, so it wins over each page's own styles. */
@font-face{font-family:'Figtree';font-style:normal;font-weight:500 800;font-display:swap;src:url(/vendor/fonts/google/figtree/v9/figtree-latin.woff2) format('woff2')}
body{background:linear-gradient(180deg,#121A58 0,#1B2B7B 260px,rgba(44,42,132,.94) 520px,rgba(72,48,146,.72) 820px,#0A0A16 1180px),image-set(url(/assets/home/sky/cumulus-1x.webp) 1x,url(/assets/home/sky/cumulus-2x.webp) 2x) center top/max(1440px,100%) auto no-repeat,#0A0A16}
.auth-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.auth-brand img{display:block;height:30px;width:auto;flex:none}
.signup__card,.join__card,.wrap .card,.verify-card{background:#fff;border:0;border-radius:24px;box-shadow:0 30px 80px rgba(8,10,40,.45),0 2px 0 rgba(255,255,255,.4) inset}
.signup__title,.join__title,.wrap .title,.verify-card h1{font-family:'Figtree','Helvetica Neue',Arial,sans-serif;font-weight:700;letter-spacing:-.02em}
.signup__title{font-size:1.6rem;margin-bottom:6px}
.signup__trust,.signup__footer-note,.signup > p,.join__footer{color:rgba(255,255,255,.72)}
.verify-wrap{flex-direction:column}.verify-logo{margin-bottom:28px}

/* the sign-in block fills the first screen down to the "encrypted" line, the footer starts below it (Ahmed 4 Nov: "make it
   fite the whole screen until crypted part so more space"): compact on laptop and phone heights, roomier on tall screens */
.signup,.join{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;margin:0 auto;padding:14px 20px}
.signup__logo,.join__logo{margin-bottom:18px}
.signup__card{padding:28px 30px 24px}
.signup__subtitle{margin-bottom:18px}
.signup__divider{margin:12px 0}#escapeHatchLink{margin-top:8px!important}
.signup__email-form{gap:10px}.signup__input{padding:12px 16px}
.signup__features{gap:8px}
.signup__footer{margin-top:14px}
@media (min-height:880px){.signup__logo,.join__logo{margin-bottom:40px}.signup__card{padding:40px 36px 34px}.signup__subtitle{margin-bottom:28px}
  .signup__divider{margin:20px 0}.signup__email-form{gap:12px}.signup__features{gap:11px}.signup__footer{margin-top:28px}}
@media (max-width:400px){.signup__card{padding-left:22px;padding-right:22px}.signup__google-btn{white-space:nowrap}}
/* "I agree to the Terms & Conditions and Privacy Policy." on one line (Ahmed 4 Nov: "make i agree to etc as 1 line") */
@media (min-width:401px){.signup{max-width:452px}#consentCheck ~ span{white-space:nowrap;font-size:.78rem}}
/* short phone screens: the form comes first, the four benefits step aside so nothing needs a scroll */
@media (max-height:700px) and (max-width:600px){.signup__features,.signup__card > .signup__divider:nth-last-of-type(1){display:none}
  .signup{padding:8px 16px}.signup__logo{margin-bottom:10px}.signup__card{padding:20px 22px 18px}.signup__subtitle{margin-bottom:12px}
  .signup__divider{margin:8px 0}.signup__footer{margin-top:10px}}
/* shown at once unless the page is finishing a Google sign-in (signup.html adds ps-show before the first paint) */
html.ps-show body{opacity:1}
/* readable on white (Lighthouse color-contrast, 4 Nov): subtitle, notes and the OR / WHAT YOU GET dividers */
.signup__subtitle,#toggleMsg,#escapeHatchLink,.signup__divider,.signup__divider span{color:#6e6e73}