html.lng-auth-root,
html.lng-auth-root * { box-sizing: border-box; }

html.lng-auth-root body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.65;
}

html.lng-auth-root a { color: inherit; text-decoration: none; }
html.lng-auth-root button,
html.lng-auth-root input { font: inherit; }
.lng-auth-page .screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.lng-auth-page .skip-link:focus { position: fixed; z-index: 99999; top: 12px; left: 12px; width: auto; height: auto; padding: 10px 14px; clip: auto; background: #fff; color: #001a70; }

html.lng-auth-root {
  height: 100%;
  overflow: hidden;
}

body.lng-auth-page {
  min-width: 320px;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  background: #e8f1f8;
  color: #071638;
}

body.lng-auth-page.admin-bar {
  height: calc(100% - 32px);
}

.lng-auth-page #wpadminbar {
  position: fixed;
}

.lng-auth-layout {
  display: grid;
  grid-template-columns: minmax(520px, .93fr) minmax(520px, 1.07fr);
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  background: #fff;
}

.lng-auth-panel {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  min-height: 0;
  overflow: hidden;
  padding: clamp(24px, 4vh, 48px) clamp(38px, 5vw, 82px);
  background: #fff;
}

.lng-auth-panel__inner {
  width: min(100%, 540px);
  margin-block: auto;
}

.lng-auth-embed {
  width: min(100%, 620px);
  margin: 24px auto;
  padding: clamp(24px, 5vw, 48px);
  border: 1px solid #dce5f1;
  border-radius: 24px;
  background: #fff;
  color: #071638;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.65;
  box-shadow: 0 20px 55px rgba(0, 26, 112, .1);
}

.lng-auth-embed,
.lng-auth-embed * {
  box-sizing: border-box;
}

.lng-auth-embed a {
  color: inherit;
}

.lng-auth-embed button,
.lng-auth-embed input {
  font: inherit;
}

.lng-auth-embed .lng-auth-panel__inner {
  margin: 0 auto;
}

.lng-auth-brand {
  display: flex;
  justify-content: center;
  margin-bottom: clamp(22px, 3.5vh, 38px);
}

.lng-auth-brand a {
  display: inline-flex;
}

.lng-auth-brand img,
.lng-auth-brand .custom-logo {
  display: block;
  width: auto;
  max-width: min(420px, 100%);
  height: 100px;
  object-fit: contain;
  object-position: center;
}

.lng-auth-tabs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 4px;
  margin-bottom: 38px;
  padding: 5px;
  border-radius: 999px;
  background: #f0f2f5;
}

.lng-auth-tabs a,
.lng-auth-tabs span {
  display: flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  padding: 8px 18px;
  border-radius: 999px;
  color: #5c6779;
  font-weight: 750;
  text-align: center;
  transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}

.lng-auth-tabs a:hover {
  color: #001a70;
}

.lng-auth-tabs a.is-active {
  background: #fff;
  color: #001a70;
  box-shadow: 0 3px 10px rgba(7, 22, 56, .1);
}

.lng-auth-tabs span[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: .5;
}

.lng-auth-heading {
  margin-bottom: 30px;
  text-align: center;
}

.lng-auth-eyebrow {
  margin: 0 0 8px;
  color: #0872bd;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.lng-auth-heading h1,
.lng-auth-visual h2 {
  margin: 0;
  color: #001a70;
  font-size: clamp(2rem, 4vw, 2.65rem);
  letter-spacing: -.045em;
  line-height: 1.08;
}

.lng-auth-heading > p:last-child {
  max-width: 470px;
  margin: 10px 0 0;
  color: #5c6779;
  line-height: 1.55;
  margin-inline: auto;
}

.lng-auth-form {
  text-align: left;
}

.lng-auth-field {
  margin: 0 0 18px;
}

.lng-auth-field > label {
  display: block;
  margin: 0 0 7px 18px;
  color: #727e92;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.lng-auth-form input[type="text"],
.lng-auth-form input[type="email"],
.lng-auth-form input[type="password"],
.lng-auth-form input[type="url"] {
  width: 100%;
  min-height: 62px;
  padding: 13px 22px;
  border: 1px solid #dbe2ea;
  border-radius: 999px;
  background: #fff;
  color: #071638;
  font-size: 1rem;
  line-height: 1.3;
  box-shadow: none;
  transition: border-color .2s ease, box-shadow .2s ease;
}

.lng-auth-form input:focus {
  border-color: #0872bd;
  outline: 0;
  box-shadow: 0 0 0 4px rgba(0, 102, 204, .12);
}

.lng-auth-password {
  position: relative;
}

.lng-auth-password input {
  padding-right: 64px;
}

.lng-auth-password__toggle {
  position: absolute;
  top: 50%;
  right: 14px;
  display: inline-flex;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #8a95a7;
  cursor: pointer;
  transform: translateY(-50%);
}

.lng-auth-password__toggle:hover,
.lng-auth-password__toggle:focus-visible {
  background: #eef6fc;
  color: #0066cc;
}

.lng-auth-password__toggle svg {
  width: 20px;
  height: 20px;
}

.lng-auth-password__toggle.is-visible svg {
  opacity: .55;
}

.lng-auth-form__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 2px 4px 20px;
}

.lng-auth-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  color: #263754;
  font-size: .95rem;
  font-weight: 600;
}

