.member-account-nav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 30px;padding:0;border:0;background:none}.member-account-nav a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 18px;border:3px solid var(--outline);border-radius:999px;background:var(--card);color:var(--ink);font:800 .9375rem/1.2 var(--font-head);text-decoration:none;white-space:nowrap}.member-account-nav a:hover{border-color:var(--ink)}.member-account-nav a[aria-current=page]{border-color:var(--ink);background:var(--ink);color:var(--paper)}.member-account-view{scroll-margin-top:110px;margin:0 0 42px}.member-account-view>.member-panel,.member-account-view>#member-saved-results-mount>.saved-results,.member-account-view>#member-favourites-mount>.saved-results{margin-top:22px}.member-overview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.member-overview-card{display:flex;min-width:0;min-height:132px;flex-direction:column;gap:8px;padding:var(--space-card);border:3px solid var(--outline);border-radius:var(--radius);background:var(--card);color:var(--ink);text-decoration:none;box-shadow:var(--shadow-sm);transition:transform .12s ease-out,box-shadow .12s ease-out}.member-overview-card:hover{border-color:var(--ink)}.member-overview-card:active{transform:translateY(2px);box-shadow:none}.member-overview-card strong{font:800 1.25rem/1.2 var(--font-head)}.member-overview-card span{color:var(--muted);font-size:.875rem}.account-group{scroll-margin-top:110px;margin:24px 0;padding:24px;border:3px solid var(--outline);border-radius:var(--radius);background:var(--card)}.account-group>p{max-width:680px}.account-group>.member-panel>h4{font:800 1.25rem/1.2 var(--font-head);letter-spacing:0;margin:0 0 12px}.account-settings{scroll-margin-top:110px}.account-settings>p:not(.eyebrow){max-width:680px;color:var(--muted)}.account-subsection{margin:24px 0;padding-top:20px;border-top:2px dashed var(--hair)}.account-subsection:first-child{margin-top:16px;padding-top:0;border-top:0}.account-subsection .btn{margin:0 8px 8px 0}.member-account{margin:20px 0;max-width:680px}.member-account summary{font-weight:600;cursor:pointer;min-height:44px;display:flex;align-items:center}.member-account form{max-width:460px;margin:18px 0}.member-account label{display:block;margin-bottom:8px;font-size:1rem}.member-account input{width:100%;font-size:1rem}.member-account #account-message{font-size:1rem;overflow-wrap:anywhere}.member-account .member-fineprint{font-size:.875rem}.member-account [hidden]{display:none!important}#profile-onboarding>.member-panel{margin-top:22px}
@media(max-width:700px){.member-account-nav{overflow:visible}.member-account-nav a{flex:1 1 auto;min-width:0;padding:8px 14px;text-align:center}.member-overview-grid{grid-template-columns:1fr}.member-overview-card{min-height:0}.member-account-view{scroll-margin-top:96px}}
.member-signin-intro,.member-signin-new{display:none}
body.member-signed-out .member-account-nav,body.member-signed-out #main>.intro,body.member-signed-out #member-settings-title,body.member-signed-out #profile-onboarding,body.member-signed-out #account-settings>.eyebrow,body.member-signed-out #account-settings-title,body.member-signed-out #account-settings-title+p,body.member-signed-out #account-registration-scope{display:none}
body.member-signed-out .member-signin-intro,body.member-signed-out .member-signin-new:not([hidden]){display:block}
body.member-signed-out #account-settings{max-width:30rem;margin:8px auto 32px}
body.member-signed-out .member-signin-intro h1{font-size:2rem;line-height:1.15;margin:0 0 6px}body.member-signed-out .member-signin-intro h1:focus{outline:none}
body.member-signed-out .member-signin-intro p{color:var(--muted);margin:0 0 18px}
/* Code step on /join/ and the /members/ sign-in card (19 Oct 2026): under the subtitle, the line naming the full
   address the visitor typed and "Wrong email? Change it"; a long address wraps inside the card. */
