.auth{justify-content:center;align-items:center;min-height:100dvh;padding:1.5rem;display:flex;position:relative}.auth__backdrop{z-index:-1;background:radial-gradient(120% 75% at 50% -15%, color-mix(in srgb, var(--color-brand-500) 9%, transparent), transparent 55%), repeating-linear-gradient(to bottom, transparent 0, transparent 31px, color-mix(in srgb, var(--color-ink) 4%, transparent) 31px, color-mix(in srgb, var(--color-ink) 4%, transparent) 32px), var(--color-canvas);position:fixed;inset:0}.auth__card{background:var(--color-surface);border:1px solid var(--color-line);width:400px;max-width:100%;box-shadow:0 1px 2px color-mix(in srgb, var(--color-ink) 5%, transparent), 0 12px 32px -12px color-mix(in srgb, var(--color-ink) 18%, transparent);border-radius:16px;flex-direction:column;gap:1.25rem;padding:2rem;display:flex}.auth__head{flex-direction:column;gap:.75rem;display:flex}.auth__logo{align-self:flex-start;width:auto;height:38px}.auth__accent{background:var(--color-brand-500);border-radius:2px;width:40px;height:2px}.auth__intro{flex-direction:column;gap:.125rem;display:flex}.auth__form{flex-direction:column;gap:.875rem;display:flex}.auth__error{border:1px solid color-mix(in srgb, var(--color-critical) 25%, transparent);background:var(--color-critical-surface);color:var(--color-critical);border-radius:8px;padding:.5rem .75rem;font-size:.8125rem}.auth__field{flex-direction:column;gap:.375rem;display:flex}.auth__label{letter-spacing:.02em;color:var(--color-ink-muted);font-size:.75rem;font-weight:600}.auth__input{border:1px solid var(--color-line-strong);background:var(--color-surface);width:100%;color:var(--color-ink);border-radius:10px;padding:.625rem .75rem;font-size:.875rem;transition:border-color .15s,box-shadow .15s}.auth__input::placeholder{color:var(--color-ink-faint)}.auth__input:focus{border-color:var(--color-brand-500);box-shadow:0 0 0 3px var(--color-brand-100);outline:none}.auth__password{align-items:center;display:flex;position:relative}.auth__password .auth__input{padding-right:2.5rem}.auth__toggle{width:2rem;height:2rem;color:var(--color-ink-faint);border-radius:8px;justify-content:center;align-items:center;transition:color .15s,background .15s;display:inline-flex;position:absolute;right:.25rem}.auth__toggle:hover{color:var(--color-ink-muted);background:var(--color-surface-muted)}.auth__toggle:focus-visible{color:var(--color-brand-600);box-shadow:0 0 0 2px var(--color-brand-100);outline:none}.auth__submit{background:var(--color-ink);color:#fff;border-radius:10px;justify-content:center;align-items:center;gap:.5rem;margin-top:.25rem;padding:.625rem .75rem;font-size:.875rem;font-weight:600;transition:background .15s,transform 50ms;display:inline-flex;position:relative}.auth__submit:hover{background:color-mix(in srgb, var(--color-ink) 88%, #fff)}.auth__submit:active{transform:translateY(1px)}.auth__submit:focus-visible{box-shadow:0 0 0 3px var(--color-brand-100);outline:none}.auth__submit:disabled{opacity:.75;cursor:default}.auth__spinner{border:2px solid #ffffff59;border-top-color:#fff;border-radius:50%;width:14px;height:14px;animation:.6s linear infinite auth-spin}.auth__code{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:.15em}.auth__alt{justify-content:space-between;gap:.75rem;display:flex}.auth__link{color:var(--color-ink-muted);text-underline-offset:2px;font-size:.8125rem;text-decoration:underline}.auth__link:hover{color:var(--color-ink)}.auth__foot{border-top:1px solid var(--color-line);color:var(--color-ink-faint);padding-top:.875rem;font-size:.75rem}.auth__foot .auth__firm{color:var(--color-ink-muted);font-weight:600}.auth__head,.auth__intro,.auth__form,.auth__foot{animation:.5s cubic-bezier(.22,1,.36,1) both auth-rise}.auth__intro{animation-delay:60ms}.auth__form{animation-delay:.12s}.auth__foot{animation-delay:.18s}@keyframes auth-rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes auth-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.auth__head,.auth__intro,.auth__form,.auth__foot,.auth__spinner{animation:none}}.auth__input--locked{background:var(--color-surface-muted);color:var(--color-ink-muted);cursor:default}.auth__input--locked:focus{border-color:var(--color-line-strong);box-shadow:none}.auth__hint{color:var(--color-ink-faint);font-size:.75rem}
