@font-face{font-family:"Hanken Grotesk";src:url("/identity-assets/hanken-grotesk.woff2") format("woff2");font-style:normal;font-weight:100 900;font-display:swap}
:root{color-scheme:dark;font-family:"Hanken Grotesk",sans-serif;font-synthesis:none;--canvas:#0b0c0f;--surface:#16171b;--field:#1c1d23;--text:#f4f5f6;--muted:#a4a5b0;--line:#34353e;--accent:#956afd;--accent-hover:#a782ff;--on-accent:#101114;--error:#ffaeae;--radius:999px;background:var(--canvas);color:var(--text)}
*{box-sizing:border-box}
body{margin:0;min-width:280px;background:var(--canvas);color:var(--text)}
.shell{min-height:100svh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:40px 24px}
.auth-frame{width:min(100%,540px);padding:56px 32px 32px;background:var(--surface);border:1px solid var(--line);border-radius:20px;text-align:center}
.brand-lockup{display:block;width:min(100%,300px);margin:0 auto 48px;line-height:0;border-radius:8px}
.brand-lockup img{display:block;width:100%;height:auto}
.panel{width:100%;margin:0 auto}
h1{font-size:28px;line-height:1.2;font-weight:650;letter-spacing:-.5px;margin:0 0 16px;text-wrap:balance}
h2{font-size:18px;line-height:1.3;font-weight:600;margin:28px 0 12px;text-align:left}
p{font-size:16px;line-height:1.5;margin:0 0 24px;overflow-wrap:anywhere;text-wrap:pretty}
.muted,.help,.footer{color:var(--muted)}
.help{font-size:14px;line-height:1.5;margin:16px 0 0}
.availability{font-size:13px;margin-top:8px}
.preview-note{font-size:14px;margin:0 0 24px}
.preview-note a{color:inherit}
button,.continue{font:inherit;font-size:16px;font-weight:600;line-height:1.3;min-height:58px;width:100%;padding:16px 22px;border:1px solid transparent;border-radius:var(--radius);cursor:pointer;color:var(--text)}
button.primary,.continue{background:var(--accent);color:var(--on-accent)}
button.primary:hover:not(:disabled){background:var(--accent-hover)}
button.secondary{background:transparent;border-color:var(--line)}
button.secondary:hover:not(:disabled){background:#22232b;border-color:#666775}
button:disabled{cursor:not-allowed;opacity:.45}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--accent-hover);outline-offset:4px}
button.text{width:auto;min-height:44px;padding:10px 14px;background:transparent;font-weight:500}
button.text:hover:not(:disabled){text-decoration:underline;text-underline-offset:4px}
.social-options{display:grid;gap:14px}
.provider-button{position:relative;display:flex;align-items:center;justify-content:center;gap:12px}
.provider-icon{position:absolute;left:22px;width:22px;height:22px}
.provider-apple .provider-icon{width:20px;height:22px}
.method-links{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:20px}
.method-links>span{color:var(--muted)}
label{display:block;text-align:left;font-size:14px;font-weight:500;margin:20px 0 8px}
input{display:block;font:inherit;font-size:16px;width:100%;min-height:56px;border:1px solid var(--line);background:var(--field);color:var(--text);border-radius:12px;padding:14px 16px;caret-color:var(--accent)}
input::placeholder{color:var(--muted)}
input[name="otp"]{letter-spacing:.24em;font-size:22px;font-variant-numeric:tabular-nums}
form button[type="submit"]{margin-top:20px}
.form-title{font-size:24px;text-align:center;margin:0 0 20px}
.notice{font-size:14px;margin:16px 0 0}
.notice:empty{display:none}
.notice[data-kind="error"]{color:var(--error)}
.existing-login{margin-top:24px;color:var(--muted);font-size:13px}
.existing-login summary{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;cursor:pointer;list-style:none;padding:10px 14px;border-radius:var(--radius)}
.existing-login summary::-webkit-details-marker{display:none}
.existing-login summary::after{content:"⌄";font-size:14px}
.existing-login[open] summary::after{content:"⌃"}
.existing-login button{display:block;margin:0 auto;font-size:14px}
.footer{font-size:13px;margin-top:24px}
.footer a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 12px;border-radius:var(--radius);color:var(--muted);text-decoration:none}
.footer a:hover{text-decoration:underline;text-underline-offset:4px}
.footer a:visited{color:#c1b1e5}
.account{padding:8px 0}
.account strong,.account span{display:block}
.account strong{font-weight:650}
.account span{color:var(--muted);font-size:15px;margin-top:4px}
.assistant-list{display:grid;gap:12px;margin:8px 0 20px}
.assistant-list button{text-align:left;border-radius:12px}
.progress-mark{width:20px;height:20px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--text);margin:24px auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
::selection{background:#956afd55;color:var(--text)}
body[data-identity-view="otp"] .brand-lockup,body[data-identity-view="sso"] .brand-lockup,body[data-identity-view="access-pending"] .brand-lockup{width:220px;margin-bottom:32px}
body[data-identity-view="account"] .brand-lockup,body[data-identity-view="legacy-account"] .brand-lockup{width:180px;margin-bottom:32px}
.privacy-page{display:block;width:min(100%,760px);margin:0 auto;padding:40px 24px}
.privacy-page .wordmark{display:inline-flex;min-height:44px;align-items:center;color:var(--text);font-size:26px;font-weight:700;text-decoration:none;margin-bottom:40px}
.privacy-page h2{margin-top:32px}
.privacy-page a{color:var(--text);text-underline-offset:3px}
.privacy-page a:visited{color:#c1b1e5}
@media(max-width:600px){body{background:var(--surface)}.shell{padding:0;align-items:stretch}.auth-frame{width:100%;min-height:100svh;min-height:100dvh;border:0;border-radius:0;padding:max(48px,env(safe-area-inset-top)) 22px max(24px,env(safe-area-inset-bottom));display:flex;flex-direction:column;justify-content:center}.brand-lockup{width:280px;margin-bottom:48px}.footer{margin-top:20px}.existing-login{margin-top:12px}}
@media(max-height:650px){.shell{padding:20px}.auth-frame{padding-top:28px;padding-bottom:20px}.brand-lockup{width:220px;margin-bottom:28px}.existing-login{margin-top:12px}.footer{margin-top:12px}}
@media(prefers-reduced-motion:no-preference){button{transition:background .12s ease-out,opacity .12s ease-out}button:not(:disabled):active{transform:scale(.99)}.progress-mark{animation:spin .8s linear infinite}}
@keyframes spin{to{transform:rotate(360deg)}}
