/* Shared takeover sign-in on web, iOS and Mac. */
@font-face{font-family:Mono;font-display:swap;src:url('/fonts/martian-mono-latin.woff2') format('woff2')}
@font-face{font-family:'Martian Mono';font-display:swap;src:url('/fonts/martian-mono-latin.woff2') format('woff2')}
/* Always dark: the app's theme tokens are redefined from the brand guidelines' ink
   theme (ink ground, paper type, dim, card, part and line), so the email form,
   recovery and enrolment screens read correctly even when the app is in Light. */
.login.takeover-signin{--signin-ground:#14110C;--signin-fg:#F5ECD7;--signin-muted:#F5ECD78C;--signin-card:#24221E;--signin-part:#3A352B;--signin-lime:#D7FF2E;--bg:var(--signin-ground);--ink:var(--signin-fg);--muted:var(--signin-muted);--line:#F5ECD72E;--tint:var(--signin-card);--surface-field:var(--signin-card);--surface-hover:var(--signin-part);--focus-border:var(--signin-fg);position:fixed;inset:var(--visible-top,0px) 0 auto;height:var(--visible-height,100dvh);min-height:0;display:flex;align-items:center;justify-content:center;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);background:var(--signin-ground);color:var(--signin-fg);color-scheme:dark;font-family:Suisse,Inter,system-ui,sans-serif;overflow:hidden}
.takeover-signin .signin-layout{position:relative;width:100%;height:100%;margin:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);isolation:isolate}
.takeover-signin .signin-art{position:absolute;inset:0 auto auto 0;width:100%;height:100%;overflow:hidden;pointer-events:none;transition:width .25s cubic-bezier(.2,.7,.2,1),height .25s cubic-bezier(.2,.7,.2,1)}
.takeover-signin[data-step=auth] .signin-art{width:50%;height:100%}
.takeover-signin .signin-stage{position:absolute;left:0;top:0;transform-origin:0 0}
.takeover-signin .signin-stage canvas{position:absolute;inset:0;width:100%;height:100%}
.takeover-signin .login-brand,.takeover-signin footer{display:none}
.takeover-signin .signin-ui{position:relative;grid-column:2;justify-self:stretch;align-self:stretch;width:auto;min-height:0;margin:0;padding:48px clamp(24px,3.5vw,64px);display:flex;flex-direction:column;justify-content:safe center;align-items:center;overflow:auto;z-index:2;visibility:hidden}
.takeover-signin[data-step=auth] .signin-ui{visibility:visible}
.takeover-signin .login-card{position:relative;flex:none;align-self:auto;width:100%;max-width:320px;margin:0;padding:0;text-align:left;min-height:0;max-height:none;overflow:visible;animation:signin-content-in .25s}
.takeover-signin .signin-mark{flex:none;align-self:auto;display:flex;align-items:center;width:100%;max-width:320px;margin:0 0 32px;padding:0;opacity:0;visibility:hidden;transition:opacity .25s,visibility 0s .25s}
.takeover-signin[data-step=auth] .signin-mark{opacity:1;visibility:visible;transition:opacity .25s}
.takeover-signin .signin-mark img{height:24px;width:auto;filter:brightness(0) invert(1)}
.takeover-signin.login h1{font-size:clamp(36px,3.2vw,48px);line-height:.98;letter-spacing:-.035em;font-weight:600;color:var(--signin-fg);margin:0}
.takeover-signin.login h1 span{color:var(--signin-muted)}
.takeover-signin .login-card>p:not(#login-note){color:var(--signin-muted);margin:14px 0 0;max-width:none}
.takeover-signin.login .auth-buttons{width:100%;margin:0;gap:10px}
.takeover-signin.login .auth-buttons button{justify-content:center;gap:10px;background:var(--signin-fg);color:var(--signin-ground);border-color:var(--signin-fg);border-radius:2px;font-family:Suisse,Inter,sans-serif;font-weight:600}
.takeover-signin.login .auth-buttons button:hover{background:#D8CEB6;border-color:#D8CEB6}
.takeover-signin.login #login-note{color:var(--signin-muted);margin:16px 0 0;max-width:none}
.takeover-signin .login-card>p.login-legal:not(#login-note){color:var(--signin-muted);margin:20px 0 0;max-width:none;font-size:12px;line-height:1.5}
.takeover-signin .login-legal a{color:var(--signin-muted);text-decoration-color:var(--line)}
.takeover-signin .login-legal a:hover{color:var(--signin-fg)}
.takeover-signin .login-card input{background:var(--signin-card);color:var(--signin-fg);border:1px solid var(--signin-part);border-radius:2px}
.takeover-signin .login-card form button{border-radius:2px}
.takeover-signin :is(button,input,a):focus-visible{outline:2px solid var(--signin-fg);outline-offset:3px}
/* Original centered line and adjacent Enter button, fading in without movement. */
.takeover-signin .signin-intro{position:absolute;left:24px;right:24px;bottom:40px;z-index:2;display:flex;justify-content:center;align-items:center;gap:3vw;min-width:0;padding:0;visibility:hidden}
.takeover-signin .signin-intro h1,.takeover-signin .signin-enter{opacity:0;transition:opacity .7s}
.takeover-signin.intro-ready .signin-intro{visibility:visible}
.takeover-signin.intro-ready .signin-intro h1,.takeover-signin.enter-ready .signin-enter{opacity:1}
.takeover-signin.login .signin-intro h1{font-size:clamp(25.5px,2.4vw,45px);line-height:1.12;letter-spacing:-.03em;font-weight:600;color:var(--signin-fg);margin:0}
/* Lime action, with the same tight corners as the other controls. */
.takeover-signin .signin-enter{flex:none;display:inline-flex;align-items:center;height:46px;margin:0;padding:0 24px;border:0;border-radius:2px;background:var(--signin-lime);color:var(--signin-ground);font:600 16px/1 Suisse,system-ui,sans-serif;cursor:pointer;transition:opacity .7s,transform .3s cubic-bezier(.16,1,.3,1)}
.takeover-signin .signin-enter:hover{transform:scale(1.04)}
.takeover-signin .signin-auth-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.takeover-signin .login-card[hidden],.takeover-signin .signin-intro[hidden]{display:none}
@keyframes signin-content-in{from{opacity:0}to{opacity:1}}
@media(max-width:820px), (pointer:coarse) and (max-height:600px){
 .takeover-signin .signin-layout,.takeover-signin[data-art] .signin-layout{width:100%;height:100%;margin:0;grid-template-columns:1fr}
 .takeover-signin .signin-art{width:100%;height:100%}
 .takeover-signin[data-step=auth] .signin-art{width:100%;height:100%}
 .takeover-signin .signin-layout::before{content:"";position:absolute;inset:0;background:#14110CD9;opacity:0;pointer-events:none;z-index:1;transition:opacity .25s}
 .takeover-signin[data-step=auth] .signin-layout::before{opacity:1}
 .takeover-signin .signin-ui{grid-column:1;width:100%;margin:0;padding:56px 28px 32px}
 .takeover-signin .signin-intro{bottom:28px;left:24px;right:24px;flex-direction:column;gap:20px;text-align:center;z-index:2}
 .takeover-signin.login .signin-intro h1{font-size:clamp(25.5px,4.5vw,36px);max-width:560px}
}
@media(max-height:500px) and (pointer:coarse){
 .takeover-signin .signin-art{height:100%}
 .takeover-signin .signin-intro{bottom:28px;flex-direction:row;text-align:left}
}
@media(prefers-reduced-motion:reduce){
 .takeover-signin .signin-art,.takeover-signin .signin-mark,.takeover-signin[data-step=auth] .signin-mark,.takeover-signin .signin-layout::before,.takeover-signin .signin-intro h1,.takeover-signin .signin-enter{transition:none}
 .takeover-signin .signin-enter:hover{transform:none}
 .takeover-signin .login-card{animation:none}
}