.lng-auth-checkbox a,
.lng-auth-form__row a {
  color: #001a70;
  font-weight: 650;
}

.lng-auth-privacy {
  margin: 4px 4px 18px;
  line-height: 1.5;
}

.lng-auth-form input[type="checkbox"] {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 2px 0 0;
  accent-color: #0872bd;
}

.lng-auth-button {
  display: inline-flex;
  width: 100%;
  min-height: 58px;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  border: 1px solid #0872bd;
  border-radius: 999px;
  background: #0872bd;
  color: #fff;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  cursor: pointer;
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}

.lng-auth-button:hover,
.lng-auth-button:focus-visible {
  transform: translateY(-1px);
  border-color: #001a70;
  background: #001a70;
  color: #fff;
  box-shadow: 0 12px 28px rgba(0, 26, 112, .2);
}

.lng-auth-notice {
  margin: 0 0 20px;
  padding: 13px 16px;
  border: 1px solid #f1c0c0;
  border-left: 4px solid #c53030;
  border-radius: 10px;
  background: #fff7f7;
  color: #712626;
  list-style: none;
}

.lng-auth-notice.is-success {
  border-color: #b5d9c5;
  border-left-color: #198754;
  background: #f4fbf7;
  color: #155b38;
}

.lng-auth-field small {
  display: block;
  margin: 8px 0 0;
  color: #707c90;
  font-size: .82rem;
  line-height: 1.5;
}

.lng-auth-divider {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 22px 0;
  color: #7a8597;
  font-size: .78rem;
  text-transform: uppercase;
}

.lng-auth-divider::before,
.lng-auth-divider::after {
  flex: 1;
  height: 1px;
  background: #dbe5ee;
  content: "";
}

.lng-auth-social-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.lng-auth-social-button {
  display: flex;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 9px 13px;
  border: 1px solid #d8e0e8;
  border-radius: 999px;
  background: #fff;
  color: #17233d;
  font-size: .88rem;
  font-weight: 750;
  line-height: 1.2;
  text-align: center;
  box-shadow: 0 3px 10px rgba(7, 22, 56, .05);
}

.lng-auth-social-button:hover,
.lng-auth-social-button:focus-visible {
  border-color: #9ab6cf;
  color: #001a70;
  box-shadow: 0 8px 20px rgba(7, 22, 56, .1);
}

.lng-auth-social-button svg {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
}

.lng-auth-support-links {
  display: flex;
  justify-content: flex-end;
  margin-top: -8px;
}

.lng-auth-support-links.is-centered {
  justify-content: center;
  margin-top: 18px;
}

.lng-auth-support-links a,
.lng-auth-footer-links a {
  color: #001a70;
  font-size: .92rem;
  font-weight: 650;
}

.lng-auth-support-links a:hover,
.lng-auth-footer-links a:hover {
  color: #0872bd;
  text-decoration: underline;
}

.lng-auth-magic {
  margin-top: 24px;
  border: 1px solid #dbe5ee;
  border-radius: 18px;
  background: #f8fbfd;
}

.lng-auth-magic summary {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 15px 17px;
  color: #001a70;
  cursor: pointer;
  list-style: none;
}

.lng-auth-magic summary::-webkit-details-marker {
  display: none;
}

.lng-auth-magic summary strong,
.lng-auth-magic summary small {
  display: block;
}

.lng-auth-magic summary small {
  margin-top: 2px;
  color: #6c788b;
  font-size: .76rem;
  font-weight: 500;
}

.lng-auth-magic__icon {
  display: inline-flex;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #e5f3fc;
  color: #0872bd;
}

.lng-auth-magic__icon svg {
  width: 19px;
  height: 19px;
}

.lng-auth-magic__chevron {
  font-size: 1.3rem;
  transition: transform .2s ease;
}

.lng-auth-magic[open] .lng-auth-magic__chevron {
  transform: rotate(180deg);
}

.lng-auth-magic__form {
  padding: 18px 17px;
  border-top: 1px solid #e4ebf1;
}

.lng-auth-recaptcha {
  max-width: 100%;
  margin: 16px 0;
  overflow-x: auto;
}

.lng-auth-assurance {
  display: flex;
  gap: 9px;
  margin: 26px 0 0;
  color: #7a8597;
  font-size: .78rem;
  line-height: 1.5;
}

