/* Auth-only visual language, adapted from the customer apps. No auth logic. */
html:has(#login:not(.hidden)){font-size:100%}
#login,.auth-document{
  --auth-bg:#f5f4f0;--auth-ink:#20211f;--auth-muted:#62645e;
  --auth-surface:rgba(255,255,255,.78);--auth-field:rgba(255,255,255,.7);
  --auth-line:#b9bcb4;--auth-soft-line:rgba(40,44,35,.12);
  --auth-action:#252923;--auth-action-ink:#fff;--auth-focus:#53634a;
  --auth-link:#354d2c;--auth-shadow:0 4px 12px #20251b08,0 20px 60px #20251b06;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,Arial,Tahoma,sans-serif;
  font-optical-sizing:auto;color:var(--auth-ink);
}
[data-theme=dark] #login,.auth-document[data-theme=dark]{
  --auth-bg:#121412;--auth-ink:#f3f3ed;--auth-muted:#b9bcb4;
  --auth-surface:rgba(36,39,35,.86);--auth-field:rgba(17,20,16,.6);
  --auth-line:#72786c;--auth-soft-line:rgba(228,235,218,.16);
  --auth-action:#e1e7d8;--auth-action-ink:#22271e;--auth-focus:#c2d4ae;
  --auth-link:#d0ddc0;--auth-shadow:0 4px 12px #00000014,0 20px 60px #0000001a;
}
#login.login{background:var(--auth-bg);padding:3rem 1rem;min-height:100dvh;align-items:center}
#login .login-card{width:min(28rem,100%);padding:2rem;border-radius:2rem;
  background:var(--auth-surface);border:1px solid var(--auth-soft-line);
  box-shadow:var(--auth-shadow);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:var(--auth-ink)}
#login .login-head{gap:1.5rem;width:100%;align-items:stretch}
#login .login-head .logo,#login #recoveryView .logo{justify-content:center;padding:.5rem 0}
#login .login-head .logo img,#login #recoveryView .logo img{height:2rem}
#login #registrationView>.logo{justify-content:center;padding:.5rem 0}
#login #registrationView>.logo img{height:2rem}
#login #socialChoiceView>.logo{justify-content:center;padding:.5rem 0}
#login #socialChoiceView>.logo img{height:2rem}
#login #socialIntro{color:var(--auth-muted);line-height:1.75;text-align:center;margin-bottom:1.5rem}
#login #socialLink,#login #socialBack{width:100%;margin-top:.75rem}
#login #socialStatus{line-height:1.75;overflow-wrap:anywhere}
#login #registrationNotice{margin:.75rem 0;line-height:1.6}
#login #registrationVerifiedEmail{font-size:.875rem;text-align:center;margin:.5rem 0 1rem}
#login .auth-identifier{white-space:nowrap;unicode-bidi:isolate;font-size:.95em}
#login #entryStatus.login-error{color:#9b2525;background:#fff0ef;border:1px solid #efc7c4}
[data-theme=dark] #login #entryStatus.login-error{color:#ffd5d0;background:#3d2524;border-color:#86534e}
#login h1{font-size:clamp(1.5rem,4vw,1.75rem);font-weight:650;line-height:1.4;margin:1.5rem 0 .5rem;text-align:center;letter-spacing:0}
html[dir=ltr] #login h1{letter-spacing:-.025em;line-height:1.25}
#login #loginIntro,#login #recoveryIntro,#login #registrationIntro{color:var(--auth-muted);text-align:center;line-height:1.75;margin:0 0 1.5rem}
#login label{color:var(--auth-ink);font-size:.875rem;font-weight:600;margin:1rem 0 .5rem}
#login .control{border:1px solid var(--auth-line);border-radius:.75rem;min-height:3.25rem;
  background:var(--auth-field);color:var(--auth-ink);font-size:1rem;padding:.875rem 1rem;box-shadow:none}
#login .control::placeholder{color:var(--auth-muted)}
#login .control:focus{border-color:var(--auth-focus);box-shadow:0 0 0 3px color-mix(in srgb,var(--auth-focus) 20%,transparent)}
#login .login-card .primary,#login .login-card .primary:not(:disabled),#login #loginSubmit,#login #recoverySubmit{
  min-height:3.25rem;border-radius:.75rem;background:var(--auth-action);color:var(--auth-action-ink);
  font-size:1rem;font-weight:600;box-shadow:none;margin-top:1.5rem}
