Third naming convention uncovered: six shared-auth-ui components
(PasskeyManager, SessionManager, TwoFactorSetup, AuditLog,
ChangePassword, SecurityOnboarding) use --theme-muted, --theme-border,
etc. These tokens are not defined anywhere in the Mana theme system —
they only rendered because of inline raw-channel fallbacks, so they
never tracked the active theme variant.
Map to the canonical --color-* tokens:
--theme-background → --color-background
--theme-border → --color-border
--theme-foreground → --color-foreground
--theme-muted → --color-muted
--theme-muted-foreground → --color-muted-foreground
--theme-surface → --color-surface
Visible on the Security tab in the unified settings page, where the
inner passkey/session/2FA/audit cards can now pick up theme changes.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Add locale prop (de/en) to SessionManager with full English translations
- Extract duplicated parseUserAgent/getDeviceType to utils/userAgent.ts
- Fix hardcoded aria-label in SessionManager refresh button
- Add prefers-reduced-motion to PasskeyManager, TwoFactorSetup,
SessionExpiredBanner
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
1. Passkey Conditional UI: autocomplete="username webauthn" on email
field enables browser passkey suggestions in autofill dropdown
2. Trust Device checkbox: "Diesem Gerät 30 Tage vertrauen" option
during 2FA verification (uses Better Auth trust_device cookie)
3. Local QR code generation: replaced external api.qrserver.com with
local qrcode package for 2FA setup (no external dependency)
4. SecurityOnboarding component: post-registration wizard suggesting
passkey setup to new users
5. ChangePassword component: reusable password change form with
validation, visibility toggles, and changePassword() in authService
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
