.account-header,.account-footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;max-width:860px;margin:auto;padding:1.25rem}.account-main{max-width:680px;margin:auto;padding:1rem 1rem 3rem}.account-main .panel{margin-bottom:1.4rem;padding:clamp(1.2rem,4vw,2.5rem)}.account-main form{display:grid;gap:.75rem}.account-main input:not([type=checkbox]),.account-main textarea{display:block;width:100%;box-sizing:border-box;font:inherit;padding:.9rem;border:1px solid #79877d;border-radius:.5rem;background:#fff;color:#253c2e}.account-main label{display:block;margin-top:.7rem;font-weight:600}.account-main .button{margin:.5rem .3rem .5rem 0;white-space:normal}.account-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.5rem 0}.account-tabs button{font:inherit;border:1px solid #526f5c;background:#fff;padding:.6rem;border-radius:.5rem;color:#253c2e;cursor:pointer}.account-tabs button[aria-current=true]{background:#344b3d;color:white}.account-main .check{display:flex;align-items:flex-start;gap:.6rem;line-height:1.6;font-weight:400}.account-main .check input{margin-top:.4rem;min-width:1.2rem;min-height:1.2rem}.account-points{font-size:3rem;font-weight:700;margin:1rem 0}.account-main #card-qr{display:block;width:min(100%,280px);height:auto;margin:1.5rem auto}.account-main details{margin-top:1rem;border-top:1px solid #c6cfc8;padding-top:1rem}.account-main summary{cursor:pointer;font-weight:600}.account-main [hidden]{display:none!important}.account-main #branch-proof{display:block;overflow-wrap:anywhere;font-size:1.4rem;font-weight:bold;padding:1rem;background:#e9eee7}.account-main #card-username{overflow-wrap:anywhere}.account-footer{flex-wrap:wrap;font-size:.9rem}.account-main :focus-visible{outline:3px solid #93651d;outline-offset:3px}

.account-main .text-link{border:0;background:transparent;color:#344b3d;font:inherit;text-decoration:none;cursor:pointer;padding:.3rem}.account-main #toggle-register-password{justify-self:start;margin:0;font-size:.9rem}

.registration-steps{padding-left:1.35rem;margin:.5rem 0 1rem;line-height:1.55}.registration-steps li+li{margin-top:.65rem}

/* Welcoming, legible customer entrance with clear progress and generous targets. */
.account-main{max-width:700px}.account-main h1{font-size:clamp(1.85rem,5vw,2.6rem);line-height:1.15;letter-spacing:-.035em;margin:.65rem 0 1rem;color:#581900}.account-welcome{font-size:1.12rem;line-height:1.65;max-width:33rem}.account-main p{line-height:1.6}.account-main .panel{border:1px solid #e9e1d5;border-radius:20px;box-shadow:0 8px 28px #58190006;background:#fffdf8}.account-tabs{gap:.5rem;padding:.4rem;background:#f0ede5;border-radius:14px}.account-tabs button{flex:1 1 auto;min-height:46px;border:0;background:transparent;font-weight:600;border-radius:10px;padding:.65rem .8rem}.account-tabs button[aria-current=true]{background:#344b3d;color:white;box-shadow:0 2px 6px #344b3d20}.account-main .button{min-height:46px;border-radius:10px}.account-main form>.primary{width:100%;margin:.5rem 0}.account-main .muted{color:#626459}.registration-steps{list-style:none;counter-reset:registration;padding:0;display:grid;gap:.9rem}.registration-steps li{position:relative;padding-left:2.65rem;counter-increment:registration}.registration-steps li+li{margin-top:0}.registration-steps li:before{content:counter(registration);position:absolute;left:0;top:.1rem;width:1.8rem;height:1.8rem;display:grid;place-items:center;border-radius:50%;background:#ffed9b;color:#581900;font-weight:700}.registration-steps strong{display:block}#registration-next{padding:.8rem 1rem;border-radius:10px;background:#fff3ca;color:#503b20;font-size:.95rem}#save-credentials{padding-bottom:1rem}#save-credentials h2,.recovery-save h2{font-size:1.2rem;margin:1rem 0 .5rem}.recovery-save{margin:1.3rem 0;padding:1rem;border:1px solid #e6d59e;border-radius:12px;background:#fff8e3}.account-main #issued-code{font-family:ui-monospace,monospace;font-size:1rem;letter-spacing:.03em}.account-main #issued-username{font-family:ui-monospace,monospace;font-size:clamp(.85rem,3.5vw,1rem)}#acknowledge-access{width:100%}.account-header{padding-top:1rem;padding-bottom:.5rem}@media(max-width:440px){.account-main{padding-top:.5rem}.account-tabs button[data-view=recover]{flex-basis:100%;font-weight:400;font-size:.9rem}.account-main .panel{padding:1.2rem}.recovery-save{padding:.8rem}}

.account-main .button{font-size:1rem;line-height:1.4}.account-main #copy-username{font-size:.95rem}

/* A calm, warm entrance: keep the next step visible without a modal layer. */
.account-page .account-header{max-width:900px;padding-top:1.5rem;padding-bottom:1rem}
.account-page .account-header>a:last-child{font-size:.95rem;text-decoration:none;text-underline-offset:4px}
.account-page .panel{background:#fffefaf2;box-shadow:0 18px 52px #733a1410;border-color:#e9dcc4;border-radius:24px}
.account-page .account-tabs{background:#f5edde}
.account-page .account-tabs button{color:#664a32}
.account-page .account-tabs button[aria-current=true]{background:#713c24;color:#fff;box-shadow:0 3px 9px #713c2418}
.account-page .account-main input:not([type=checkbox]),.account-page .account-main textarea{border-color:#cbbba2;color:#422f25;border-radius:10px}
.account-page .account-main .remember-device{margin-top:.7rem;font-size:.95rem;font-weight:400}
.account-page .account-main .field-hint{margin:0;font-size:.86rem;line-height:1.5}
.account-page .account-main #toggle-register-password{justify-self:end;font-size:.9rem}
.account-page .account-main .password-toggle{margin:-.3rem 0 0}
.account-page .account-footer{color:#765c43;padding-bottom:2rem}
@media(max-width:440px){.account-page .account-header{padding-top:1.1rem}.account-page .panel{border-radius:18px}.account-page .account-main h1{font-size:2.1rem}}

.account-header{flex-wrap:wrap}
.account-main .button.danger{background:#8b302b;color:#fff;border:1px solid #8b302b;width:100%;font-weight:600}
.account-main .button.danger:hover{background:#712622}
#delete-card .field-hint{font-size:.9rem}#delete-title{scroll-margin-top:1rem}

.account-header{justify-content:flex-start;gap:.5rem}.account-main h2{line-height:1.35}.account-main .panel>p{color:#665c4d}.account-main .panel>h2{margin-bottom:.5rem}