.member-step-intro>p:has(+.member-sent-to:not([hidden])){margin-bottom:6px}body.member-signed-out .member-signin-intro p:has(+.member-sent-to:not([hidden])){margin-bottom:6px}
.member-sent-to,body.member-signed-out .member-signin-intro .member-sent-to{margin:0 0 18px;color:var(--ink);font-size:.9375rem;line-height:1.5;overflow-wrap:anywhere}.member-sent-to strong{font-weight:800}
.member-sent-to-change{display:inline;margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;font-weight:700;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
#account-message:empty{display:none}
/* Field, then the send-code button, then the stay-signed-in line (it stays the field's description). */
body.member-signed-out #account-email-form:not([hidden]){display:flex;flex-direction:column}body.member-signed-out #account-tab-scope{order:1;margin:0}
body.member-signed-out #account-email-form input,body.member-signed-out #account-code-form input:not(.otp-box){display:block;box-sizing:border-box;width:100%;min-height:46px;margin:6px 0 12px}
body.member-signed-out #account-email-form .btn,body.member-signed-out #account-code-form .btn{width:100%;margin:0 0 10px}
/* No account for that address (19 Oct 2026): "Create a free account →" (primary), then "Try a different email". */
.account-no-account{display:flex;flex-direction:column;align-items:stretch;gap:10px;max-width:460px;margin:0 0 18px}.account-no-account .btn{width:100%;margin:0;text-align:center;justify-content:center}
/* One primary button per step: Send my login code, then (on the code step, which replaces the email step) Sign in. */
body.member-signed-out #member-account:not(:has(#account-code-form:not([hidden]))) #account-email-form .btn.secondary{background:var(--primary);color:var(--primary-on);border-color:var(--primary-edge)}
/* Signed in: the member's email and Sign out lead the account controls. */
.account-identity{display:none}.member-account:has(#account-signed-in:not([hidden])) .account-identity{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:0 0 18px;padding:0 0 18px;border-bottom:2px dashed var(--hair)}
.account-identity>p{flex:1 1 100%;margin:0}#account-identity-line{font-size:1.0625rem;overflow-wrap:anywhere}#account-identity-line strong{font-weight:800}.account-identity .btn{margin:0}
/* /join/: the account controls stay in the page for its scripts but never show there (its own Sign in link goes to /members/), except a pending legal gate. */
.join-account-hooks{display:none}.join-account-hooks:has(#member-legal-gate:not([hidden])){display:block}
.member-signin-new{font-size:.9375rem;margin:14px 0 0}
/* Accounts closed: one short line (#account-message, "Sign-in opens soon.") in place of the code line, and no dead field or button. */
body.member-signin-closed #member-signin-lead,body.member-signin-closed #account-email-form:not([hidden]){display:none}body.member-signin-closed #account-message{margin:0;color:var(--ink)}
/* Account form layout: field spacing, inline consent checkboxes and compact Save/Reload rows. */
.member-account form input:not([type=checkbox]):not([type=radio]):not(.otp-box){display:block;box-sizing:border-box;min-height:46px;margin:6px 0 12px}
.member-account form .member-fineprint{margin:0 0 14px}
.member-account .member-consent,.account-group .member-consent{display:flex;align-items:flex-start;gap:10px;margin:14px 0 16px;color:var(--ink);font-size:.9375rem;line-height:1.5}
.member-account .member-consent input[type=checkbox],.account-group .member-consent input[type=checkbox],#display-form input[type=checkbox]{flex:0 0 auto;width:24px;height:24px;min-height:0;margin:0;padding:0}
#display-form label[for=display-public]{display:flex;align-items:flex-start;gap:10px}
#member-legal-gate{margin:0 0 24px;padding:20px 22px;border:3px solid var(--brand);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow-sm)}#member-legal-gate>h3{margin-top:0}#member-legal-gate>p:last-child{margin-bottom:0}#member-legal-gate .btn{margin:4px 0 12px}#member-legal-gate .btn.primary{background:var(--primary);color:var(--primary-on);border-color:var(--primary-edge)}
#profile-onboarding>.member-panel{padding:20px 22px;border-radius:var(--radius)}#profile-onboarding>.member-panel>p:empty{margin:0}#profile-onboarding>.member-panel>ul:empty{display:none}
#profile-onboarding>.member-panel,#member-preferences,#referral-display{display:flex;flex-wrap:wrap;align-items:center;column-gap:10px}
#profile-onboarding>.member-panel>*,#member-preferences>*,#referral-display>*,#profile-onboarding>.member-panel>form>*,#member-preferences>form>*,#referral-display>form>*{flex:1 1 100%;min-width:0}
#profile-onboarding>.member-panel>form:not([hidden]),#member-preferences>form:not([hidden]),#referral-display>form:not([hidden]){display:contents}
#profile-onboarding>.member-panel .btn,#member-preferences .btn,#referral-display .btn{flex:0 0 auto;width:auto;min-height:44px;margin:4px 0 10px;padding:10px 18px}
#profile-onboarding>.member-panel .btn[type=submit],#member-preferences .btn[type=submit],#referral-display .btn[type=submit]{background:var(--primary);color:var(--primary-on);border-color:var(--primary-edge)}
#profile-onboarding>.member-panel label:not(.member-consent),#referral-display label[for=display-nickname]{display:block;margin:0 0 6px;font-weight:600;font-size:.875rem}
#profile-onboarding>.member-panel input:not([type=checkbox]),#profile-onboarding>.member-panel select,#referral-display input:not([type=checkbox]){display:block;box-sizing:border-box;flex:0 0 100%;width:100%;max-width:26rem;min-height:46px;margin:0 max(0px,calc(100% - 26rem)) 14px 0;padding:10px 12px;border:3px solid var(--field-border);border-radius:var(--radius-field);background:var(--card);color:var(--ink);font-size:1rem}
#referral-display>p,#referral-display>form>p,#referral-display>form>label{flex:0 0 100%;max-width:38rem;margin-right:max(0px,calc(100% - 38rem))}#referral-display>p:empty{margin-bottom:0}
@media(max-width:700px){#account-session-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}#account-session-controls>h3{grid-column:1/-1}#account-session-controls .btn{display:flex;align-items:center;justify-content:center;margin:0;padding:10px 12px;line-height:1.3}.account-group{padding:18px}#profile-onboarding.account-group{padding:0;border:0;background:none}#profile-onboarding>.member-panel,#referral-display{padding:18px}#profile-onboarding>.member-panel .btn,#member-preferences .btn,#referral-display .btn{padding:10px 14px}}
/* Code step: Sign in waits for all six digits and Send a new code for the minute to pass; both look disabled meanwhile, as on /join/. */
#account-code-form button:disabled{border:3px dashed var(--outline);background:var(--soft);color:var(--muted);box-shadow:none;cursor:not-allowed}
/* A rejected sign-in code: the field is marked beside its inline alert (member-account.js). */
#account-code-form [aria-invalid=true]:not(.otp-box){border-color:var(--line-ns);outline-color:var(--line-ns)}
#reward-details-status[data-tone]{margin:12px 0 0;padding:10px 14px;border:3px solid var(--outline);border-radius:var(--radius-field);background:var(--card);color:var(--ink);font-weight:600}
/* Legal-pending: the re-accept panel is the first thing on /members/; profile and settings headings wait until it is accepted. */
body.member-legal-pending .member-account-nav,body.member-legal-pending .intro>p,body.member-legal-pending #member-settings-title,body.member-legal-pending #profile-onboarding,body.member-legal-pending #account-settings>.eyebrow,body.member-legal-pending #account-settings-title,body.member-legal-pending #account-settings-title+p{display:none}
#account-signout-note,#member-signout-note{margin:0;font-size:.8125rem;color:var(--muted)}#account-signout-note{grid-column:1/-1}
/* Signed-out preview of My Family Plan (scripts/render-membership.js). Shown only while this tab holds no
   session: when member-account.js marks the page signed out, or while accounts are off and Overview shows. */
.member-preview{display:none;margin:var(--space-group) 0 0}
body.member-signed-out .member-preview,.member-page:not(:has(#member-session-bar:not([hidden]))):has(#member-overview:not([hidden])) .member-preview{display:block}
body.member-legal-pending .member-preview,body.member-signed-out.member-signin-focus .member-preview{display:none}
.member-preview h2{margin:0 0 var(--space-2)}
.member-preview-lead{max-width:40rem;margin:0 0 var(--space-heading-after);color:var(--muted)}
.member-preview-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-grid);padding:var(--space-card);border:3px dashed var(--outline);border-radius:var(--radius);background:var(--soft)}
.member-preview-panel{display:flex;min-width:0;flex-direction:column;gap:var(--space-stack);padding:var(--space-4);border:3px solid var(--outline);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow-sm)}
.member-preview-panel h3{margin:0;font:800 1.125rem/1.2 var(--font-head)}
.member-preview-stage{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 8px;margin:0;font:800 .9375rem/1.3 var(--font-head)}
.member-preview-stage span{padding:3px 10px;border-radius:999px;background:var(--ink-base);color:var(--tabbar-on);font-size:.8125rem;white-space:nowrap}
.member-preview-steps,.member-preview-files{display:grid;gap:var(--space-2);margin:0;padding:0;list-style:none}
.member-preview-steps li{display:flex;align-items:flex-start;gap:10px;font-size:.9375rem;line-height:1.4}
.member-preview-steps li.is-done{color:var(--muted);text-decoration:line-through}
.member-preview-tick{display:inline-grid;place-content:center;flex:0 0 auto;width:22px;height:22px;border:3px solid var(--field-border);border-radius:7px;background:var(--card)}
.is-done>.member-preview-tick{border-color:var(--ink);background:var(--ink)}
.is-done>.member-preview-tick::before{content:"";width:6px;height:11px;margin-top:-3px;border:solid var(--card);border-width:0 3px 3px 0;transform:rotate(45deg)}
/* The saved result sits on the same yellow bolted tile as a live result. */
.member-preview-tile{position:relative;margin:0;padding:16px 26px 14px;border-radius:18px;color:var(--spinner-ink);background:var(--bolts) left 8px top 8px/12px 12px no-repeat,var(--bolts) right 8px top 8px/12px 12px no-repeat,var(--bolts) left 8px bottom 8px/12px 12px no-repeat,var(--bolts) right 8px bottom 8px/12px 12px no-repeat,var(--spinner);box-shadow:inset 0 -5px 0 rgba(0,0,0,.15)}
.member-preview-tile p{margin:0;font:800 .8125rem/1.25 var(--font-head)}
.member-preview-tile strong{display:block;margin:4px 0 2px;font:900 1.5rem/1.1 var(--font-head);letter-spacing:-.01em}
.member-preview-tile small{font:700 .8125rem/1.3 var(--font-body)}
.member-preview-files li{display:flex;align-items:center;gap:12px;min-width:0}
.member-preview-files img{flex:0 0 auto;width:72px;height:auto;aspect-ratio:2/1;object-fit:cover;border:2px solid var(--outline);border-radius:8px;background:var(--soft)}
.member-preview-files span{display:grid;min-width:0;font-size:.9375rem;line-height:1.3}
.member-preview-files small{color:var(--muted);font-size:.8125rem}
.member-preview-note{margin:auto 0 0;font-size:.875rem;color:var(--muted)}
@media(max-width:900px){.member-preview-board{grid-template-columns:1fr;padding:var(--space-3)}}
/* Join and members (visual QA Part B 29): closed, "Sign in to my account" is a secondary pill button, not a box that reads as an empty field. */
.member-account.member-panel:not([open]){padding:0;border:0;background:none;box-shadow:none}
.member-account.member-panel:not([open])>summary{display:inline-flex;align-items:center;min-height:48px;padding:10px 22px;border:3px solid var(--outline);border-radius:var(--radius-btn,999px);background:var(--card);color:var(--ink);font-weight:800;box-shadow:var(--press)}