.lng-auth-assurance svg {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin-top: 1px;
  color: #0872bd;
}

.lng-auth-footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  margin-top: 30px;
  padding-top: 20px;
  border-top: 1px solid #e8edf2;
}

.lng-auth-footer-links a {
  font-size: .8rem;
}

.lng-auth-visual {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100%;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: clamp(48px, 7vw, 110px);
  background:
    repeating-linear-gradient(100deg, transparent 0, transparent 79px, rgba(255, 255, 255, .56) 80px, rgba(255, 255, 255, .56) 81px),
    linear-gradient(145deg, #e4f1fb 0%, #c6deef 58%, #aacde5 100%);
}

.lng-auth-visual::before,
.lng-auth-visual::after {
  position: absolute;
  content: "";
  border: 1px solid rgba(255, 255, 255, .62);
  border-radius: 50%;
}

.lng-auth-visual::before {
  top: -190px;
  right: -130px;
  width: 480px;
  height: 480px;
}

.lng-auth-visual::after {
  bottom: -250px;
  left: -190px;
  width: 600px;
  height: 600px;
}

.lng-auth-visual__glow {
  position: absolute;
  top: 14%;
  left: 18%;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .42);
  filter: blur(80px);
}

.lng-auth-shield {
  position: relative;
  z-index: 2;
  display: flex;
  width: clamp(150px, 15vw, 210px);
  height: clamp(150px, 15vw, 210px);
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, .92);
  border-radius: 36px;
  background: rgba(255, 255, 255, .92);
  color: #0872bd;
  box-shadow: 0 32px 48px rgba(0, 42, 88, .17);
}

.lng-auth-shield::after {
  position: absolute;
  bottom: -28px;
  left: 18%;
  width: 64%;
  height: 30px;
  border-radius: 50%;
  background: rgba(0, 61, 112, .15);
  filter: blur(18px);
  content: "";
}

.lng-auth-shield svg {
  width: 48%;
  height: 48%;
}

.lng-auth-visual__copy {
  position: relative;
  z-index: 2;
  width: min(100%, 570px);
  margin-top: clamp(24px, 5vh, 52px);
  padding: 30px 34px;
  border: 1px solid rgba(255, 255, 255, .68);
  border-radius: 24px;
  background: rgba(255, 255, 255, .34);
  backdrop-filter: blur(12px);
}

.lng-auth-visual h2 {
  max-width: 460px;
  font-size: clamp(1.9rem, 3.3vw, 3rem);
}

.lng-auth-visual__text p {
  margin: 14px 0 0;
  color: #334c67;
  line-height: 1.6;
}

.lng-auth-visual__text p + p {
  margin-top: 10px;
}

.lng-auth-visual ul {
  display: grid;
  gap: 8px;
  margin: 22px 0 0;
  padding: 0;
  color: #173b5d;
  font-size: .9rem;
  font-weight: 650;
  list-style: none;
}

.lng-auth-visual li {
  display: flex;
  gap: 9px;
}

.lng-auth-visual li span {
  color: #0872bd;
}

@media (max-width: 1120px) {
  .lng-auth-layout {
    grid-template-columns: minmax(480px, 1fr) minmax(380px, .8fr);
  }

  .lng-auth-panel,
  .lng-auth-visual {
    padding-inline: 48px;
  }
}

@media (max-height: 900px) and (min-width: 861px) {
  .lng-auth-panel {
    padding-block: 14px;
  }

  .lng-auth-brand {
    margin-bottom: 12px;
  }

  .lng-auth-tabs {
    margin-bottom: 18px;
  }

  .lng-auth-tabs a,
  .lng-auth-tabs span {
    min-height: 46px;
  }

  .lng-auth-heading {
    margin-bottom: 16px;
  }

  .lng-auth-heading h1 {
    font-size: clamp(1.8rem, 3.2vw, 2.25rem);
  }

  .lng-auth-heading > p:last-child {
    margin-top: 6px;
  }

  .lng-auth-field {
    margin-bottom: 11px;
  }

  .lng-auth-field > label {
    margin-bottom: 4px;
  }

  .lng-auth-form input[type="text"],
  .lng-auth-form input[type="email"],
  .lng-auth-form input[type="password"],
  .lng-auth-form input[type="url"] {
    min-height: 50px;
    padding-block: 9px;
  }

  .lng-auth-form__row {
    margin-bottom: 12px;
  }

  .lng-auth-button,
  .lng-auth-social-button {
    min-height: 50px;
  }

  .lng-auth-divider {
    margin-block: 12px;
  }

  .lng-auth-magic {
    margin-top: 12px;
  }

  .lng-auth-magic summary {
    padding-block: 10px;
  }

  .lng-auth-assurance {
    margin-top: 14px;
  }

  .lng-auth-layout.has-social-options .lng-auth-assurance {
    display: none;
  }

  .lng-auth-footer-links {
    margin-top: 12px;
    padding-top: 10px;
  }
}

