/* Sign-in window (2026-09-26): email first, then password / code / sign-up. Script: /js/auth.js. Old window: ?auth=old */
.apx-auth{position:fixed;inset:0;z-index:10050;display:flex;align-items:flex-start;justify-content:center;padding:9vh 16px 24px;overflow-y:auto;-webkit-overflow-scrolling:touch}
.apx-auth[hidden]{display:none}
.apx-auth-dim{position:fixed;inset:0;background:rgba(24,16,36,.55)}
.apx-auth-box{position:relative;width:414px;max-width:100%;background:#fff;color:#2d242e;border-top:3px solid #5976dd;box-shadow:8px 7px 0 rgba(0,0,0,.28);font:15px/1.55 "Open Sans","Segoe UI",Arial,sans-serif;text-align:left;animation:apxIn .16s ease-out}
@keyframes apxIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.apx-auth *{box-sizing:border-box}
.apx-auth-x{position:absolute;top:10px;right:10px;width:34px;height:34px;display:grid;place-items:center;border:0;background:transparent;color:#9b93a3;cursor:pointer;padding:0}
.apx-auth-x:hover{color:#2d242e}
.apx-auth-x svg{width:20px;height:20px}
.apx-auth-in{padding:26px 30px 28px}
.apx-auth h3{font:700 23px/1.2 "Proxima Nova","Helvetica Neue",Arial,sans-serif;margin:0 30px 6px 0;color:#2d242e;text-transform:none;letter-spacing:0}
.apx-auth .sub{color:#6f6672;font-size:14px;margin:0 0 20px}
.apx-auth .sub b{color:#2d242e;font-weight:600;overflow-wrap:anywhere}
.apx-auth a,.apx-auth .lnk{color:#4f6cd3;text-decoration:none;cursor:pointer;background:none;border:0;padding:0;font:inherit}
.apx-auth a:hover,.apx-auth .lnk:hover{text-decoration:underline}
.apx-auth form{margin:0}
.apx-auth .f{margin:0 0 16px}
.apx-auth .f>label{display:block;font:700 11px/1 "Proxima Nova","Helvetica Neue",Arial,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:#6f6672;margin:0 0 7px}
.apx-auth .in{display:flex;align-items:center;border:1px solid #d6d2de;background:#fff;height:46px;padding:0 14px;gap:10px}
.apx-auth .in:focus-within{border-color:#5976dd;box-shadow:0 0 0 3px rgba(89,118,221,.16)}
.apx-auth .in input{flex:1;border:0;outline:0;font:16px/1 "Open Sans","Segoe UI",Arial,sans-serif;color:#2d242e;background:transparent;min-width:0;height:44px;padding:0;margin:0;box-shadow:none}
.apx-auth .reveal{font:600 12px/1 "Proxima Nova","Helvetica Neue",Arial,sans-serif;color:#4f6cd3;cursor:pointer;white-space:nowrap;letter-spacing:.02em;background:none;border:0;padding:6px 0}
.apx-auth .hint{font-size:12.5px;line-height:1.45;color:#6f6672;margin:7px 0 0}
.apx-auth .err{display:none;font-size:12.5px;line-height:1.45;color:#c0392f;margin:7px 0 0}
.apx-auth .err.on{display:block}
.apx-auth .f.bad .in{border-color:#c0392f}
.apx-auth .btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:48px;background:#5976dd;border:0;border-bottom:4px solid #3f58bd;color:#fff;font:700 15px/1 "Proxima Nova","Helvetica Neue",Arial,sans-serif;letter-spacing:.02em;cursor:pointer;margin:0;padding:0 16px;text-transform:none}
.apx-auth .btn:hover{background:#4f6cd3}
.apx-auth .btn[disabled]{opacity:.7;cursor:progress}
.apx-auth .btn.ghost{background:#fff;color:#2d242e;border:1px solid #d6d2de;height:46px;font-weight:600}
.apx-auth .btn.ghost:hover{border-color:#b9b2c6;background:#fbfaff}
.apx-auth .btn .spin{width:16px;height:16px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:apxSpin .7s linear infinite;display:none}
.apx-auth .btn[disabled] .spin{display:block}
@keyframes apxSpin{to{transform:rotate(360deg)}}
.apx-auth .links{display:flex;justify-content:space-between;gap:12px;margin-top:14px;font-size:13.5px;flex-wrap:wrap}
.apx-auth .legal{margin:16px 0 0;font-size:12px;line-height:1.5;color:#8b8394}
.apx-auth .gen{display:none;background:#fbe6e4;color:#a4302a;font-size:13px;line-height:1.45;padding:9px 12px;margin:0 0 14px}
.apx-auth .gen.on{display:block}
.apx-auth .or{display:flex;align-items:center;gap:12px;margin:22px 0 14px;color:#9b93a3;font:700 10.5px/1 "Proxima Nova","Helvetica Neue",Arial,sans-serif;letter-spacing:.11em;text-transform:uppercase}
.apx-auth .or::before,.apx-auth .or::after{content:"";flex:1;height:1px;background:#e3e0e7}
/* social buttons come from _smSign.twig with inline styles */
.apx-auth .apx-soc .auth-socials{margin:0;padding:0;border:0}
.apx-auth .apx-soc .auth-socials-label{display:none}
.apx-auth .apx-soc .auth-socials>div[style]{max-width:none!important;gap:9px!important}
.apx-auth .apx-soc .auth-socials a{height:46px!important}
.apx-auth .apx-soc .auth-socials a:hover{border-color:#b9b2c6!important;background:#fbfaff!important;text-decoration:none}
.apx-auth .apx-soc .auth-socials-error{margin:0 0 12px!important}
/* code: six boxes over one real input (paste, autofill of one-time-code) */
.apx-auth .code{position:relative;display:flex;gap:8px;margin:2px 0 8px}
.apx-auth .code span{flex:1;height:54px;border:1px solid #d6d2de;display:flex;align-items:center;justify-content:center;font:700 22px/1 "Proxima Nova","Helvetica Neue",Arial,sans-serif;color:#2d242e;font-variant-numeric:tabular-nums;background:#fff}
.apx-auth .code span.fill{border-color:#5976dd}
.apx-auth .code.focus span.cur{border-color:#5976dd;box-shadow:0 0 0 3px rgba(89,118,221,.16)}
.apx-auth .code.bad span{border-color:#c0392f}
.apx-auth .code input{position:absolute;inset:0;width:100%;height:100%;opacity:0;border:0;font-size:16px;color:transparent;background:transparent;caret-color:transparent;cursor:text}
.apx-auth .again{font-size:13px;color:#6f6672;margin:0 0 16px;min-height:19px}
.apx-auth .done{text-align:center;padding:10px 0 6px}
.apx-auth .done h3{margin-right:0}
.apx-auth .ring{width:72px;height:72px;margin:0 auto 16px;border:3px solid #2f9e5f;display:flex;align-items:center;justify-content:center}
.apx-auth .ring.warn{border-color:#c8761c}
.apx-auth .ring svg{width:34px;height:34px;stroke:#2f9e5f;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.apx-auth .ring.warn svg{stroke:#c8761c}
.apx-auth .msg{color:#4f4956;font-size:14px;margin:0 0 20px}
html.apx-auth-lock,html.apx-auth-lock body{overflow:hidden}
/* phone: a sheet from the bottom */
@media (max-width:560px){
  .apx-auth{align-items:flex-end;padding:0}
  .apx-auth-box{width:100%;max-height:92vh;overflow-y:auto;box-shadow:none;animation:apxUp .2s ease-out}
  .apx-auth-in{padding:22px 18px 22px}
  .apx-auth h3{font-size:20px}
  .apx-auth .in,.apx-auth .btn{height:48px}
  @keyframes apxUp{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
}