/* Sign Up, Log In and Reset Password. A port of 07/08/09 .dc.html: their inline styles as classes, their <helmet> media rules as written.
   Breakpoints: phone <= 640px. Tokens, .wrap, the glass surface (.glass, frost on its own layer) and the slim footer live in site.css. */

.au-page{display:flex;flex-direction:column;min-height:calc(100vh / var(--zoom))}

/* Logo-only header */
.au-hdr{position:relative;z-index:5;background:transparent}
.au-hdr .wrap{position:relative;z-index:2}
.au-hdr-row{display:flex;align-items:center;gap:28px;flex-wrap:wrap;min-height:76px;padding-block:18px}
.au-logo{display:flex;align-items:center;flex:0 0 auto}
.au-logo img{display:block;width:30px;height:30px}

.au-main{flex:1;display:flex;flex-direction:column}
.au-sec{flex:1;position:relative;overflow:hidden;border-top:1px solid #e3ecf4;padding-block:clamp(56px,8vw,112px)}
.au-globe{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;-webkit-mask-image:radial-gradient(ellipse 75% 90% at 50% 70%,#000 40%,rgba(0,0,0,.6) 70%,transparent 100%);mask-image:radial-gradient(ellipse 75% 90% at 50% 70%,#000 40%,rgba(0,0,0,.6) 70%,transparent 100%)}
.au-wrap{position:relative;z-index:1;width:min(100% - 32px,480px);margin-inline:auto}
.au-card{width:100%;max-width:480px}

.au-pad{display:flex;flex-direction:column;gap:24px;padding:clamp(28px,5vw,48px)}
.au-pad[hidden]{display:none}
.au-sent{gap:20px}
.au-h1{margin:0;font:500 var(--text-xl)/1.25 var(--font);letter-spacing:-.015em;color:#0b2239}
.au-h1:focus{outline:none}
.au-h1-login{font-size:var(--text-lg);line-height:1.3;letter-spacing:-.01em}
.au-intro{display:flex;flex-direction:column;gap:12px}
.au-lede{margin:0;font:440 var(--text-base)/1.55 var(--font);color:#4d5f75;text-wrap:pretty}
.au-lede strong{font-weight:600;color:#0b2239;overflow-wrap:anywhere}

/* Form */
.au-form{position:relative;display:flex;flex-direction:column;gap:20px}
.au-field{display:flex;flex-direction:column;gap:8px}
.au-label{font:500 var(--text-sm)/1.4 var(--font);color:#0b2239}
.au-label-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.au-forgot{font:500 var(--text-sm)/1.4 var(--font);color:#0872b0}
.au-input{width:100%;height:44px;margin:0;padding:0 14px;border:1px solid #dde6ef;border-radius:6px;background:#fff;font:440 var(--text-base)/1 var(--font);color:#0b2239;outline:none}
.au-input:focus{border-color:#0872b0;box-shadow:0 0 0 3px #e1eef8}
.au-pw{position:relative}
.au-pw .au-input{padding-right:68px}
.au-pw-toggle{position:absolute;top:6px;right:6px;height:32px;padding:0 10px;border:0;border-radius:4px;background:transparent;font:500 var(--text-sm)/1 var(--font);color:#647489;cursor:pointer}
.au-pw-toggle:hover{background:#f5f9fd;color:#0b2239}
.au-hint{font:440 var(--text-sm)/1.4 var(--font);color:#647489}
/* Sign Up: the required Terms and Data Licence Agreement box */
.au-check{display:flex;align-items:flex-start;gap:10px}
.au-check input{flex:none;width:18px;height:18px;margin:1px 0 0;accent-color:#0872b0;cursor:pointer}
.au-form .au-check input[aria-invalid="true"]{outline:2px solid #a3263b;outline-offset:2px}
.au-check label{font:440 var(--text-sm)/1.45 var(--font);color:#4d5f75;cursor:pointer}
.au-check a{font-weight:500}
.au-check-text{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.au-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* Messages. Each stays in the page (so screen readers announce it) and takes no room while empty:
   an empty one is lifted out of the flex column, so it adds no gap. */
.au-alert,.au-ok{padding:12px 14px;border-radius:6px;font:500 var(--text-sm)/1.45 var(--font)}
.au-alert{border:1px solid #f3cdd4;background:#fdf5f6;color:#a3263b}
.au-ok{border:1px solid #c6e6d4;background:#f3faf6;color:#1a7f4b}
.au-alert-login{display:flex;flex-direction:column;gap:4px}
.au-alert-hint{font:440 var(--text-sm)/1.45 var(--font);color:#4d5f75}
.au-note{font:500 var(--text-sm)/1.4 var(--font)}
.au-note.is-ok{color:#1a7f4b}
.au-note.is-err{color:#a3263b}
.au-alert:empty,.au-ok:empty,.au-note:empty{position:absolute;width:1px;height:1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* Turnstile. Sign Up keeps the prototype's empty slot before the button; on Log In, Reset and Resend
   the slot adds no net space until Cloudflare shows a challenge in it. */
.au-ts-tuck{margin-block:-10px}
.au-resend .au-ts-tuck{margin-block:-4px}

.au-submit{display:flex;align-items:center;justify-content:center;height:44px;border:0;border-radius:6px;background:var(--grad);color:#fff;font:550 var(--text-base)/1 var(--font);cursor:pointer;transition:opacity .15s}
.au-submit:hover{background:var(--grad-hover);color:#fff}
.au-submit:disabled,.au-submit[aria-disabled="true"]{opacity:.45;cursor:default}
.au-consent{margin:-8px 0 0;text-align:center;font:440 var(--text-sm)/1.5 var(--font);color:#647489;text-wrap:balance}

.au-or{display:flex;align-items:center;gap:14px;font:440 var(--text-sm)/1 var(--font);color:#647489}
.au-or::before,.au-or::after{content:'';flex:1;height:1px;background:#e3ecf4}
.au-oauth{display:flex;flex-direction:column;gap:10px}
.au-oauth-btn{display:flex;align-items:center;justify-content:center;gap:10px;height:44px;border:1px solid #dde6ef;border-radius:6px;background:#fff;font:500 var(--text-base)/1 var(--font);color:#0b2239;cursor:pointer}
.au-oauth-btn:hover{border-color:#b7d9f0;background:#fafcfe}
.au-oauth-btn svg{flex:none}

.au-foot{margin:0;text-align:center;font:440 var(--text-base)/1.5 var(--font);color:#4d5f75}
.au-foot a,.au-band a,.au-aside a{font-weight:500}
.au-band{padding:20px 24px;border-top:1px solid #e3ecf4;background:#f5f9fd;text-align:center;font:440 var(--text-base)/1.5 var(--font);color:#4d5f75}

/* Sign Up: "Confirm your email" */
.au-text{margin:0;font:440 var(--text-base)/1.6 var(--font);color:#4d5f75}
.au-text strong{font-weight:600;color:#0b2239}
.au-resend{position:relative;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.au-resend[hidden]{display:none}
.au-resend-btn{display:inline-flex;align-items:center;height:40px;padding:0 18px;border:1px solid #b7d9f0;border-radius:6px;background:#fff;color:#0872b0;font:550 var(--text-sm)/1 var(--font);cursor:pointer}
.au-resend-btn:hover{background:#f5f9fd}
.au-resend-btn[aria-disabled="true"]{opacity:.5}
.au-small{margin:0;font:440 var(--text-sm)/1.5 var(--font);color:#4d5f75}
.au-aside{margin:0;padding-top:20px;border-top:1px solid #e3ecf4;font:440 var(--text-sm)/1.6 var(--font);color:#647489}

/* Keyboard focus */
.au-logo:focus-visible,.au-card a:focus-visible,.au-card button:focus-visible,.au-check input:focus-visible{outline:2px solid #0872b0;outline-offset:2px}

@media (max-width:640px){
.au-hdr .wrap{padding-inline:17px}
.au-sec{padding-block:24px 48px}
.au-pad{padding:24px 20px;gap:20px}
.au-h1{font-size:var(--text-lg)}
/* 16px or iOS zooms the page on focus */
.au-sec input{font-size:var(--text-base)}
}