@media (max-height: 760px) and (min-width: 861px) {
  .lng-auth-assurance {
    display: none;
  }

  .lng-auth-footer-links {
    margin-top: 8px;
    padding-top: 8px;
  }

  .lng-auth-layout.has-social-options .lng-auth-social-button {
    min-height: 44px;
    padding-block: 7px;
  }

  .lng-auth-layout.has-social-options .lng-auth-footer-links {
    display: none;
  }

  .lng-auth-visual__copy {
    margin-top: 18px;
    padding: 20px 24px;
  }

  .lng-auth-visual ul {
    margin-top: 12px;
  }
}

@media (max-width: 860px) {
  body.lng-auth-page,
  body.lng-auth-page.admin-bar {
    background: #fff;
  }

  .lng-auth-layout {
    display: block;
    height: 100%;
    min-height: 0;
  }

  .lng-auth-panel {
    height: 100%;
    min-height: 0;
    padding: 28px 24px;
  }

  .lng-auth-brand {
    margin-bottom: 24px;
  }

  .lng-auth-visual {
    display: none;
  }
}

@media (max-width: 782px) {
  body.lng-auth-page.admin-bar {
    height: calc(100% - 46px);
  }
}

@media (max-width: 480px) {
  .lng-auth-tabs {
    margin-bottom: 30px;
  }

  .lng-auth-tabs a,
  .lng-auth-tabs span {
    min-height: 48px;
  }

  .lng-auth-heading h1 {
    font-size: 2rem;
  }

  .lng-auth-form input[type="text"],
  .lng-auth-form input[type="email"],
  .lng-auth-form input[type="password"] {
    min-height: 56px;
  }

  .lng-auth-footer-links {
    display: grid;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lng-auth-page *,
  .lng-auth-page *::before,
  .lng-auth-page *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

/* Authenticator app: set-up QR code, recovery codes, link-style button. */
.lng-auth-totp-qr {
  width: 192px;
  max-width: 100%;
  margin: 0 auto 12px;
  padding: 8px;
  background: #fff;
  border: 1px solid #d5dfeb;
  border-radius: 12px;
}

.lng-auth-totp-qr svg { display: block; width: 100%; height: auto; }

.lng-auth-totp-key { margin: 0 0 18px; font-size: 13px; text-align: center; color: #50607a; }

.lng-auth-totp-key code,
.lng-auth-recovery-codes code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 14px;
  letter-spacing: 0.04em;
  color: #001a70;
  background: #eef3f9;
  padding: 2px 6px;
  border-radius: 6px;
}

.lng-auth-recovery-codes { margin: 0 0 18px; }

.lng-auth-recovery-codes ol {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 16px;
  margin: 12px 0 0;
  padding-left: 22px;
}

.lng-auth-link-button {
  padding: 0;
  border: 0;
  background: none;
  color: #0066cc;
  font: inherit;
  text-decoration: underline;
  cursor: pointer;
}

/* Six-digit code: one box per digit.
 *
 * The box rules carry three classes so they outrank the form's generic
 * .lng-auth-form input[type="text"] rule above. That rule is (0,2,1), not
 * (0,1,1) - an attribute selector counts in the class column - so a plain
 * two-class selector loses to it and the boxes inherit width:100%, a 62px
 * pill and 13px 22px of padding, which on a 45px box leaves no room at all
 * for the digit to render.
 */
.lng-auth-code { text-align: center; }

.lng-auth-code__label {
  display: block;
  margin: 0 0 10px;
  font-size: 14px;
  font-weight: 600;
  color: #50607a;
}

.lng-auth-code__boxes {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  gap: 8px;
  width: 100%;
  max-width: 300px;
  margin: 0 auto;
}

/* flex: 1 1 0 with min-width: 0 shares the capped row between the six boxes
 * whatever width a theme asks for, so they cannot stack or overflow. */
.lng-auth-code .lng-auth-code__boxes .lng-auth-code__box {
  flex: 1 1 0;
  width: auto;
  min-width: 0;
  height: 56px;
  min-height: 0;
  padding: 0;
  box-sizing: border-box;
  border: 1px solid #c8d6e6;
  border-radius: 10px;
  background: #fff;
  color: #071638;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  caret-color: #0066cc;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.lng-auth-code .lng-auth-code__boxes .lng-auth-code__box:focus {
  outline: none;
  border-color: #0066cc;
  box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.18);
}

@media (max-width: 420px) {
  .lng-auth-code__boxes { gap: 6px; max-width: 260px; }
  .lng-auth-code .lng-auth-code__boxes .lng-auth-code__box { height: 52px; font-size: 20px; }
}