#login button{touch-action:manipulation;transition:transform 80ms ease-out,background-color 120ms ease-out,opacity 120ms ease-out}
#login button:not(:disabled):active{transform:scale(.98)}
#login .secondary,#login .login-tools .secondary,#login .login-footer-tools .secondary{
  border-radius:.75rem;color:var(--auth-ink);background:transparent;border-color:var(--auth-soft-line);min-height:2.75rem;font-weight:500}
#login .login-footer-tools .secondary{border-color:transparent;color:var(--auth-muted)}
#login #entryPassword,#login #entryBack{width:100%;margin-top:.5rem}
#login #googleSignInNote{margin:.75rem 0 0;text-align:center}
#login #googleSignInStatus:empty{display:none}
#login #appleSignIn{margin-top:.75rem}
#login .apple-sign-in{display:flex;justify-content:center;align-items:center;gap:.625rem;width:100%;min-height:3rem;padding:.75rem 1rem;border:1px solid #72786c;border-radius:.75rem;background:#000;color:#fff;font:inherit;font-weight:600}
#login .apple-sign-in img{object-fit:contain;width:30px;height:30px}
#login #appleSignInStatus{font-size:.875rem;line-height:1.6;color:var(--auth-muted)}
#login #appleSignInStatus:empty{display:none}
#login .login-reveal{border-radius:.5rem;background:transparent;color:var(--auth-link)}
#login .login-help,#login .login-help summary,#login .login-help p,#login .registration-policies a,
#login #registrationStatus,#login #entryStatus,#login #entryPassword,#login #entryBack,
#login #entryLinkExisting{color:var(--auth-link)}
#login .registration-policies{gap:.25rem 1rem;margin-top:1rem;font-size:.8125rem}
#login .registration-policies a{text-underline-offset:.25rem}
#login .registration-consent{color:var(--auth-ink);font-weight:400}
#login .registration-consent input{accent-color:var(--auth-action)}
#login .registration-clickwrap{font-size:.875rem;line-height:1.7;color:var(--auth-muted);margin:.75rem 0}
#login .registration-clickwrap a{color:var(--auth-link);text-decoration:underline;text-underline-offset:.2rem;display:inline;min-height:0}
#login #registrationConsentEnd{display:none}
#login #registrationView .registration-policies{margin:.25rem 0}
#login #registrationView #registrationNotice{margin:.25rem 0;font-size:.8125rem}
#login #registrationView #registrationConsent{margin:.75rem 0}
#login .login-card h1[tabindex="-1"]:focus{outline:none}
#login #passkeyEntry{margin-top:1rem;text-align:center}
#login #passkeyEntry>button{width:100%;min-height:52px}
#login #passkeyEntry p{font-size:.875rem;line-height:1.7;overflow-wrap:anywhere}
#login #passkeyEntry>a{display:inline-flex;min-height:44px;align-items:center;font-size:.8125rem;color:var(--auth-link)}
#login .muted,#login #registrationNotice,#login #registrationPasswordHint,#login #googleSignInNote,#login #googleSignInStatus{color:var(--auth-muted)}
#login #googleSignIn{border-top-color:var(--auth-soft-line)!important}
#login #recoveryStatus{color:var(--auth-ink);background:var(--auth-field);border-color:var(--auth-soft-line);border-radius:.75rem}
#login button:focus-visible,#login a:focus-visible,#login summary:focus-visible{outline:3px solid var(--auth-focus);outline-offset:3px}
#login [hidden]{display:none!important}
/* Match the legacy dark selectors explicitly so none of their green surfaces leak. */
[data-theme=dark] #login.login{background:var(--auth-bg)}
[data-theme=dark] #login .login-card{background:var(--auth-surface);border-color:var(--auth-soft-line)}
[data-theme=dark] #login .control{background:var(--auth-field);color:var(--auth-ink);border-color:var(--auth-line)}
[data-theme=dark] #login label,[data-theme=dark] #login .login-help summary{color:var(--auth-ink)}
[data-theme=dark] #login #loginIntro,[data-theme=dark] #login #recoveryIntro,[data-theme=dark] #login .login-help p,[data-theme=dark] #login .login-tools .secondary{color:var(--auth-muted)}
[data-theme=dark] #login .login-help,[data-theme=dark] #login .registration-policies a,[data-theme=dark] #login #registrationStatus{color:var(--auth-link)}
[data-theme=dark] #login .login-reveal{background:transparent;color:var(--auth-link)}
[data-theme=dark] #login #recoveryStatus{background:var(--auth-field);color:var(--auth-ink);border-color:var(--auth-soft-line)}
[data-theme=dark] #login button:focus-visible,[data-theme=dark] #login summary:focus-visible{outline-color:var(--auth-focus)}
/* Readable documents share tokens, not the console's global component rules. */
html.auth-document,html.auth-document[data-theme]{background:var(--auth-bg);color:var(--auth-ink)}
.auth-document main,.auth-document[data-theme] main{max-width:51rem;margin:2rem auto;padding:2rem;background:var(--auth-surface);border:1px solid var(--auth-soft-line);border-radius:2rem;box-shadow:var(--auth-shadow)}
.auth-document h1{font-weight:650;letter-spacing:0;line-height:1.4}
.auth-document[dir=ltr] h1{letter-spacing:-.025em}
.auth-document h2{font-weight:600}
.auth-document .auth-brand img{display:block;width:10rem;max-width:100%;height:auto}
.auth-document .auth-brand .auth-logo-dark{display:none}
.auth-document[data-theme=dark] .auth-brand .auth-logo-light{display:none}
.auth-document[data-theme=dark] .auth-brand .auth-logo-dark{display:block;mix-blend-mode:screen}
.auth-document a,.auth-document button,.auth-document[data-theme] a,.auth-document[data-theme] button{color:var(--auth-link)}
.auth-document button{border-color:var(--auth-line);border-radius:.75rem;min-height:2.75rem}
.auth-document details,.auth-document footer,.auth-document[data-theme] details,.auth-document[data-theme] footer{border-color:var(--auth-soft-line)}
.auth-document a:focus-visible,.auth-document button:focus-visible,.auth-document summary:focus-visible{outline:3px solid var(--auth-focus);outline-offset:3px}
.auth-document .auth-assistance{margin:1.5rem 0 2rem;padding:1.5rem;border:1px solid var(--auth-soft-line);border-radius:1.25rem;background:var(--auth-field)}
.auth-document .auth-assistance h2{margin:0;font-size:1.25rem;line-height:1.5}
.auth-document .assistance-choices{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.auth-document .assistance-choices button{font:inherit;text-align:start;padding:.75rem 1rem;line-height:1.5;background:var(--auth-surface)}
.auth-document .assistance-choices button[aria-pressed=true]{border-color:var(--auth-focus);box-shadow:0 0 0 1px var(--auth-focus)}
.auth-document #assistanceResult{margin-top:1.5rem;scroll-margin-top:1rem}
.auth-document #assistanceResult:focus{outline:2px solid var(--auth-focus);outline-offset:.5rem;border-radius:.5rem}
.auth-document #assistanceResult h3{font-size:1.125rem;line-height:1.5}
.auth-document #assistanceResult ol{padding-inline-start:1.5rem}
.auth-document #assistanceResult li{margin:.75rem 0;overflow-wrap:anywhere}
.auth-document .assistance-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}
.auth-document .assistance-actions a{border:1px solid var(--auth-line);min-height:3rem;text-underline-offset:.2rem}
@media(max-width:480px){
  #login.login{padding:1.5rem 1rem;align-items:start}
  #login .login-card{padding:1.5rem;border-radius:2rem}
  #login h1{font-size:1.5rem;margin-top:1.5rem}
  .auth-document main,.auth-document[data-theme] main{margin:1rem;padding:1.5rem;border-radius:2rem}
  .auth-document .auth-assistance{padding:1rem}
  .auth-document .assistance-choices{grid-template-columns:1fr}
}
@media(prefers-reduced-transparency:reduce){#login .login-card,[data-theme=dark] #login .login-card,.auth-document main,.auth-document[data-theme] main{background:var(--auth-bg);backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(prefers-contrast:more){#login .login-card,[data-theme=dark] #login .login-card,.auth-document main,.auth-document[data-theme] main{background:var(--auth-bg);border-color:var(--auth-ink)}#login .control,[data-theme=dark] #login .control{background:var(--auth-bg);border-color:var(--auth-ink)}}
@media(prefers-reduced-motion:reduce){#login *,#login button{transition:none!important;animation:none!important}#login button:not(:disabled):active{transform:none}}
