@layer components{--register-strength-gap:0.375rem;--register-strength-min-height:1.75rem;--register-strength-meter-width:120px;--register-strength-bar-height:3px;--register-strength-text-size:0.55rem;--register-passkey-gap:0.5rem;--register-passkey-margin-top:0.6rem;--register-passkey-padding-top:0.4rem;--register-passkey-btn-padding:0.6rem 0.3rem;--register-passkey-btn-font-size:0.7rem;--register-passkey-icon-size:20px;--register-error-padding:0.75rem;--register-error-border-width:3px;--register-input-mobile-padding:0.75rem 0.3rem 0.75rem 0.35rem;--register-transition-duration:var(--duration-200);--register-transition-type:var(--ease-out);--register-strength-transition:width var(--default-transition-duration) var(--default-transition-type),background var(--default-transition-duration) var(--default-transition-type)}@layer components{.password-strength{height:4px;margin-top:.5rem;visibility:hidden}.form-group:has(#registerPassword:not(:placeholder-shown)) .password-strength{visibility:visible}.strength-meter{background:var(--border,oklch(89% 0 0deg));border-radius:2px;height:4px;max-width:100%;overflow:hidden;width:100%}.strength-bar{border-radius:2px;height:100%;transition:width .3s ease,background .3s ease;width:0}.strength-text{display:none}.passkey-option{display:flex;flex-direction:column;gap:var(--register-passkey-gap);margin-top:var(--register-passkey-margin-top);padding-top:var(--register-passkey-padding-top)}.passkey-option.hidden{display:none}.passkey-option.loading .btn-passkey:not(.secondary){cursor:wait;opacity:.6}.btn-passkey{align-items:center;border-radius:.25rem;cursor:pointer;display:flex;font-size:var(--register-passkey-btn-font-size);gap:var(--register-passkey-gap);justify-content:center;padding:var(--register-passkey-btn-padding);width:100%}.btn-passkey:disabled{cursor:not-allowed;opacity:.6}.btn-passkey:active:not(:disabled){transform:scale(.98)}.btn-passkey svg{height:var(--register-passkey-icon-size);width:var(--register-passkey-icon-size)}.passkey-hint{text-align:center}.passkey-error{border-inline-start:var(--register-error-border-width) solid var(--error);border-radius:6px;display:none;margin-bottom:1rem;padding:var(--register-error-padding)}.passkey-error.visible{animation:slide-in .3s ease-out;display:block}@keyframes slide-in{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media(width < 768px){.form-input{padding:var(--register-input-mobile-padding)}}}@layer components{.strength-bar[data-strength=weak]{width:33%}.strength-bar[data-strength=fair]{width:66%}.strength-bar[data-strength=good]{width:100%}#registerPassword-hint{display:none}.strength-bar{background:transparent;transition:var(--register-strength-transition)}.btn-passkey{border:1px solid;transition:background-color var(--register-transition-duration) var(--register-transition-type),opacity var(--register-transition-duration) var(--register-transition-type)}@media(prefers-reduced-motion:reduce){.passkey-error.visible{animation:none}.btn-passkey{transition:none}}}@layer components{.strength-meter{background:var(--border,oklch(89% 0 0deg))}.strength-bar[data-strength=weak]{background:var(--error,oklch(54% .21 20deg))}.strength-bar[data-strength=fair]{background:var(--warning,oklch(82% .17 85deg))}.strength-bar[data-strength=good]{background:var(--success,oklch(62% .16 145deg))}.strength-text{color:var(--text3)}.strength-text[data-strength=weak]{color:var(--error)}.strength-text[data-strength=fair]{color:var(--warning)}.strength-text[data-strength=good]{color:var(--success)}.passkey-option{border-top:1px solid var(--border-light)}.btn-passkey{background-color:var(--text-on-brand);border-color:var(--text1);color:var(--text1)}.btn-passkey:hover:not(:disabled){background:var(--surface2);border-color:var(--text1)}.passkey-hint{color:var(--text-secondary)}.passkey-error{background-color:color-mix(in oklch,var(--error),transparent 90%);border-inline-start-color:var(--error);color:var(--error)}}@layer components{@media(width < 768px){.form-input{padding:var(--register-input-mobile-padding)}}@container auth-container (inline-size < 480px){.password-strength{align-items:stretch}}}@media(width < 768px){.register .form-group:has(.checkbox-label){margin-bottom:var(--space-3);margin-top:var(--space-1)}}