:root{--bg:#FCFBFB;--fg-1:#0F0F0F;--fg-2:#555252;--fg-3:#787272;--dark:#3A3A3A;--line:#DED8D8;--field-line:#DED8D8;--panel:#F0E9E9;--card:#fff;--on-ink:#fff;--error:#9B2C2C;--font:"Helvetica Neue",Helvetica,Arial,sans-serif;color-scheme:light dark}
:root[data-theme=light]{color-scheme:light}
:root[data-theme=dark]{color-scheme:dark}
@media screen and (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0F0F0F;--fg-1:#fff;--fg-2:rgba(255,255,255,.74);--fg-3:rgba(255,255,255,.55);--dark:rgba(255,255,255,.74);--line:rgba(255,255,255,.18);--field-line:#787272;--panel:#1D1D1D;--card:#1D1D1D;--on-ink:#0F0F0F;--error:#E9868F}}
@media screen{:root[data-theme=dark]{--bg:#0F0F0F;--fg-1:#fff;--fg-2:rgba(255,255,255,.74);--fg-3:rgba(255,255,255,.55);--dark:rgba(255,255,255,.74);--line:rgba(255,255,255,.18);--field-line:#787272;--panel:#1D1D1D;--card:#1D1D1D;--on-ink:#0F0F0F;--error:#E9868F}}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{background:var(--bg);color:var(--fg-1);font:16px/24px var(--font);-webkit-font-smoothing:antialiased}
main{max-width:420px;margin:15vh auto;padding:0 24px}
main.centre{max-width:none;margin:0;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 20px}
.card{width:100%;max-width:420px;background:var(--card);border:1px solid var(--line);padding:40px 40px 32px}
.brand{display:flex;justify-content:center;margin:0 0 28px;padding:0 0 24px;border-bottom:1px solid var(--line);color:var(--fg-1)}
.lockup{display:inline-flex;align-items:center;gap:16px}
.lockup svg{display:block;height:18px;width:auto;fill:currentColor}
.lockup .rule{display:block;width:1px;height:22px;background:var(--line)}
.client-logo{display:block;height:16px;aspect-ratio:210/22;background:currentColor;-webkit-mask:url(/_auth/client-logo.svg) no-repeat center/contain;mask:url(/_auth/client-logo.svg) no-repeat center/contain}
.eyebrow{font-size:12px;line-height:16px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3);margin:0 0 16px}
.card .eyebrow{font-size:11px;margin:0 0 24px;text-align:center}
h1{font-size:32px;line-height:40px;font-weight:400;letter-spacing:-.01em;margin:0 0 24px}
.card h1{font-size:26px;line-height:1.2;font-weight:500;margin:0 0 8px;text-align:center}
.sub{margin:0 0 28px;color:var(--dark);font-size:15px;line-height:1.55}
.warn{background:var(--panel);padding:12px 16px;color:var(--fg-2);font-size:14px;line-height:20px;margin:0 0 24px}
label{display:block;font-size:12px;line-height:16px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-3);margin:0 0 8px}
.card label{font-size:10px;letter-spacing:.14em;font-weight:500;color:var(--dark)}
input[type=email],input[type=text]{width:100%;font:inherit;padding:10px 12px;border:1px solid var(--field-line);background:var(--card);color:var(--fg-1);border-radius:0}
.card input{height:48px;padding:0 14px;font-size:16px}
.card input.code{font-size:24px;letter-spacing:.3em;font-variant-numeric:tabular-nums;text-align:center}
input:focus{outline:2px solid var(--fg-1);outline-offset:1px}
button{margin-top:16px;font:inherit;padding:10px 20px;border:1px solid var(--fg-1);background:var(--fg-1);color:var(--on-ink);border-radius:0;cursor:pointer}
.card button{width:100%;height:48px;margin-top:14px;padding:0;font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
button:hover{background:var(--fg-2);border-color:var(--fg-2)}
button:focus-visible{outline:2px solid var(--fg-1);outline-offset:2px}
button[disabled]{opacity:.45;cursor:default;background:var(--fg-1)}
.note{margin:0 0 20px;font-size:14px;line-height:1.55;color:var(--dark)}
.msg{margin:14px 0 0;font-size:14px;line-height:1.5;color:var(--error)}
.msg:empty{display:none}
.links{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:18px}
.card .links button{width:auto;height:auto;margin:0;padding:0;border:0;background:none;color:var(--dark);font-size:13px;font-weight:400;letter-spacing:0;text-transform:none;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line)}
.card .links button:hover{color:var(--fg-1);text-decoration-color:var(--fg-1)}
.foot{max-width:420px;margin:20px 0 0;font-size:12px;line-height:1.6;color:var(--fg-3);text-align:center}
.foot a{color:inherit}
[hidden]{display:none!important}
@media (max-width:480px){.card{padding:32px 24px 26px}.card h1{font-size:23px}.lockup{gap:12px}}