/* Google-owned credential button, then explicit server Email OTP verification.
   No custom Google button, motion, global blur or private data placeholder. */
html body:has(#member-auth-title) :is(dialog.member-passwordless-r360,#ht-workspace-surface > dialog.member-passwordless-r360) [hidden] {display:none!important;}
html body:has(#member-auth-title) :is(dialog.member-passwordless-r360,#ht-workspace-surface > dialog.member-passwordless-r360) :is(.member-email-field,.member-name-field,.member-password-field,.member-confirm-field,.member-mode-switch,.member-forgot-password-r344,.member-create-account) {display:none!important;}
html body:has(#member-auth-title) .member-passwordless-r360:is([data-mode=login],[data-mode=otp]) {color:#edf7fc;}
html body:has(#member-auth-title) .member-passwordless-r360:is([data-mode=login],[data-mode=otp]) .member-panel-heading {
  width:100%;max-width:420px;box-sizing:border-box;margin-inline:auto;
  padding-bottom:14px;border-bottom-color:#31576d;
}
html body:has(#member-auth-title) .member-passwordless-r360:is([data-mode=login],[data-mode=otp]) #member-auth-title {font-size:22px;line-height:1.45;letter-spacing:-.25px;}
html body:has(#member-auth-title) .member-passwordless-r360[data-mode=login] .member-google-signin-r337 {
  width:100%;max-width:400px;box-sizing:border-box;margin:18px auto 8px;padding:0;
  border:0;background:transparent;box-shadow:none;
}
html body:has(#member-auth-title) .member-passwordless-r360 .member-google-button-r337 {min-height:44px;width:100%;}
html body:has(#member-auth-title) .member-passwordless-r360 .member-google-signin-r337>.member-note {font-size:12px!important;line-height:1.6;color:#afc9da!important;overflow-wrap:anywhere;}
html body:has(#member-auth-title) .member-passwordless-r360[data-mode=otp] form {width:100%;max-width:400px;margin:0 auto;gap:12px!important;}
html body:has(#member-auth-title) .member-passwordless-r360[data-mode=otp] .member-verification-hint {
  margin:0 0 4px!important;color:#b5d0e0!important;font-size:13px!important;
  line-height:1.6;overflow-wrap:anywhere;
}
html body:has(#member-auth-title) .member-passwordless-r360[data-mode=otp] .member-code-field {min-width:0;gap:7px;}
html body:has(#member-auth-title) .member-passwordless-r360[data-mode=otp] .member-code-field>span {font-size:12px;color:#b5d0e0;}
html body:has(#member-auth-title) #ht-workspace-surface .member-passwordless-r360[data-mode=otp] .member-code-field>input,
html body:has(#member-auth-title) dialog.member-passwordless-r360[data-mode=otp] .member-code-field>input {
  box-sizing:border-box;width:100%;height:54px;min-height:54px;padding:8px 12px;
  border:1px solid #49778f;border-radius:13px;background:#09263a;color:#f0faff;
  text-align:center;font:650 27px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;
  letter-spacing:8px;box-shadow:inset 0 1px #e7f7ff0a;
}
html body:has(#member-auth-title) .member-passwordless-r360[data-mode=otp] .member-code-field>input:focus-visible {outline:2px solid #8bdcfc;outline-offset:2px;border-color:#8bdcfc;}
html body:has(#member-auth-title) .member-passwordless-r360[data-mode=otp] .member-primary {
  width:100%;min-height:46px;padding:11px 14px;border-radius:13px;
  border:1px solid #68b7d6;background:linear-gradient(110deg,#106d91,#285d98);
  color:#f4fbff;font-size:14px;font-weight:650;line-height:1.5;
}
html body:has(#member-auth-title) .member-passwordless-r360:is([data-mode=login],[data-mode=otp]) .member-status {
  max-width:400px;margin:10px auto!important;font-size:12px!important;line-height:1.6;
  color:#bfd7e5!important;overflow-wrap:anywhere;
}
html body:has(#member-auth-title) .member-passwordless-r360:is([data-mode=login],[data-mode=otp]) .member-status:empty {display:none!important;}
html body:has(#member-auth-title) .member-passwordless-r360 :is(.member-resend-code,.member-otp-back-r360) {
  display:flex;align-items:center;justify-content:center;width:100%;max-width:400px;
  box-sizing:border-box;min-height:44px;margin:8px auto 0;padding:10px 12px;
  border:1px solid #355c73;border-radius:12px;background:#123448;color:#c3dfed;
  font:inherit;font-size:13px;font-weight:600;line-height:1.5;
}
html body:has(#member-auth-title) .member-passwordless-r360 .member-otp-back-r360 {background:transparent;border-color:transparent;color:#a7c3d5;}
html body:has(#member-auth-title) .member-passwordless-r360 :is(.member-resend-code,.member-otp-back-r360):disabled {opacity:.65;cursor:default;}
@media(max-width:359px){html body:has(#member-auth-title) .member-passwordless-r360:is([data-mode=login],[data-mode=otp]) #member-auth-title {font-size:20px;}}
@media(forced-colors:active){
  html body:has(#member-auth-title) .member-passwordless-r360[data-mode=otp] :is(.member-code-field>input,.member-primary),
  html body:has(#member-auth-title) .member-passwordless-r360 :is(.member-resend-code,.member-otp-back-r360) {background:Canvas;color:CanvasText;border-color:ButtonBorder;box-shadow:none;}
  html body:has(#member-auth-title) .member-passwordless-r360:is([data-mode=login],[data-mode=otp]) :is(.member-status,.member-verification-hint,.member-code-field>span) {color:CanvasText!important;}
}

/* Native R360 correction: compact only entry/OTP cards; keep full Profile. */
html body:has(#member-auth-title) :is(dialog.member-passwordless-r360,#ht-workspace-surface > dialog.member-passwordless-r360):is([data-mode=login],[data-mode=otp]) {
  box-sizing:border-box!important;min-height:0!important;height:auto!important;
  width:100%!important;max-width:460px!important;align-self:start!important;
  margin-inline:auto!important;
}
html body:has(#member-auth-title) :is(dialog.member-passwordless-r360,#ht-workspace-surface > dialog.member-passwordless-r360)[data-mode=otp] .member-code-field>input {
  box-sizing:border-box!important;width:100%!important;height:54px!important;min-height:54px!important;
  padding:8px 12px!important;border:1px solid #49778f!important;border-radius:13px!important;
  background:#09263a!important;color:#f0faff!important;text-align:center!important;
  font:650 27px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace!important;
  letter-spacing:8px!important;box-shadow:inset 0 1px #e7f7ff0a!important;
}
html body:has(#member-auth-title) #ht-workspace-surface > dialog.member-passwordless-r360[data-mode=login] > .ht-profile-actions-r330 {
  grid-template-columns:minmax(0,1fr)!important;max-width:400px!important;
}
html body:has(#member-auth-title) #ht-workspace-surface > dialog.member-passwordless-r360[data-mode=login] #ht-contact-launcher-r324 {
  position:static!important;inset:auto!important;grid-column:1!important;justify-self:stretch!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;
  width:100%!important;max-width:400px!important;min-height:44px!important;height:44px!important;
  padding:9px 12px!important;margin:0!important;border:1px solid #416a81!important;border-radius:12px!important;
  background:#123448!important;color:#b5d0e0!important;box-shadow:none!important;font-size:13px!important;
}
html body:has(#member-auth-title) #ht-workspace-surface > dialog.member-passwordless-r360[data-mode=login] #ht-contact-launcher-r324>svg {width:20px!important;height:20px!important;}
@media(forced-colors:active) {
  html body:has(#member-auth-title) :is(dialog.member-passwordless-r360,#ht-workspace-surface > dialog.member-passwordless-r360)[data-mode=otp] .member-code-field>input {
    background:Canvas!important;color:CanvasText!important;border-color:ButtonBorder!important;box-shadow:none!important;
  }
  html body:has(#member-auth-title) #ht-workspace-surface > dialog.member-passwordless-r360[data-mode=login] #ht-contact-launcher-r324 {
    background:ButtonFace!important;color:ButtonText!important;border-color:ButtonBorder!important;box-shadow:none!important;
  }
}

/* Cancel inherited flex growth on entry/OTP; existing Profile keeps its page. */
html body:has(#member-auth-title) :is(dialog.member-passwordless-r360,#ht-workspace-surface > dialog.member-passwordless-r360):is([data-mode=login],[data-mode=otp]) {flex:0 0 auto!important;}
/* Match the real inline support path; outrank its older three-ID40px rule. */
html body.workspace-page-r290[data-workspace-page=profile][data-ui-layout]:has(#member-auth-title) #ht-workspace-surface > dialog.member-auth.member-passwordless-r360.ht-workspace-inline-r290[data-mode=login] > .ht-profile-actions-r330 > #ht-contact-launcher-r324 {
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;
  width:100%!important;max-width:400px!important;min-width:0!important;min-height:44px!important;height:44px!important;
  box-sizing:border-box!important;margin:0!important;padding:9px 12px!important;
  border:1px solid #416a81!important;border-radius:12px!important;background:#123448!important;color:#b5d0e0!important;
  box-shadow:none!important;font-size:13px!important;
}
@media(forced-colors:active){
  html body.workspace-page-r290[data-workspace-page=profile][data-ui-layout]:has(#member-auth-title) #ht-workspace-surface > dialog.member-auth.member-passwordless-r360.ht-workspace-inline-r290[data-mode=login] > .ht-profile-actions-r330 > #ht-contact-launcher-r324 {
    background:ButtonFace!important;color:ButtonText!important;border-color:ButtonBorder!important;box-shadow:none!important;
  }
}

/* One common OTP reading width for form, Resend and Back on wide workspaces. */
html body.workspace-page-r290[data-workspace-page=profile][data-ui-layout]:has(#member-auth-title) #ht-workspace-surface > dialog.member-auth.member-passwordless-r360.ht-workspace-inline-r290[data-mode=otp]:has(#member-otp-hint-r360) > :is(form,.member-resend-code,.member-otp-back-r360) {
  box-sizing:border-box!important;width:100%!important;max-width:400px!important;min-width:0!important;margin-inline:auto!important;
}
