:root{background:var(--surface)}
*{box-sizing:border-box}
body{position:relative;isolation:isolate;margin:0;min-height:100svh;display:grid;grid-template-rows:auto 1fr auto;font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}
body::before{content:'';position:absolute;inset:0 50% 0 0;z-index:-1;background:var(--paper)}
button,input{font:inherit}
button,a,input{-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
button{cursor:pointer}
button:disabled{cursor:wait}
a{color:inherit;text-underline-offset:4px;text-decoration-thickness:1px}
::selection{color:var(--surface);background:var(--ink)}
:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
[hidden]{display:none!important}
input{caret-color:var(--ink)}
.account-header{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:32px 48px}
.brand{display:inline-flex;align-items:center;gap:10px;min-height:44px;text-decoration:none}
.brand img{display:block;flex:none}
.brand-name{font-family:ContextBrand,sans-serif;font-size:25px;font-weight:700;letter-spacing:-.04em;line-height:1.2}
.brand-by{margin:5px 0 0 4px;color:#686d63;font-size:12px;white-space:nowrap}
.text-button{min-height:44px;border:0;padding:10px 0;color:var(--muted);background:transparent;font-size:14px;text-decoration-thickness:1px;text-underline-offset:4px;transition:color .16s ease}
.text-button:hover{color:var(--ink);text-decoration:underline}
.text-button:disabled{opacity:.55}
.account-header .text-button{min-width:64px}
main{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;outline:none}
.account-art{display:flex;align-items:center;justify-content:center;padding:32px 48px 72px;min-width:0}
.account-art .context-art{display:block;width:100%;max-width:520px;aspect-ratio:3/2}
.account-panel{display:flex;justify-content:center;padding:52px 48px 76px;min-width:0}
.account-flow{width:100%;max-width:380px}
.completion-mark{display:none;margin:0 0 24px;color:var(--ink)}
.account-flow[data-phase=complete] .completion-mark{display:block}
h1{margin:0;font-size:30px;font-weight:600;line-height:1.3;letter-spacing:-.025em;text-wrap:balance}
.description{margin:12px 0 32px;color:var(--muted);font-size:15px;line-height:1.65;overflow-wrap:anywhere}
.field+.field{margin-top:20px}
label{display:block;margin-bottom:8px;font-size:14px;font-weight:500}
input{display:block;width:100%;height:48px;border:1px solid var(--line);border-radius:8px;padding:11px 13px;background:var(--surface);color:var(--ink);font-size:15px;line-height:24px;transition:border-color .16s ease}
input:hover{border-color:#a6a99f}
input:focus{border-color:var(--ink);outline:2px solid var(--ink);outline-offset:2px}
input:disabled{color:var(--muted);background:var(--paper)}
.password-control{position:relative}
.password-control input{padding-right:70px}
.password-control button{position:absolute;top:2px;right:3px;min-width:58px;min-height:44px;border:0;border-radius:4px;padding:8px;color:var(--muted);background:transparent;font-size:13px}
.password-control button:hover{color:var(--ink)}
.hint{margin:8px 0 0;color:var(--muted);font-size:12px;line-height:1.5}
.primary{display:flex;justify-content:center;align-items:center;width:100%;min-height:48px;border:1px solid var(--ink);border-radius:8px;padding:12px 16px;background:var(--ink);color:var(--surface);font-size:14px;font-weight:600;line-height:22px;text-align:center;text-decoration:none;transition:background .16s ease,border-color .16s ease}
.primary:hover{background:#3a3c35;border-color:#3a3c35}
.primary:active{background:#171814;border-color:#171814}
.primary:disabled{background:#64685c;border-color:#64685c;color:var(--surface)}
form .primary{margin-top:28px}
.form-links{display:flex;justify-content:space-between;gap:20px;margin-top:14px}
.secondary-action{display:block;margin:12px auto 0}
.account-identity{display:flex;align-items:center;gap:14px;margin:0 0 28px;padding:18px 0;border-block:1px solid var(--line)}
.account-identity>svg{flex:none;color:var(--muted)}
.account-identity>div{min-width:0}
.account-label{display:block;color:var(--muted);font-size:12px;line-height:1.5}
.account-name{margin:4px 0 0;font-size:15px;font-weight:500;line-height:1.5;overflow-wrap:anywhere}
.notice{margin:0 0 24px;padding:12px 14px;border:1px solid var(--line);border-radius:6px;color:var(--error);background:var(--paper);font-size:14px;line-height:1.6;overflow-wrap:anywhere}
.notice:empty{display:none}
#retry{margin-top:24px}
footer{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:76px;padding:12px 48px 28px;color:var(--muted);font-size:12px}
footer>span{color:#686d63}
footer a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none}
footer a:hover{color:var(--ink);text-decoration:underline}
.skip-link{position:fixed;top:12px;left:24px;z-index:5;padding:10px 14px;transform:translateY(-200%);background:var(--ink);color:var(--surface)}
.skip-link:focus{transform:none}
@media(min-width:1440px){.account-header{padding:36px 64px}.account-panel{padding-inline:64px}.account-art{padding-inline:64px}footer{padding-inline:64px}}
@media(max-width:800px){body::before{display:none}.account-header{padding:22px 28px}.brand-name{font-size:24px}.brand-by{font-size:11px}main{display:flex;justify-content:center}.account-art{display:none}.account-panel{width:100%;padding:48px 28px 64px}footer{padding:12px 28px 20px;min-height:72px}}
@media(max-width:420px){.account-header{padding:20px 24px;gap:16px}.brand{gap:8px}.brand img{width:29px;height:29px}.brand-name{font-size:23px}.brand-by{margin-left:0}.account-header .text-button{min-width:52px}.account-panel{padding:32px 24px 48px}h1{font-size:28px}input{font-size:16px}footer{padding-inline:24px}}
@media(max-width:350px){.brand-by{display:none}.account-header{padding-inline:20px}.account-panel{padding-inline:20px}footer{padding-inline:20px}}
@media(max-height:700px) and (min-width:801px){.account-header{padding-block:20px}.account-art{padding-block:20px;max-height:480px}.account-art .context-art{max-width:min(100%,410px)}.account-panel{padding-block:24px}footer{padding-block:10px;min-height:64px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}

.consent-choice{display:flex;align-items:center;gap:10px;min-height:44px;margin:0 0 20px;font-size:14px;font-weight:400}.consent-choice input{width:18px;height:18px;flex:none}.consent-choice span{min-width:0}.consent-choice+button{margin-top:20px}

.browser-mode{border:0;padding:0;margin:0 0 22px}.browser-mode legend{font-size:13px;color:var(--muted);margin-bottom:8px}.browser-mode label{display:inline-flex;align-items:center;gap:7px;margin-right:22px;font-size:14px}.browser-mode input{width:auto;accent-color:var(--ink)}.browser-mode .hint{margin-top:9px}