﻿/* PC-002/003: preserve the actual account fields and server actions. */
html.login-page[data-shell-mode="night"] { --login-wallpaper-filter:grayscale(1) brightness(.38); --login-art-panel:#d4d4ce; color-scheme:dark; }
html.login-page[data-glass-standalone="page"] body::before { position:absolute; filter:var(--login-wallpaper-filter); }
html.login-page[data-shell-mode="night"] .wordmark-logo { filter:invert(1); }
.account-flow.login-shell { padding-top:144px; padding-bottom:100px; }
.account-flow .auth-card { padding:32px 36px; }.account-flow .intro { margin-bottom:30px; }
.account-flow .reg-field { margin:0 0 20px; }.account-flow .reg-field>label { display:block; margin-bottom:8px; color:var(--sg-ink); font:500 13px/20px var(--sg-font); }
.account-flow .reg-field input { box-sizing:border-box; width:100%; min-width:0; height:48px; padding:0 14px; margin:0; border:1px solid var(--sg-control-line); border-radius:12px; color:var(--sg-ink); background:var(--sg-solid); font:400 14px/22px var(--sg-font); outline:none; }
.account-flow .reg-field input:focus-visible { outline:2px solid var(--sg-ink); outline-offset:2px; }.account-flow .reg-field input::placeholder { color:var(--sg-quiet); opacity:1; }
.account-flow .reg-field .reg-sms-row { display:block; }.account-flow .account-required { color:var(--sg-muted); }
.account-flow .account-sms-action { margin:0 0 32px; }.account-flow .reg-sms-btn { min-height:44px; padding:10px 16px; border:1px solid var(--sg-line); border-radius:12px; color:var(--sg-ink); background:var(--sg-solid); font:500 14px/22px var(--sg-font); cursor:pointer; }.account-flow .reg-sms-btn:disabled { opacity:.65; cursor:wait; }
.account-flow .reg-sms-hint { margin-top:8px; color:var(--sg-muted); font:400 12px/18px var(--sg-font); }.account-flow .reg-sms-msg,.account-flow .field-validation-error { display:block; margin-top:8px; font:400 12px/18px var(--sg-font); }.account-flow .field-validation-valid { display:none; }.account-flow .reg-sms-msg.is-error,.account-flow .field-validation-error { color:#a64135; }.login-page[data-shell-mode="night"] .account-flow .reg-sms-msg.is-error,.login-page[data-shell-mode="night"] .account-flow .field-validation-error { color:#f0aaa1; }.account-flow .reg-sms-msg.is-success { color:var(--sg-ink); }
.account-flow .reg-error { margin-bottom:24px; padding:12px; border:1px solid currentColor; border-radius:12px; color:#a64135; font:400 13px/22px var(--sg-font); }.login-page[data-shell-mode="night"] .account-flow .reg-error { color:#f0aaa1; }.account-flow .reg-error ul { padding-left:18px; margin:0; }
.account-flow .bf-legal-links { margin:20px 0 0; padding:0; color:var(--sg-muted); font:400 12px/18px var(--sg-font); }.account-flow .bf-legal-links a { text-decoration:underline; text-underline-offset:3px; }
.account-flow .signup { margin-top:24px; }
@media(max-width:1023px) { .account-flow.login-shell { padding:124px 24px 40px; }.account-flow .reg-field input { font-size:16px; }.account-flow .auth-card { padding:32px; } }
@media(max-width:480px) { .account-flow.login-shell { padding:112px 16px 28px; }.account-flow .auth-card { padding:24px; } }

/* PC-003 (PDF pages 35-36): four full-width fields, then the SMS action,
   reset button and return link. Preserve the reference typography and gaps;
   only reduce outer whitespace on shorter screens, allowing natural scrolling. */
.account-forgotpassword .account-sms-action { margin-bottom:36px; }
.account-forgotpassword .submit { font:500 14px/22px var(--sg-font); }
/* PC-003 uses translucent input surfaces inside the glass card. */
.account-forgotpassword .reg-field input { background:rgba(255,255,255,.8); }
html.login-page[data-shell-mode="night"] .account-forgotpassword .reg-field input { background:rgba(0,0,0,.2); }
@media(min-width:1024px) {
  .account-forgotpassword.login-shell {
    min-height:100svh;
    padding-top:clamp(80px,calc(64svh - 496px),144px);
    padding-bottom:clamp(56px,calc(44svh - 340px),100px);
  }
}
/* The reference has no permanent hint row. Keep the existing SMS guidance
   available to assistive technology and on the button's hover tooltip. */
.account-forgotpassword .reg-sms-hint {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip-path:inset(50%); white-space:nowrap;
}
