/* Signup page: layout only; tokens live in ../src/ui/theme.css */
main.narrow.wide{max-width:440px;margin-left:auto;margin-right:auto;padding-left:20px;padding-right:20px}
@media (min-width:1280px){main.narrow.wide{padding-left:0;padding-right:0}}
main.narrow.wide h1{font-size:28px;font-weight:700}
main.narrow.wide .btn.pri.full{min-height:52px}
#msg{margin:14px 0 0}.full{margin-top:12px}.pending{margin-top:14px}
.test-banner{margin:0 0 14px;text-align:center;font-weight:700}.placeholder{font-style:italic}
.net-badge .net-more{display:none}
@media (max-width:400px){body.has-net-strip .test-banner{display:none}}
/* #586: the card banner stays visible above 400px. The name-step and done-step copies do not stack on it. */
#name-form [data-testid="test-name-badge"]{display:none}
#step-done [data-testid="test-name-note"]{display:none}
.btn,button,input{min-height:44px}
@media (max-width:420px){.top{flex-wrap:wrap;gap:8px}.brand-tag{display:none}}

/* Human | Agent tabs above the wizard. */
.signup-tabs{display:flex;gap:8px;margin:0 0 20px}
.signup-tabs [role="tab"]{flex:1;padding:10px 14px;border:1px solid var(--bd);border-radius:12px;background:transparent;color:var(--mut);font-weight:600;cursor:pointer}
.signup-tabs [role="tab"][aria-selected="true"]{background:var(--field);color:var(--fg);border-color:var(--bd-strong)}
.agent-flow{margin:0 0 16px;padding-left:20px}
.agent-flow li{margin:0 0 10px;font-size:14px;color:var(--mut)}
.agent-flow strong{color:var(--fg);font-weight:600}

/* Step n of 4. The fill is decorative; the text and progressbar value carry the meaning. */
.signup-progress{margin:0 0 32px}
.signup-progress-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:14px;white-space:nowrap}
.signup-progress-count{font-weight:600;color:var(--fg)}
.signup-progress-name{color:var(--mut)}
.signup-progress-name::before{content:"· "}
.signup-progress-track{margin-top:8px;height:4px;border-radius:2px;background:var(--bd);overflow:hidden}
.signup-progress-fill{display:block;height:100%;width:25%;border-radius:2px;background:var(--check,#1D9BF0);transition:width 400ms ease}
@media (prefers-reduced-motion:reduce){.signup-progress-fill{transition:none}}
.signup-progress-live{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.lede{margin:0 0 16px;font-size:16px;color:var(--mut)}
.trust{margin:16px 0 0;padding:0;list-style:none}
.trust li{margin:0 0 8px;font-size:14px;color:var(--mut)}
.trust strong{color:var(--fg);font-weight:600}
.agent-cta{margin:8px 0 0;padding:12px 14px;border:1px solid var(--bd);border-radius:12px;font-size:14px}

#email{height:48px;min-height:48px;padding:0 14px;line-height:1.2;border:1px solid var(--bd-strong);border-radius:12px;background:var(--field)}
#email::placeholder{color:var(--mut)}
#email:focus{border-color:var(--check,#1D9BF0);box-shadow:0 0 0 3px rgba(29,155,240,.35)}
#email.is-invalid{border-color:var(--err)}

/* Primary-name opt-in (unchecked by default). 44px tap row. */
.opt-primary{margin:12px 0 4px;padding:12px;border:1px solid var(--bd);border-radius:8px}
.opt-check{margin:0;display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer;font-weight:600}
.opt-check input{width:20px;height:20px;margin:0;accent-color:var(--fg)}
.opt-primary .hint{margin:4px 0 0}
/* William #349: pill buttons and fields on Sign in / Sign up / Recover (monochrome). */
.btn,button{border-radius:999px}
input,select,textarea,.namebox{border-radius:999px}
.namebox input{border-radius:999px}
.btn.icon{border-radius:999px}
/* Issue 476: Terms checkbox (unchecked by default) + the exact disclaimer under it */
.terms-accept{margin:12px 0 4px}
.terms-check{align-items:flex-start;font-weight:600;line-height:1.4}
.terms-check input{flex:none;margin-top:2px}
.terms-check a{text-decoration:underline}
.terms-disclaimer{margin:4px 0 0 30px}
/* QA 489 m4: disabled Register keeps readable text (muted on card, about 6:1 in both themes) */
#register-btn:disabled{opacity:1;background:var(--card);color:var(--mut);border:1px solid var(--bd);cursor:not-allowed}

/* Name step: live line, solid name text, checkmark switch. */
.namebox input,#step-done h1,#claimed-name{color:var(--fg);-webkit-text-fill-color:var(--fg);background-image:none;-webkit-background-clip:border-box;background-clip:border-box}
.avail{font-size:14px;font-weight:500;line-height:1.4}
.avail.free{color:var(--ok)}
.avail.free::before{content:"✓";margin-right:6px}
.avail.warn{color:var(--warn)}
.avail.bad{color:var(--danger-text,var(--err))}
.avail.checking{color:var(--mut)}
.name-help{margin:6px 0 0}
.switch-row{position:relative;display:flex;align-items:center;gap:10px;min-height:44px;margin:0;cursor:pointer;font-weight:600}
.switch{flex:none;width:44px;height:28px;border-radius:999px;border:1px solid var(--bd-strong);background:var(--field);position:relative}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--fg);transition:transform .15s ease}
.switch-row input{position:absolute;left:0;top:0;width:44px;height:44px;margin:0;opacity:0;cursor:pointer}
.switch-row input:checked + .switch{background:var(--fg);border-color:var(--fg)}
.switch-row input:checked + .switch::after{transform:translateX(16px);background:var(--bg)}
.switch-row input:focus-visible{outline:none}
.switch-row input:focus-visible + .switch{outline:2px solid var(--accent);outline-offset:2px}
.gas-badge{margin-left:auto;color:var(--warn);border:1px solid var(--warn);border-radius:999px;padding:2px 8px;font-size:12px;font-weight:600;line-height:20px}
@media (prefers-reduced-motion:reduce){.switch::after{transition:none}}

/* PR-12a: one testnet notice at every width on /signup/ and /recover/. The strip carries the full text.
   Scoped to body.notice-all because /login/ loads this file and keeps its own badge above 400px. */
@media (min-width:401px){
  body.notice-all .net-strip{display:block}
  body.notice-all header.nav .net-badge{display:none}
  body.notice-all.has-net-strip .test-banner{display:none}
}
#done [data-testid="test-name-note"]{display:none}