@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500;600;700&display=swap');
html body header,html body .app-nav,html body footer,html body #footer,html body .main-footer,html body .main-sidebar,html body .master-breadcrumb{display:none!important}
html,html body{min-height:100%;margin:0!important;background:var(--ui-block-bg,#fff)}
html body .main-body,html body .main-body>.container,html body .main-grid,html body .main-content{display:block!important;width:100%!important;max-width:none!important;min-height:0!important;margin:0!important;padding:0!important;float:none!important}
.cybAuthShell,.cybAuthShell *{box-sizing:border-box}
.cybAuthShell{
  /* Colors follow the active Lagom color scheme; hex values are fallbacks only. */
  --cyb-purple:var(--brand-primary,#6c40d4);--cyb-purple-hover:var(--brand-primary-darker,#5a34b3);--cyb-purple-soft:var(--brand-primary-lighter-4,#f8f6fd);
  --cyb-ink:var(--gray-darker,#17141c);--cyb-copy:var(--gray-lighter,#625d69);--cyb-muted:var(--gray-lighter-2,#837d8a);--cyb-placeholder:var(--gray-lighter-2,#948d9c);
  --cyb-border:var(--brand-primary-lighter-3,#ddd6e9);--cyb-border-strong:var(--brand-primary-lighter-2,#cdbce9);
  --cyb-bg:var(--ui-block-bg,#fff);--cyb-on-primary:#fff;
  --cyb-pattern:rgba(108,64,212,.055);--cyb-pattern:color-mix(in srgb,var(--cyb-purple) 6%,transparent);
  --cyb-sans:'Archivo',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--cyb-mono:'IBM Plex Mono',ui-monospace,'Courier New',monospace;
  position:fixed;z-index:10;inset:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  min-height:100vh;min-height:100dvh;overflow:hidden;background:var(--cyb-bg);color:var(--cyb-ink);font-family:var(--cyb-sans)
}
.cybAuthVisual{position:relative;min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--cyb-bg)}
.cybAuthVisualImg{width:min(96%,1400px);height:min(96vh,1400px);object-fit:contain;display:block;pointer-events:none;user-select:none}
/* Single-color SVG illustration tinted with the active color scheme:
   the SVG is used as a mask shape, the color comes from --brand-primary.
   Override --cyb-visual-color to use another theme color. */
.cybAuthVisualArt{--cyb-visual-color:var(--cyb-purple);background-color:var(--cyb-visual-color);-webkit-mask-image:var(--cyb-visual-src);mask-image:var(--cyb-visual-src);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}
.cybAuthFigure{position:absolute;left:30px;bottom:20px;display:flex;align-items:center;gap:9px;color:var(--cyb-muted);font:700 8px/1.3 var(--cyb-mono);letter-spacing:1.45px;white-space:nowrap}
.cybAuthFigure i{width:3px;height:3px;display:block;background:var(--cyb-purple)}
.cybAuthPanel{
  min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;overflow-y:auto;padding:36px;background-color:var(--cyb-bg);
  background-image:linear-gradient(45deg,transparent 49.45%,var(--cyb-pattern) 49.65%,var(--cyb-pattern) 50.35%,transparent 50.55%),linear-gradient(-45deg,transparent 49.45%,var(--cyb-pattern) 49.65%,var(--cyb-pattern) 50.35%,transparent 50.55%);
  background-size:48px 48px;scrollbar-width:thin;scrollbar-color:var(--cyb-border) transparent
}
.cybAuthPanel::-webkit-scrollbar{width:4px}.cybAuthPanel::-webkit-scrollbar-thumb{background:var(--cyb-border)}
.cybAuthCard{position:relative;width:100%;max-width:380px;display:flex;flex-direction:column;padding:40px 40px 30px;border:1px solid var(--cyb-border);background:var(--cyb-bg)}
.cybAuthCard::before,.cybAuthCard::after{content:'';position:absolute;width:13px;height:13px;pointer-events:none}
.cybAuthCard::before{top:-1px;left:-1px;border-top:2px solid var(--cyb-purple);border-left:2px solid var(--cyb-purple)}
.cybAuthCard::after{right:-1px;bottom:-1px;border-right:2px solid var(--cyb-purple);border-bottom:2px solid var(--cyb-purple)}
.cybAuthLogo,.cybAuthCard .login-header{min-height:44px;margin:0!important;padding:0!important;display:flex!important;align-items:center}
.cybAuthLogo .login-header{min-height:0}.cybAuthLogo .logo,.cybAuthLogo .logo-login,.cybAuthCard .login-header .logo,.cybAuthCard .login-header .logo-login{display:inline-flex!important;max-width:100%!important;margin:0!important;padding:0!important}
.cybAuthLogo img,.cybAuthCard .login-header img{width:auto!important;height:44px!important;max-width:205px!important;display:block!important;object-fit:contain!important;object-position:left center}
.cybAuthLogo .logo-text,.cybAuthCard .logo-text{color:var(--cyb-ink);font-size:21px;font-weight:800;text-decoration:none}
.cybAuthEyebrow,.cybAuthCard .login-desc{display:block!important;margin:54px 0 10px!important;padding:0!important;color:var(--cyb-purple)!important;font:700 9px/1.65 var(--cyb-mono)!important;letter-spacing:1.65px;text-transform:uppercase}
.cybAuthTitle,.cybAuthCard .login-title{margin:0 0 26px!important;padding:0!important;color:var(--cyb-ink)!important;font:800 27px/1.1 var(--cyb-sans)!important;letter-spacing:0!important}
.cybAuthForm{width:100%}.cybAuthField,.cybAuthCard .form-group{display:block!important;margin:0 0 20px!important;padding:0!important}
.cybAuthField label,.cybAuthCard .form-group label{display:block!important;margin:0 0 8px!important;color:var(--cyb-muted);font:700 9px/1.3 var(--cyb-mono);letter-spacing:1.35px;text-transform:uppercase}
.cybAuthField .form-control,.cybAuthCard .form-control{width:100%!important;height:49px!important;margin:0!important;padding:0 16px!important;border:1px solid var(--cyb-border-strong)!important;border-radius:0!important;outline:0;background:var(--cyb-bg)!important;box-shadow:none!important;color:var(--cyb-ink)!important;font:400 14px/1 var(--cyb-sans)!important}
.cybAuthField .form-control:focus,.cybAuthCard .form-control:focus{border-color:var(--cyb-purple)!important;box-shadow:0 0 0 3px var(--cyb-purple-soft)!important}
.cybAuthField .form-control::placeholder,.cybAuthCard .form-control::placeholder{color:var(--cyb-placeholder);opacity:1}
.cybAuthPasswordWrap{position:relative;display:flex}.cybAuthPasswordWrap .form-control{padding-right:48px!important}
.cybAuthReveal{position:absolute;top:1px;right:1px;bottom:1px;width:46px;display:grid;place-items:center;padding:0;border:0;background:var(--cyb-bg);color:var(--cyb-muted);cursor:pointer}
.cybAuthReveal:hover,.cybAuthReveal:focus-visible{color:var(--cyb-purple);outline:0}
.cybAuthOptions{min-height:28px;margin:-2px 0 25px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.cybAuthRemember{display:flex;align-items:center;gap:8px;margin:0;color:var(--cyb-copy);font-size:13px;font-weight:400;cursor:pointer}.cybAuthRemember input{width:16px;height:16px;margin:0;accent-color:var(--cyb-purple)}
.cybAuthForgot{color:var(--cyb-purple)!important;font-size:13px;font-weight:500;text-decoration:none;white-space:nowrap}.cybAuthForgot:hover{color:var(--cyb-purple-hover)!important}
.cybAuthCaptcha,.cybAuthReset .cybAuthCard .login-captcha{margin:0 0 20px}
.cybAuthSubmit,.cybAuthCard .btn-primary,.cybAuthCard .btn-block{position:relative;width:100%!important;min-height:48px!important;margin:0!important;padding:0 48px!important;display:inline-flex!important;align-items:center;justify-content:center;border:0!important;border-radius:0!important;background:var(--cyb-purple)!important;color:var(--cyb-on-primary)!important;box-shadow:none!important;clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%);cursor:pointer;font:800 11px/1 var(--cyb-mono)!important;letter-spacing:1.3px;text-transform:uppercase}
.cybAuthSubmit:hover,.cybAuthSubmit:focus-visible,.cybAuthCard .btn-primary:hover,.cybAuthCard .btn-primary:focus{background:var(--cyb-purple-hover)!important;color:var(--cyb-on-primary)!important;outline:0}
.cybAuthArrow{position:absolute;right:24px;font:500 16px/1 var(--cyb-sans)}
.cybAuthFooter,.cybAuthReturn,.cybAuthCard .login-footer{margin:32px 0 0!important;padding:0!important;color:var(--cyb-copy);font-size:13px;text-align:center}
.cybAuthFooter a,.cybAuthReturn a,.cybAuthCard .login-footer a{margin-left:4px;color:var(--cyb-purple);font-weight:700;text-decoration:none}
.cybAuthTrust{min-height:38px;margin-top:auto;padding-top:24px;display:flex;align-items:flex-end;justify-content:center;gap:14px;color:var(--cyb-muted);font:700 8px/1 var(--cyb-mono);letter-spacing:1.05px;white-space:nowrap}
.cybAuthTrust i{width:1px;height:12px;display:block;background:var(--cyb-border)}
.cybAuthAlert,.cybAuthCard .alert{margin:0 0 20px!important;border-radius:0!important;font-size:13px}
.cybAuthReset .cybAuthCard .login,.cybAuthReset .cybAuthCard .login-wrapper,.cybAuthReset .cybAuthCard .login-body{width:100%!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
.cybAuthReset .cybAuthCard .login-body{display:flex!important;flex-direction:column}.cybAuthReset .cybAuthCard .login-desc{order:-1}.cybAuthReset .cybAuthCard .login-footer{display:none!important}.cybAuthReset .cybAuthCard .login-title{margin-bottom:24px!important;font-size:25px!important;white-space:nowrap}.cybAuthReset .cybAuthReturn{margin-top:32px!important}
@media(max-height:760px) and (min-width:901px){.cybAuthPanel{padding:24px}.cybAuthCard{padding:30px 36px 24px}.cybAuthEyebrow,.cybAuthCard .login-desc{margin-top:32px!important}.cybAuthTrust{padding-top:18px}}
@media(max-width:900px){html,html body{overflow:auto!important}.cybAuthShell{position:relative;display:block;min-height:100vh;min-height:100dvh;overflow:visible}.cybAuthVisual{display:none}.cybAuthPanel{width:100%;align-items:flex-start;padding:32px 20px}.cybAuthCard{max-width:430px}}
@media(max-width:480px){.cybAuthPanel{align-items:flex-start;padding:16px 12px;background-size:38px 38px}.cybAuthCard{padding:28px 22px 22px}.cybAuthLogo,.cybAuthCard .login-header{min-height:42px}.cybAuthLogo img,.cybAuthCard .login-header img{height:42px!important;max-width:190px!important}.cybAuthEyebrow,.cybAuthCard .login-desc{margin-top:38px!important;font-size:8px!important;letter-spacing:1.35px}.cybAuthTitle,.cybAuthCard .login-title{font-size:25px!important}.cybAuthOptions{align-items:flex-start}.cybAuthRemember,.cybAuthForgot{font-size:12px}.cybAuthTrust{gap:10px;font-size:7px;letter-spacing:.75px}}
@media(max-width:350px){.cybAuthCard{padding-right:17px;padding-left:17px}.cybAuthOptions{flex-direction:column;gap:12px}.cybAuthTrust{white-space:normal}}
@media(prefers-reduced-motion:reduce){.cybAuthShell *{scroll-behavior:auto!important;transition:none!important}}

/* Registration uses the same visual language with a scrollable, wider form. */
.cybAuthRegister{position:relative;inset:auto;display:block;min-height:100vh;min-height:100dvh;overflow:visible}
.cybAuthRegister .cybAuthVisual{position:fixed;z-index:0;inset:0 auto 0 0;width:50%;height:100vh;height:100dvh}
.cybAuthRegister .cybAuthVisualImg{width:min(96%,1400px);height:min(96vh,1400px)}
.cybAuthRegister .cybAuthPanel{position:relative;z-index:1;width:50%;min-height:100vh;min-height:100dvh;margin-left:50%;padding:38px clamp(28px,4vw,72px);display:block;overflow:visible}
.cybAuthRegister .cybAuthCard{width:100%;max-width:580px;min-height:0;margin:0 auto;padding:40px 40px 32px}
.cybAuthRegister .cybAuthEyebrow{margin-top:46px!important}
.cybAuthRegister .cybAuthTitle{margin-bottom:28px!important}
.cybAuthRegister .loginForm{counter-reset:cyb-register-step}
.cybAuthRegister .section{margin:0 0 38px!important;padding:0!important}
.cybAuthRegister #containerNewUserSignup>.section:has(>.section-header),.cybAuthRegister #containerNewUserSecurity{counter-increment:cyb-register-step}
.cybAuthRegister .section-header,.cybAuthRegister #containerNewUserSecurity>.section-title{position:relative;min-height:38px;margin:0 0 24px!important;padding:0 0 0 42px!important;display:flex;flex-direction:column;justify-content:center;border:0!important}
.cybAuthRegister #containerNewUserSignup>.section:has(>.section-header)>.section-header::before,.cybAuthRegister #containerNewUserSecurity>.section-title::before{content:counter(cyb-register-step);position:absolute;left:0;top:2px;width:29px;height:29px;display:grid;place-items:center;border:1px solid var(--cyb-border-strong);background:var(--cyb-purple-soft);color:var(--cyb-purple);font:700 11px/1 var(--cyb-mono)}
.cybAuthRegister .section-title{color:var(--cyb-ink)!important;font:700 17px/1.2 var(--cyb-sans)!important;letter-spacing:0!important}
.cybAuthRegister .section-title small,.cybAuthRegister .section-desc{margin-top:4px!important;color:var(--cyb-copy)!important;font:400 12px/1.5 var(--cyb-sans)!important}
.cybAuthRegister .row{margin-right:-8px!important;margin-left:-8px!important}.cybAuthRegister .row>[class*=col-]{padding-right:8px!important;padding-left:8px!important}
.cybAuthRegister .form-group{margin-bottom:18px!important}.cybAuthRegister .form-control{height:48px!important}
.cybAuthRegister .input-group{width:100%}.cybAuthRegister .input-group .form-control{min-width:0}
.cybAuthRegister .intl-tel-input{width:100%}.cybAuthRegister .intl-tel-input .form-control{padding-left:96px!important}.cybAuthRegister .intl-tel-input .flag-container{height:100%}
.cybAuthRegister .password-content{margin:0!important}.cybAuthRegister .password-content-text{display:block;margin:7px 0 0;color:var(--cyb-copy);font-size:11px}
.cybAuthRegister .progress{height:4px;margin:7px 0!important;border-radius:0;background:var(--cyb-purple-soft)}
.cybAuthRegister .password-content-group>.generate-password,.cybResetPasswordGenerator .generate-password{min-height:38px;padding:0 16px!important;display:inline-flex;align-items:center;gap:8px;border:1px solid var(--cyb-ink)!important;border-radius:0!important;background:var(--cyb-bg)!important;color:var(--cyb-ink)!important;font:800 9px/1 var(--cyb-mono)!important;letter-spacing:1.1px;text-transform:uppercase;box-shadow:none!important}
.cybAuthRegister .password-content-group>.generate-password:hover,.cybResetPasswordGenerator .generate-password:hover{border-color:var(--cyb-purple)!important;color:var(--cyb-purple)!important;background:var(--cyb-purple-soft)!important}
.cybAuthRegister .checkbox label,.cybAuthRegister label.checkbox{display:flex!important;align-items:flex-start;gap:9px;color:var(--cyb-copy)!important;font:400 13px/1.55 var(--cyb-sans)!important;letter-spacing:0;text-transform:none}
.cybAuthRegister .checkbox input{flex:0 0 auto;width:17px;height:17px;margin:2px 0 0;accent-color:var(--cyb-purple)}
.cybAuthRegister .panel-switch{max-width:none!important;border:0!important;box-shadow:none!important}.cybAuthRegister .panel-switch .panel-body{padding:0!important}
.cybAuthRegister .form-actions{margin-top:24px}.cybAuthRegister .form-actions .btn{min-height:49px!important}
.cybAuthRegister .cybAuthFooter{margin-top:28px!important}.cybAuthRegister .cybAuthTrust{min-height:62px;margin-top:22px;border-top:1px solid var(--cyb-border)}
.cybAuthRegister .alert{border-radius:0!important}.cybAuthRegister .help-block{font-size:11px;line-height:1.5}

/* Keep native WHMCS CAPTCHA and remote-auth widgets usable inside narrow cards. */
.cybAuthShell .login-captcha,.cybAuthShell .captcha-container,.cybAuthShell #divDynamicRecaptcha{max-width:100%;margin-right:auto;margin-left:auto}
.cybAuthShell .captchaimage,.cybAuthShell .captchaimage .input-group{max-width:100%;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cybAuthShell .captchaimage img{max-width:100%;height:auto}.cybAuthShell .captchaimage .form-control{min-width:120px;flex:1}
.cybAuthShell .g-recaptcha,.cybAuthShell .h-captcha{max-width:100%;transform-origin:left top}
.cybAuthShell .linked-accounts,.cybAuthShell .provider-list,.cybAuthShell .social-media-login{max-width:100%;margin:20px 0}
.cybAuthShell .login-divider{margin:22px 0;display:flex;align-items:center;gap:10px;color:var(--cyb-muted);font-size:11px}.cybAuthShell .login-divider>span:first-child,.cybAuthShell .login-divider>span:last-child{height:1px;flex:1;background:var(--cyb-border)}
html body .modal-backdrop{z-index:1040!important}html body #modalGeneratePassword,html body .modal{z-index:1050!important}

.cybPasswordInputWrap{position:relative;display:block}.cybPasswordInputWrap .form-control{padding-right:48px!important}
.cybPasswordReveal{position:absolute;z-index:2;top:1px;right:1px;width:46px;height:46px;padding:0;border:0;background:var(--cyb-bg);color:var(--cyb-muted);display:grid;place-items:center;cursor:pointer}
.cybPasswordReveal:hover,.cybPasswordReveal:focus-visible{color:var(--cyb-purple);outline:0}
.cybRegisterPasswordMeta{margin:-11px -8px 0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.cybRegisterPasswordGenerator,.cybRegisterPasswordStrength{min-width:0;padding:0 8px}
.cybRegisterPasswordGenerator .password-content{margin:0!important}.cybRegisterPasswordStrength .progress{display:flex!important;width:100%!important;max-width:none!important;height:6px!important;margin:0 0 8px!important}.cybAuthShell .progress .progress-bar{height:100%;transition:width .2s ease,background-color .2s ease}
.cybRegisterPasswordStrength .password-content-text{margin:0!important;font-size:12px!important}

.cybAuthResetChange .cybAuthReturn{display:none!important}.cybAuthResetChange .cybAuthCard{max-width:400px}
.cybAuthResetChange .cybAuthCard .login-desc{margin-top:22px!important}.cybAuthResetChange .cybAuthCard .login-title{margin-bottom:24px!important;font-size:28px!important}
.cybResetPasswordGenerator{margin:-2px 0 24px}.cybResetPasswordGenerator .password-content{margin:0!important}
.cybPasswordChangeForm .form-group{margin-bottom:22px!important}.cybPasswordChangeForm .progress{height:6px;margin:8px 0 0!important;border-radius:0;background:var(--cyb-purple-soft)}
.cybStrengthHeading{margin:0 0 13px;color:var(--cyb-muted);font:700 9px/1.3 var(--cyb-mono);letter-spacing:1.35px;text-transform:uppercase}
.cybStrengthText{display:block;margin:7px 0 0;color:var(--cyb-copy);font-size:11px}
.cybPasswordTips{margin:16px 0 23px;padding:16px;border:1px solid var(--cyb-border);display:flex;flex-direction:column;gap:5px;color:var(--cyb-copy);font-size:11px;line-height:1.35}
.cybPasswordTips strong{margin-bottom:2px;font-size:11px}.cybPasswordTips strong i{margin-right:5px}
.cybResetSubmit{position:relative}.cybResetSubmit>i{position:absolute;z-index:2;top:50%;right:24px;transform:translateY(-50%);color:var(--cyb-border-strong);font-size:13px;pointer-events:none}

@media(max-width:900px){.cybAuthRegister .cybAuthVisual{display:none}.cybAuthRegister .cybAuthPanel{width:100%;min-height:100vh;margin-left:0;padding:24px 16px}.cybAuthRegister .cybAuthCard{max-width:620px;padding:34px 30px 28px}}
@media(max-width:600px){.cybAuthRegister .cybAuthPanel{padding:12px}.cybAuthRegister .cybAuthCard{padding:28px 22px 24px}.cybAuthRegister .row>[class*=col-]{flex:0 0 100%!important;max-width:100%!important}.cybAuthRegister .cybAuthEyebrow{margin-top:36px!important}.cybAuthRegister .section{margin-bottom:30px!important}.cybRegisterPasswordMeta{grid-template-columns:1fr;gap:28px;margin-top:-8px}.cybRegisterPasswordStrength .progress{margin-top:0!important}}
@media(max-width:350px){.cybAuthShell .g-recaptcha{transform:scale(.86);margin-bottom:-22px}}

/* iOS zooms focused form controls below 16px. Keep mobile forms stable. */
@media(max-width:900px){.cybAuthShell input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.cybAuthShell select,.cybAuthShell textarea,.cybAuthShell .form-control{font-size:16px!important}}

/* ---------- Submit spinner (core/styles/cybernet/assets/js/cybernet-auth.js) ---------- */
.cybAuthShell .loader-button{display:none!important}
.cybAuthShell button[type=submit],.cybAuthShell .cybBtnSpinWrap{position:relative}
.cybAuthShell .cybBtnSpinWrap{display:inline-block;vertical-align:middle}.cybAuthShell .cybBtnSpinWrapBlock{display:block;width:100%}
.cybAuthShell .cybSpinner{position:absolute;z-index:3;top:50%;left:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border:2px solid var(--cyb-on-primary);border-right-color:transparent;border-radius:50%;opacity:0;pointer-events:none;transition:opacity .15s ease}
.cybAuthShell .cybIsLoading{pointer-events:none;cursor:progress}
.cybAuthShell .cybIsLoading>.cybSpinner{opacity:1;animation:cybSpin .7s linear infinite}
.cybAuthShell button.cybIsLoading,.cybAuthShell input.cybIsLoading{color:transparent!important;background-image:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.2) 50%,transparent 70%)!important;background-size:250% 100%!important;animation:cybSweep 1.3s linear infinite}
.cybAuthShell button.cybIsLoading>:not(.cybSpinner){visibility:hidden}
@keyframes cybSpin{to{transform:rotate(360deg)}}
@keyframes cybSweep{from{background-position:150% 0}to{background-position:-150% 0}}

/* ---------- Two-factor challenge (core/pages/two-factor-challenge/default) ---------- */
.cybAuthShell .hidden{display:none!important}
.cybAuthLead{margin:-12px 0 24px;color:var(--cyb-copy);font-size:14px;line-height:1.6}
.cybAuthChallenge{margin:0 0 20px}
.cybAuthChallenge p{margin:0 0 12px;color:var(--cyb-copy);font-size:13px;line-height:1.6}
.cybAuthChallenge .form-group,.cybAuthChallenge .margin-bottom,.cybAuthChallenge>div{margin:0!important}
.cybAuthChallenge input[name=key],.cybAuthChallenge input[type=text]:not([name=twofabackupcode]),.cybAuthChallenge input[type=number]{height:56px!important;text-align:center;font:600 22px/1 var(--cyb-mono)!important;letter-spacing:.45em;padding-left:calc(16px + .45em)!important}
/* The 2FA module's challenge ships its own submit button (WHMCS "Time Based
   Tokens"); the page has its own styled one, so the module's is hidden to keep
   a single LOGIN button. */
.cybAuthChallenge button,.cybAuthChallenge [type=submit],.cybAuthChallenge .btn{display:none!important}

/* Six digit boxes for the authenticator code. Built by the page script from
   the module's own field, which stays in the form (hidden) and keeps the
   value, so the form still posts the same input when JavaScript is off. */
.cybOtpSource{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;border:0!important;opacity:0!important;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);pointer-events:none}
.cybAuthChallenge.is-empty{display:none!important}
.cybOtp{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:0 0 20px}
.cybOtp input{width:100%!important;height:56px!important;min-width:0;margin:0!important;padding:0!important;border:1px solid var(--cyb-border-strong)!important;border-radius:0!important;outline:0;background:var(--cyb-bg)!important;box-shadow:none!important;color:var(--cyb-ink)!important;text-align:center;font:600 22px/1 var(--cyb-mono)!important;letter-spacing:0!important;-moz-appearance:textfield}
.cybOtp input::-webkit-outer-spin-button,.cybOtp input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.cybOtp input:focus{border-color:var(--cyb-purple)!important;box-shadow:0 0 0 3px var(--cyb-purple-soft)!important}
.cybOtp input.is-filled{border-color:var(--cyb-purple)!important}
@media(max-width:400px){.cybOtp{gap:6px}.cybOtp input{height:48px!important;font-size:19px!important}}
.cybAuthTwoFactor .alert{margin-top:-8px!important}
.cybAuthSecondary{display:flex;align-items:center;justify-content:center;min-height:46px;margin-top:12px;border:1px solid var(--cyb-border-strong);background:var(--cyb-bg);color:var(--cyb-ink)!important;font:700 11px/1 var(--cyb-mono);letter-spacing:1.3px;text-transform:uppercase;text-decoration:none!important}
.cybAuthSecondary:hover,.cybAuthSecondary:focus-visible{border-color:var(--cyb-purple);color:var(--cyb-purple)!important;outline:0}
.cybAuthTwoFactor .cybAuthFooter{margin-top:28px!important}
@media(prefers-reduced-motion:reduce){.cybAuthShell .cybIsLoading>.cybSpinner{animation-duration:1.6s}.cybAuthShell button.cybIsLoading,.cybAuthShell input.cybIsLoading{animation:none}}