@burdenoff/microfe-auth 2026.624.3 → 2026.626.1

package/dist/auth/pages/UsersPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"UsersPage.js","names":[],"sources":["../../../src/auth/pages/UsersPage.tsx"],"sourcesContent":["import { useState, useEffect, useCallback, useId } from \"react\";\nimport { useNavigate } from \"react-router-dom\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell\";\nimport { useAuthPermissions } from \"../hooks/useAuthPermissions\";\nimport { useUserOperations } from \"../hooks/useUserOperations\";\nimport { useAuthStore } from \"../store/authStore\";\nimport { ConfirmActionDialog } from \"../components/ConfirmActionDialog\";\nimport type {\n  User,\n  UserRole,\n  UserStatus,\n  UserFilterInput,\n  PaginationInput,\n} from \"../types\";\nimport { SpinnerIcon, AlertIcon } from \"../components/AuthIcons\";\nimport { nativeImpact, nativeNotify } from \"../../utils/nativeBridge\";\n\ntype ViewMode = \"list\" | \"edit\" | \"view\";\n\ninterface FormData {\n  username: string;\n  firstName: string;\n  lastName: string;\n  name: string;\n  phoneNumber: string;\n  role: UserRole;\n  status: UserStatus;\n  emailVerified: boolean;\n}\n\n// SUPER_ADMIN is determined by email allowlist at runtime, not stored as a\n// DB role — filtering by it always returns 0 rows, so it is excluded here.\nconst USER_ROLES: UserRole[] = [\n  \"TENANT_ADMIN\",\n  \"ORG_ADMIN\",\n  \"WORKSPACE_ADMIN\",\n  \"MEMBER\",\n  \"GUEST\",\n];\n\nconst USER_STATUSES: UserStatus[] = [\n  \"ACTIVE\",\n  \"INACTIVE\",\n  \"SUSPENDED\",\n  \"DELETED\",\n];\n\n/**\n * Users CRUDL page for managing users (admin only)\n */\nexport function UsersPage() {\n  const navigate = useNavigate();\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const translated = t(key);\n    return translated === key ? fallback : translated;\n  };\n  const isAuthenticated = useAuthStore((state) => state.isAuthenticated);\n  const currentUser = useAuthStore((state) => state.user);\n  const {\n    canViewUsers,\n    canUpdateUsers,\n    canDeleteUsers,\n    isLoading: permissionsLoading,\n  } = useAuthPermissions();\n  const { listUsers, updateUser, deleteUser, hardDeleteUser, isLoading } =\n    useUserOperations();\n\n  // Stable IDs for ARIA associations (accessibility)\n  const searchId = useId();\n  const roleFilterId = useId();\n  const statusFilterId = useId();\n  const errorId = useId();\n  const successId = useId();\n\n  const [isExporting, setIsExporting] = useState(false);\n\n  const handleExport = async () => {\n    setIsExporting(true);\n    try {\n      const filter: UserFilterInput = {};\n      if (searchQuery) filter.search = searchQuery;\n      if (filterRole) filter.role = filterRole;\n      if (filterStatus) filter.status = filterStatus;\n\n      const result = await listUsers(filter, { offset: 0, limit: 10000 });\n      const rows = result.users;\n\n      const headers = [\n        \"ID\",\n        \"Email\",\n        \"Username\",\n        \"First Name\",\n        \"Last Name\",\n        \"Phone\",\n        \"Role\",\n        \"Status\",\n        \"Email Verified\",\n        \"MFA Enabled\",\n        \"Last Login\",\n        \"Created At\",\n      ];\n\n      const escape = (v: string | undefined | null) => {\n        if (v == null) return \"\";\n        const s = String(v);\n        return s.includes(\",\") || s.includes('\"') || s.includes(\"\\n\")\n          ? `\"${s.replace(/\"/g, '\"\"')}\"`\n          : s;\n      };\n\n      const lines = [\n        headers.join(\",\"),\n        ...rows.map((u) =>\n          [\n            escape(u.id),\n            escape(u.email),\n            escape(u.username),\n            escape(u.firstName),\n            escape(u.lastName),\n            escape(u.phoneNumber),\n            escape(u.role),\n            escape(u.status),\n            escape(String(u.emailVerified)),\n            escape(String(u.mfaEnabled)),\n            escape(u.lastLoginAt),\n            escape(u.createdAt),\n          ].join(\",\"),\n        ),\n      ];\n\n      const blob = new Blob([lines.join(\"\\n\")], {\n        type: \"text/csv;charset=utf-8;\",\n      });\n      const url = URL.createObjectURL(blob);\n      const a = document.createElement(\"a\");\n      a.href = url;\n      a.download = `users-${new Date().toISOString().slice(0, 10)}.csv`;\n      a.click();\n      URL.revokeObjectURL(url);\n    } catch (err) {\n      setError(err instanceof Error ? err.message : \"Failed to export users\");\n    } finally {\n      setIsExporting(false);\n    }\n  };\n\n  const [users, setUsers] = useState<User[]>([]);\n  const [totalCount, setTotalCount] = useState(0);\n  const [hasMore, setHasMore] = useState(false);\n  const [viewMode, setViewMode] = useState<ViewMode>(\"list\");\n  const [selectedUser, setSelectedUser] = useState<User | null>(null);\n  const [formData, setFormData] = useState<FormData>({\n    username: \"\",\n    firstName: \"\",\n    lastName: \"\",\n    name: \"\",\n    phoneNumber: \"\",\n    role: \"MEMBER\",\n    status: \"ACTIVE\",\n    emailVerified: false,\n  });\n  const [error, setError] = useState<string | null>(null);\n  const [isUnauthorized, setIsUnauthorized] = useState(false);\n  const [successMessage, setSuccessMessage] = useState<string | null>(null);\n  const [pendingAction, setPendingAction] = useState<{\n    type: \"deactivate\" | \"hard-delete\";\n    user: User;\n  } | null>(null);\n  const [searchQuery, setSearchQuery] = useState(\"\");\n  const [filterRole, setFilterRole] = useState<UserRole | \"\">(\"\");\n  const [filterStatus, setFilterStatus] = useState<UserStatus | \"\">(\"\");\n  const [currentPage, setCurrentPage] = useState(0);\n  const pageSize = 10;\n\n  const fetchUsers = useCallback(async () => {\n    if (!isAuthenticated) return;\n\n    try {\n      setIsUnauthorized(false);\n      const filter: UserFilterInput = {};\n      if (searchQuery) filter.search = searchQuery;\n      if (filterRole) filter.role = filterRole;\n      if (filterStatus) filter.status = filterStatus;\n\n      const pagination: PaginationInput = {\n        offset: currentPage * pageSize,\n        limit: pageSize,\n      };\n\n      const result = await listUsers(filter, pagination);\n      setUsers(result.users);\n      setTotalCount(result.totalCount);\n      setHasMore(result.hasMore);\n      setError(null);\n    } catch (err) {\n      // Ignore abort errors - they happen during component unmount/re-render\n      if (\n        err instanceof Error &&\n        (err.name === \"AbortError\" || err.message.includes(\"aborted\"))\n      ) {\n        return;\n      }\n      const errorMessage =\n        err instanceof Error ? err.message : \"Failed to fetch users\";\n      // Check if it's an authorization error\n      if (\n        errorMessage.toLowerCase().includes(\"not authorized\") ||\n        errorMessage.toLowerCase().includes(\"forbidden\")\n      ) {\n        setIsUnauthorized(true);\n        setError(null);\n      } else {\n        setError(errorMessage);\n      }\n    }\n  }, [\n    listUsers,\n    searchQuery,\n    filterRole,\n    filterStatus,\n    currentPage,\n    isAuthenticated,\n  ]);\n\n  useEffect(() => {\n    fetchUsers();\n  }, [fetchUsers]);\n\n  const resetForm = () => {\n    setFormData({\n      username: \"\",\n      firstName: \"\",\n      lastName: \"\",\n      name: \"\",\n      phoneNumber: \"\",\n      role: \"MEMBER\",\n      status: \"ACTIVE\",\n      emailVerified: false,\n    });\n    setSelectedUser(null);\n    setError(null);\n    setSuccessMessage(null);\n  };\n\n  const handleUpdate = async (e: React.FormEvent) => {\n    e.preventDefault();\n    if (!selectedUser) return;\n    setError(null);\n\n    try {\n      await updateUser(selectedUser.id, {\n        username: formData.username || undefined,\n        firstName: formData.firstName || undefined,\n        lastName: formData.lastName || undefined,\n        name: formData.name || undefined,\n        phoneNumber: formData.phoneNumber || undefined,\n        role: formData.role,\n        status: formData.status,\n        emailVerified: formData.emailVerified,\n      });\n      setSuccessMessage(\n        tr(\"auth.users.updateSuccess\", \"User updated successfully!\"),\n      );\n      setViewMode(\"list\");\n      resetForm();\n      fetchUsers();\n    } catch (err) {\n      setError(err instanceof Error ? err.message : \"Failed to update user\");\n    }\n  };\n\n  const handleDelete = async (user: User) => {\n    void nativeImpact(\"medium\");\n    try {\n      const result = await deleteUser(user.id);\n      if (result.success) {\n        void nativeNotify(\"success\");\n        setSuccessMessage(\n          tr(\n            \"auth.users.userDeactivated\",\n            `User \"${user.email}\" has been deactivated.`,\n          ),\n        );\n        setPendingAction(null);\n        fetchUsers();\n      } else {\n        void nativeNotify(\"error\");\n        setError(result.message);\n      }\n    } catch (err) {\n      void nativeNotify(\"error\");\n      setError(err instanceof Error ? err.message : \"Failed to delete user\");\n    }\n  };\n\n  const handleHardDelete = async (user: User) => {\n    try {\n      const result = await hardDeleteUser(user.id);\n      if (result.success) {\n        setSuccessMessage(\n          tr(\n            \"auth.users.userPermanentlyDeleted\",\n            `User \"${user.email}\" has been permanently deleted.`,\n          ),\n        );\n        setPendingAction(null);\n        fetchUsers();\n      } else {\n        setError(result.message);\n      }\n    } catch (err) {\n      setError(\n        err instanceof Error ? err.message : \"Failed to hard delete user\",\n      );\n    }\n  };\n\n  const startEdit = (user: User) => {\n    setSelectedUser(user);\n    setFormData({\n      username: user.username || \"\",\n      firstName: user.firstName || \"\",\n      lastName: user.lastName || \"\",\n      name: user.name || \"\",\n      phoneNumber: user.phoneNumber || \"\",\n      role: user.role,\n      status: user.status,\n      emailVerified: user.emailVerified,\n    });\n    setViewMode(\"edit\");\n    setError(null);\n  };\n\n  const pendingActionDialog = (\n    <ConfirmActionDialog\n      open={pendingAction !== null}\n      onOpenChange={(open) => {\n        if (!open) {\n          setPendingAction(null);\n        }\n      }}\n      title={\n        pendingAction?.type === \"hard-delete\"\n          ? tr(\"auth.users.hardDeleteTitle\", \"Permanently delete user?\")\n          : tr(\"auth.users.deactivateTitle\", \"Deactivate user?\")\n      }\n      description={\n        pendingAction?.type === \"hard-delete\"\n          ? pendingAction\n            ? tr(\n                \"auth.users.hardDeleteDesc\",\n                `This permanently deletes \"${pendingAction.user.email}\" and cannot be undone.`,\n              )\n            : \"\"\n          : pendingAction\n            ? tr(\n                \"auth.users.deactivateDesc\",\n                `\"${pendingAction.user.email}\" will be prevented from signing in until reactivated.`,\n              )\n            : \"\"\n      }\n      confirmText={\n        pendingAction?.type === \"hard-delete\"\n          ? tr(\"auth.users.hardDeleteConfirm\", \"Delete permanently\")\n          : tr(\"auth.users.deactivateConfirm\", \"Deactivate user\")\n      }\n      variant={pendingAction?.type === \"hard-delete\" ? \"danger\" : \"warning\"}\n      onConfirm={async () => {\n        if (!pendingAction) return;\n        if (pendingAction.type === \"hard-delete\") {\n          await handleHardDelete(pendingAction.user);\n          return;\n        }\n        await handleDelete(pendingAction.user);\n      }}\n    />\n  );\n\n  const getRoleColor = (role: UserRole) => {\n    switch (role) {\n      case \"SUPER_ADMIN\":\n        return \"bg-accent-purple-subtle text-accent-purple\";\n      case \"TENANT_ADMIN\":\n        return \"bg-status-info-bg-subtle text-status-info-text\";\n      case \"ORG_ADMIN\":\n        return \"bg-accent-indigo-subtle text-accent-indigo\";\n      case \"WORKSPACE_ADMIN\":\n        return \"bg-accent-cyan-subtle text-accent-cyan\";\n      case \"MEMBER\":\n        return \"bg-status-success-bg-subtle text-status-success-text\";\n      case \"GUEST\":\n        return \"bg-bg-sunken text-text-primary\";\n      default:\n        return \"bg-bg-sunken text-text-primary\";\n    }\n  };\n\n  const getStatusColor = (status: UserStatus) => {\n    switch (status) {\n      case \"ACTIVE\":\n        return \"bg-status-success-bg-subtle text-status-success-text\";\n      case \"INACTIVE\":\n        return \"bg-status-warning-bg-subtle text-status-warning-text\";\n      case \"SUSPENDED\":\n        return \"bg-status-warning-bg-subtle text-status-warning-text\";\n      case \"DELETED\":\n        return \"bg-status-error-bg-subtle text-status-error-text\";\n      default:\n        return \"bg-bg-sunken text-text-primary\";\n    }\n  };\n\n  // Authentication check\n  if (!isAuthenticated) {\n    return (\n      <div className=\"max-w-6xl mx-auto p-6\">\n        <div className=\"text-center py-16 border-2 border-dashed border-border-subtle rounded-xl\">\n          <div className=\"size-16 mx-auto mb-4 rounded-full bg-status-warning-bg-subtle flex items-center justify-center\">\n            <AlertIcon className=\"size-8 text-status-warning-text\" />\n          </div>\n          <h2 className=\"text-xl font-semibold text-text-primary mb-2\">\n            {tr(\"auth.users.authRequired\", \"Authentication Required\")}\n          </h2>\n          <p className=\"text-text-secondary\">\n            {tr(\"auth.users.signInToManage\", \"Please sign in to manage users\")}\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  // Loading permissions\n  if (permissionsLoading) {\n    return (\n      <div className=\"max-w-6xl mx-auto p-6\">\n        <div className=\"text-center py-16\">\n          <SpinnerIcon className=\"size-8 mx-auto text-text-secondary animate-spin\" />\n          <p className=\"mt-4 text-text-secondary\">\n            {tr(\"auth.users.loadingPermissions\", \"Loading permissions...\")}\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  // Authorization check - user needs user:read permission\n  if (!canViewUsers || isUnauthorized) {\n    return (\n      <div className=\"max-w-6xl mx-auto p-6\">\n        <div className=\"text-center py-16 border-2 border-dashed border-border-subtle rounded-xl\">\n          <div className=\"size-16 mx-auto mb-4 rounded-full bg-status-error-bg-subtle flex items-center justify-center\">\n            <svg\n              className=\"size-8 text-status-error-text\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={1.5}\n                d=\"M18.364 18.364A9 9 0 005.636 5.636m12.728 12.728A9 9 0 015.636 5.636m12.728 12.728L5.636 5.636\"\n              />\n            </svg>\n          </div>\n          <h2 className=\"text-xl font-semibold text-text-primary mb-2\">\n            {tr(\"auth.users.adminAccessRequired\", \"Admin Access Required\")}\n          </h2>\n          <p className=\"text-text-secondary mb-4\">\n            {tr(\n              \"auth.users.adminAccessDesc\",\n              \"You need administrator privileges to view and manage users.\",\n            )}\n          </p>\n          <p className=\"text-sm text-text-secondary\">\n            {tr(\n              \"auth.users.requiredRoles\",\n              \"Required roles: Super Admin, Tenant Admin, or Org Admin\",\n            )}\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  // List view\n  if (viewMode === \"list\") {\n    return (\n      <div className=\"max-w-6xl mx-auto p-6\">\n        {pendingActionDialog}\n        {/* Header */}\n        <div className=\"flex items-center justify-between mb-8\">\n          <div>\n            <h1 className=\"text-3xl font-semibold text-text-primary\">\n              {tr(\"auth.users.title\", \"Users\")}\n            </h1>\n            <p className=\"text-text-secondary mt-2\">\n              {tr(\"auth.users.subtitle\", \"Manage users in your organization\")} (\n              {totalCount} {tr(\"auth.users.paginationUsers\", \"total\")})\n            </p>\n          </div>\n          {/* Export button */}\n          <button\n            type=\"button\"\n            onClick={() => void handleExport()}\n            disabled={isExporting}\n            aria-label={tr(\"auth.users.exportAriaLabel\", \"Export user list\")}\n            className=\"flex items-center gap-2 px-4 py-2.5 rounded-xl border border-border-default text-text-primary bg-bg-surface hover:bg-bg-sunken disabled:opacity-50 disabled:cursor-not-allowed transition-colors font-medium\"\n          >\n            {isExporting ? (\n              <>\n                <SpinnerIcon\n                  className=\"size-4 animate-spin\"\n                  aria-hidden=\"true\"\n                />\n                {tr(\"auth.users.exporting\", \"Exporting...\")}\n              </>\n            ) : (\n              <>\n                <svg\n                  className=\"size-4\"\n                  fill=\"none\"\n                  viewBox=\"0 0 24 24\"\n                  stroke=\"currentColor\"\n                  aria-hidden=\"true\"\n                >\n                  <path\n                    strokeLinecap=\"round\"\n                    strokeLinejoin=\"round\"\n                    strokeWidth={2}\n                    d=\"M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4\"\n                  />\n                </svg>\n                {tr(\"auth.users.export\", \"Export\")}\n              </>\n            )}\n          </button>\n        </div>\n\n        {/* Live region for status announcements */}\n        <div aria-live=\"polite\" aria-atomic=\"true\" className=\"sr-only\">\n          {successMessage}\n        </div>\n        <div\n          role=\"alert\"\n          aria-live=\"assertive\"\n          aria-atomic=\"true\"\n          className=\"sr-only\"\n        >\n          {error}\n        </div>\n\n        {/* Success Message */}\n        {successMessage && (\n          <output\n            id={successId}\n            className=\"block mb-6 p-4 rounded-xl bg-status-success-bg-subtle border border-status-success-border\"\n          >\n            <p className=\"text-status-success-text\">{successMessage}</p>\n            <button\n              type=\"button\"\n              onClick={() => setSuccessMessage(null)}\n              className=\"mt-2 text-sm text-status-success-text hover:underline\"\n            >\n              {tr(\"auth.users.dismiss\", \"Dismiss\")}\n            </button>\n          </output>\n        )}\n\n        {/* Error Message */}\n        {error && (\n          <div\n            id={errorId}\n            role=\"alert\"\n            className=\"mb-6 flex items-start gap-3 p-4 rounded-xl bg-status-error-bg-subtle border border-status-error-border\"\n          >\n            <AlertIcon\n              className=\"size-5 text-status-error-text flex-shrink-0 mt-0.5\"\n              aria-hidden=\"true\"\n            />\n            <div className=\"flex-1\">\n              <p className=\"text-sm text-status-error-text\">{error}</p>\n              <button\n                type=\"button\"\n                onClick={() => setError(null)}\n                className=\"mt-2 text-sm text-status-error-text hover:underline\"\n              >\n                {tr(\"auth.users.dismiss\", \"Dismiss\")}\n              </button>\n            </div>\n          </div>\n        )}\n\n        {/* Filters */}\n        <div className=\"mb-6 p-4 rounded-xl border border-border-subtle bg-bg-surface\">\n          <div className=\"flex flex-wrap gap-4 items-end\">\n            {/* Visually hidden labels satisfy WCAG — placeholders are not labels */}\n            <div className=\"flex-1 min-w-[200px]\">\n              <label htmlFor={searchId} className=\"sr-only\">\n                {tr(\"auth.users.searchLabel\", \"Search users\")}\n              </label>\n              <input\n                id={searchId}\n                type=\"search\"\n                aria-label={tr(\"auth.users.searchLabel\", \"Search users\")}\n                placeholder={tr(\n                  \"auth.users.searchPlaceholder\",\n                  \"Search by email, username, or name...\",\n                )}\n                value={searchQuery}\n                onChange={(e) => {\n                  setSearchQuery(e.target.value);\n                  setCurrentPage(0);\n                }}\n                className=\"w-full px-4 py-2.5 border border-border-default rounded-xl bg-bg-surface text-text-primary placeholder-text-tertiary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              />\n            </div>\n            <div>\n              <label htmlFor={roleFilterId} className=\"sr-only\">\n                {tr(\"auth.users.filterRoleLabel\", \"Filter by role\")}\n              </label>\n              <select\n                id={roleFilterId}\n                value={filterRole}\n                onChange={(e) => {\n                  setFilterRole(e.target.value as UserRole | \"\");\n                  setCurrentPage(0);\n                }}\n                className=\"px-4 py-2.5 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              >\n                <option value=\"\">\n                  {tr(\"auth.users.allRoles\", \"All Roles\")}\n                </option>\n                {USER_ROLES.map((role) => (\n                  <option key={role} value={role}>\n                    {role.replace(\"_\", \" \")}\n                  </option>\n                ))}\n              </select>\n            </div>\n            <div>\n              <label htmlFor={statusFilterId} className=\"sr-only\">\n                {tr(\"auth.users.filterStatusLabel\", \"Filter by status\")}\n              </label>\n              <select\n                id={statusFilterId}\n                value={filterStatus}\n                onChange={(e) => {\n                  setFilterStatus(e.target.value as UserStatus | \"\");\n                  setCurrentPage(0);\n                }}\n                className=\"px-4 py-2.5 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              >\n                <option value=\"\">\n                  {tr(\"auth.users.allStatuses\", \"All Statuses\")}\n                </option>\n                {USER_STATUSES.map((status) => (\n                  <option key={status} value={status}>\n                    {status}\n                  </option>\n                ))}\n              </select>\n            </div>\n          </div>\n        </div>\n\n        {isLoading ? (\n          <div\n            aria-live=\"polite\"\n            aria-busy=\"true\"\n            className=\"flex items-center justify-center py-12\"\n          >\n            <SpinnerIcon\n              className=\"size-8 text-text-link animate-spin\"\n              aria-hidden=\"true\"\n            />\n            <span className=\"ml-3 text-text-secondary\">\n              {tr(\"auth.users.loadingUsers\", \"Loading users...\")}\n            </span>\n          </div>\n        ) : users.length === 0 ? (\n          <div className=\"text-center py-16 border-2 border-dashed border-border-subtle rounded-xl\">\n            <div className=\"size-16 mx-auto mb-4 rounded-full bg-bg-sunken flex items-center justify-center\">\n              <svg\n                className=\"size-8 text-text-tertiary\"\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                stroke=\"currentColor\"\n              >\n                <path\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  strokeWidth={1.5}\n                  d=\"M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z\"\n                />\n              </svg>\n            </div>\n            <p className=\"text-text-secondary\">\n              {tr(\"auth.users.noUsersFound\", \"No users found\")}\n            </p>\n          </div>\n        ) : (\n          <>\n            {/* Users Table */}\n            <div className=\"rounded-xl border border-border-subtle bg-bg-surface overflow-hidden shadow-sm\">\n              <div className=\"overflow-x-auto\">\n                <table\n                  className=\"w-full min-w-[800px]\"\n                  aria-label={tr(\"auth.users.tableAriaLabel\", \"Users table\")}\n                >\n                  <thead>\n                    <tr className=\"border-b border-border-subtle bg-bg-canvas\">\n                      <th\n                        scope=\"col\"\n                        className=\"text-left p-4 text-sm font-medium text-text-secondary w-[280px]\"\n                      >\n                        {tr(\"auth.users.columnUser\", \"User\")}\n                      </th>\n                      <th\n                        scope=\"col\"\n                        className=\"text-left p-4 text-sm font-medium text-text-secondary w-[130px]\"\n                      >\n                        {tr(\"auth.users.columnRole\", \"Role\")}\n                      </th>\n                      <th\n                        scope=\"col\"\n                        className=\"text-left p-4 text-sm font-medium text-text-secondary w-[100px]\"\n                      >\n                        {tr(\"auth.users.columnStatus\", \"Status\")}\n                      </th>\n                      <th\n                        scope=\"col\"\n                        className=\"text-left p-4 text-sm font-medium text-text-secondary w-[80px]\"\n                      >\n                        {tr(\"auth.users.columnVerified\", \"Verified\")}\n                      </th>\n                      <th\n                        scope=\"col\"\n                        className=\"text-left p-4 text-sm font-medium text-text-secondary w-[100px]\"\n                      >\n                        {tr(\"auth.users.columnLastLogin\", \"Last Login\")}\n                      </th>\n                      <th\n                        scope=\"col\"\n                        className=\"text-right p-4 text-sm font-medium text-text-secondary w-[180px]\"\n                      >\n                        {tr(\"auth.users.columnActions\", \"Actions\")}\n                      </th>\n                    </tr>\n                  </thead>\n                  <tbody>\n                    {users.map((user) => (\n                      <tr\n                        key={user.id}\n                        className=\"border-b border-border-subtle last:border-b-0 hover:bg-bg-sunken/50 transition-colors\"\n                      >\n                        <td className=\"p-4\">\n                          <div className=\"flex items-center gap-3 min-w-0\">\n                            <div className=\"auth-brand-badge flex size-10 shrink-0 items-center justify-center rounded-full font-medium\">\n                              {(user.name || user.username || user.email)\n                                .charAt(0)\n                                .toUpperCase()}\n                            </div>\n                            <div className=\"min-w-0 flex-1\">\n                              <p className=\"font-medium text-text-primary truncate\">\n                                {user.name || user.username}\n                              </p>\n                              <p className=\"text-sm text-text-secondary truncate\">\n                                {user.email}\n                              </p>\n                            </div>\n                          </div>\n                        </td>\n                        <td className=\"p-4\">\n                          <span\n                            className={`inline-block px-2.5 py-1 rounded-full text-xs font-medium whitespace-nowrap ${getRoleColor(user.role)}`}\n                          >\n                            {user.role.replace(\"_\", \" \")}\n                          </span>\n                        </td>\n                        <td className=\"p-4\">\n                          <span\n                            className={`inline-block px-2.5 py-1 rounded-full text-xs font-medium whitespace-nowrap ${getStatusColor(user.status)}`}\n                          >\n                            {user.status}\n                          </span>\n                        </td>\n                        <td className=\"p-4\">\n                          {user.emailVerified ? (\n                            <span className=\"inline-flex items-center gap-1 text-status-success-text whitespace-nowrap\">\n                              <svg\n                                className=\"size-4 flex-shrink-0\"\n                                fill=\"currentColor\"\n                                viewBox=\"0 0 20 20\"\n                              >\n                                <path\n                                  fillRule=\"evenodd\"\n                                  d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z\"\n                                  clipRule=\"evenodd\"\n                                />\n                              </svg>\n                              <span className=\"text-sm\">\n                                {tr(\"auth.users.verifiedYes\", \"Yes\")}\n                              </span>\n                            </span>\n                          ) : (\n                            <span className=\"inline-flex items-center gap-1 text-status-warning-text whitespace-nowrap\">\n                              <svg\n                                className=\"size-4 flex-shrink-0\"\n                                fill=\"currentColor\"\n                                viewBox=\"0 0 20 20\"\n                              >\n                                <path\n                                  fillRule=\"evenodd\"\n                                  d=\"M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z\"\n                                  clipRule=\"evenodd\"\n                                />\n                              </svg>\n                              <span className=\"text-sm\">\n                                {tr(\"auth.users.verifiedNo\", \"No\")}\n                              </span>\n                            </span>\n                          )}\n                        </td>\n                        <td className=\"p-4 text-sm text-text-secondary whitespace-nowrap\">\n                          {user.lastLoginAt\n                            ? new Date(user.lastLoginAt).toLocaleDateString()\n                            : tr(\"auth.users.lastLoginNever\", \"Never\")}\n                        </td>\n                        <td className=\"p-4\">\n                          <div className=\"flex justify-end gap-1.5 flex-nowrap\">\n                            <button\n                              type=\"button\"\n                              onClick={() => navigate(`/auth/users/${user.id}`)}\n                              aria-label={`${tr(\"auth.users.actionView\", \"View\")} ${user.name || user.username || user.email}`}\n                              className=\"px-2.5 py-1.5 rounded-lg text-xs font-medium border border-border-default text-text-primary bg-bg-surface hover:bg-bg-sunken transition-colors whitespace-nowrap flex-shrink-0\"\n                            >\n                              {tr(\"auth.users.actionView\", \"View\")}\n                            </button>\n                            {canUpdateUsers && (\n                              <button\n                                type=\"button\"\n                                onClick={() => startEdit(user)}\n                                aria-label={`${tr(\"auth.users.actionEdit\", \"Edit\")} ${user.name || user.username || user.email}`}\n                                className=\"px-2.5 py-1.5 rounded-lg text-xs font-medium border border-status-info-border text-text-link bg-bg-surface hover:bg-status-info-bg-subtle transition-colors whitespace-nowrap flex-shrink-0\"\n                              >\n                                {tr(\"auth.users.actionEdit\", \"Edit\")}\n                              </button>\n                            )}\n                            {canDeleteUsers && user.status !== \"DELETED\" && (\n                              <button\n                                type=\"button\"\n                                onClick={() =>\n                                  setPendingAction({ type: \"deactivate\", user })\n                                }\n                                aria-label={`${tr(\"auth.users.actionDelete\", \"Delete\")} ${user.name || user.username || user.email}`}\n                                className=\"px-2.5 py-1.5 rounded-lg text-xs font-medium border border-status-error-border text-status-error-text bg-bg-surface hover:bg-status-error-bg-subtle transition-colors whitespace-nowrap flex-shrink-0\"\n                              >\n                                {tr(\"auth.users.actionDelete\", \"Delete\")}\n                              </button>\n                            )}\n                          </div>\n                        </td>\n                      </tr>\n                    ))}\n                  </tbody>\n                </table>\n              </div>\n            </div>\n\n            {/* Pagination */}\n            <div className=\"mt-6 flex items-center justify-between\">\n              <p className=\"text-sm text-text-secondary\">\n                {tr(\"auth.users.showing\", \"Showing\")}{\" \"}\n                {currentPage * pageSize + 1} {tr(\"auth.users.to\", \"to\")}{\" \"}\n                {Math.min((currentPage + 1) * pageSize, totalCount)}{\" \"}\n                {tr(\"auth.users.of\", \"of\")} {totalCount}{\" \"}\n                {tr(\"auth.users.paginationUsers\", \"users\")}\n              </p>\n              <nav\n                aria-label={tr(\n                  \"auth.users.paginationAriaLabel\",\n                  \"User list pagination\",\n                )}\n              >\n                <div className=\"flex gap-2\">\n                  <button\n                    type=\"button\"\n                    onClick={() =>\n                      setCurrentPage((prev) => Math.max(0, prev - 1))\n                    }\n                    disabled={currentPage === 0}\n                    aria-label={tr(\n                      \"auth.users.previousPageAriaLabel\",\n                      \"Go to previous page\",\n                    )}\n                    className=\"px-4 py-2 rounded-lg border border-border-default text-text-primary bg-bg-surface disabled:opacity-50 disabled:cursor-not-allowed hover:bg-bg-sunken transition-colors\"\n                  >\n                    {tr(\"auth.users.previousPage\", \"Previous\")}\n                  </button>\n                  <button\n                    type=\"button\"\n                    onClick={() => setCurrentPage((prev) => prev + 1)}\n                    disabled={!hasMore}\n                    aria-label={tr(\n                      \"auth.users.nextPageAriaLabel\",\n                      \"Go to next page\",\n                    )}\n                    className=\"px-4 py-2 rounded-lg border border-border-default text-text-primary bg-bg-surface disabled:opacity-50 disabled:cursor-not-allowed hover:bg-bg-sunken transition-colors\"\n                  >\n                    {tr(\"auth.users.nextPage\", \"Next\")}\n                  </button>\n                </div>\n              </nav>\n            </div>\n          </>\n        )}\n      </div>\n    );\n  }\n\n  // View details\n  if (viewMode === \"view\" && selectedUser) {\n    return (\n      <div className=\"max-w-4xl mx-auto p-6\">\n        {pendingActionDialog}\n        <button\n          type=\"button\"\n          onClick={() => {\n            setViewMode(\"list\");\n            resetForm();\n          }}\n          className=\"mb-6 flex items-center gap-2 text-text-link hover:underline font-medium\"\n        >\n          <svg\n            className=\"size-4\"\n            fill=\"none\"\n            viewBox=\"0 0 24 24\"\n            stroke=\"currentColor\"\n          >\n            <path\n              strokeLinecap=\"round\"\n              strokeLinejoin=\"round\"\n              strokeWidth={2}\n              d=\"M10 19l-7-7m0 0l7-7m-7 7h18\"\n            />\n          </svg>\n          {tr(\"auth.users.backToUsers\", \"Back to Users\")}\n        </button>\n\n        <div className=\"p-6 rounded-xl border border-border-subtle bg-bg-surface shadow-sm\">\n          <div className=\"flex items-center gap-4 mb-8\">\n            <div className=\"auth-brand-badge flex size-20 items-center justify-center rounded-full text-3xl font-semibold\">\n              {(\n                selectedUser.name ||\n                selectedUser.username ||\n                selectedUser.email\n              )\n                .charAt(0)\n                .toUpperCase()}\n            </div>\n            <div>\n              <h1 className=\"text-2xl font-semibold text-text-primary\">\n                {selectedUser.name || selectedUser.username}\n              </h1>\n              <p className=\"text-text-secondary\">{selectedUser.email}</p>\n              <div className=\"flex items-center gap-2 mt-2\">\n                <span\n                  className={`px-2.5 py-1 rounded-full text-xs font-medium ${getRoleColor(selectedUser.role)}`}\n                >\n                  {selectedUser.role.replace(\"_\", \" \")}\n                </span>\n                <span\n                  className={`px-2.5 py-1 rounded-full text-xs font-medium ${getStatusColor(selectedUser.status)}`}\n                >\n                  {selectedUser.status}\n                </span>\n              </div>\n            </div>\n          </div>\n\n          <div className=\"grid grid-cols-2 gap-6\">\n            <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n              <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                {tr(\"auth.users.viewDetailsUsername\", \"Username\")}\n              </label>\n              <p className=\"text-text-primary font-medium\">\n                {selectedUser.username}\n              </p>\n            </div>\n\n            <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n              <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                {tr(\"auth.users.viewDetailsEmail\", \"Email\")}\n              </label>\n              <p className=\"text-text-primary font-medium\">\n                {selectedUser.email}\n              </p>\n            </div>\n\n            <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n              <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                {tr(\"auth.users.viewDetailsEmailVerified\", \"Email Verified\")}\n              </label>\n              <p className=\"text-text-primary font-medium\">\n                {selectedUser.emailVerified ? (\n                  <span className=\"text-status-success-text\">\n                    {tr(\"auth.users.verifiedYes\", \"Yes\")}\n                  </span>\n                ) : (\n                  <span className=\"text-status-warning-text\">\n                    {tr(\"auth.users.verifiedNo\", \"No\")}\n                  </span>\n                )}\n              </p>\n            </div>\n\n            <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n              <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                {tr(\"auth.users.viewDetailsMfaEnabled\", \"MFA Enabled\")}\n              </label>\n              <p className=\"text-text-primary font-medium\">\n                {selectedUser.mfaEnabled ? (\n                  <span className=\"text-status-success-text\">\n                    {tr(\"auth.users.verifiedYes\", \"Yes\")}\n                  </span>\n                ) : (\n                  <span className=\"text-text-secondary\">\n                    {tr(\"auth.users.verifiedNo\", \"No\")}\n                  </span>\n                )}\n              </p>\n            </div>\n\n            {selectedUser.phoneNumber && (\n              <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n                <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                  {tr(\"auth.users.viewDetailsPhoneNumber\", \"Phone Number\")}\n                </label>\n                <p className=\"text-text-primary font-medium\">\n                  {selectedUser.phoneNumber}\n                </p>\n              </div>\n            )}\n\n            <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n              <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                {tr(\"auth.users.viewDetailsLastLogin\", \"Last Login\")}\n              </label>\n              <p className=\"text-text-primary font-medium\">\n                {selectedUser.lastLoginAt\n                  ? new Date(selectedUser.lastLoginAt).toLocaleString()\n                  : tr(\"auth.users.lastLoginNever\", \"Never\")}\n              </p>\n            </div>\n\n            <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n              <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                {tr(\"auth.users.viewDetailsCreated\", \"Created\")}\n              </label>\n              <p className=\"text-text-primary font-medium\">\n                {new Date(selectedUser.createdAt).toLocaleString()}\n              </p>\n            </div>\n\n            <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n              <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                {tr(\"auth.users.viewDetailsLastUpdated\", \"Last Updated\")}\n              </label>\n              <p className=\"text-text-primary font-medium\">\n                {new Date(selectedUser.updatedAt).toLocaleString()}\n              </p>\n            </div>\n          </div>\n\n          <div className=\"mt-8 pt-6 border-t border-border-subtle flex gap-3\">\n            <button\n              type=\"button\"\n              onClick={() => startEdit(selectedUser)}\n              className=\"auth-primary-button px-4 py-2.5 font-medium\"\n            >\n              {tr(\"auth.users.editUser\", \"Edit User\")}\n            </button>\n            {selectedUser.status !== \"DELETED\" && (\n              <button\n                type=\"button\"\n                onClick={() =>\n                  setPendingAction({ type: \"deactivate\", user: selectedUser })\n                }\n                className=\"px-4 py-2.5 rounded-xl border border-status-error-border text-status-error-text font-medium hover:bg-status-error-bg-subtle transition-colors\"\n              >\n                {tr(\"auth.users.deleteUser\", \"Delete User\")}\n              </button>\n            )}\n            {canDeleteUsers &&\n              selectedUser.status === \"DELETED\" &&\n              currentUser?.role === \"SUPER_ADMIN\" && (\n                <button\n                  type=\"button\"\n                  onClick={() =>\n                    setPendingAction({\n                      type: \"hard-delete\",\n                      user: selectedUser,\n                    })\n                  }\n                  className=\"px-4 py-2.5 rounded-xl bg-status-error-bg text-white font-medium hover:bg-status-error-bg-hover transition-colors\"\n                >\n                  {tr(\"auth.users.permanentlyDelete\", \"Permanently Delete\")}\n                </button>\n              )}\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  // Edit form\n  return (\n    <div className=\"max-w-2xl mx-auto p-6\">\n      {pendingActionDialog}\n      <button\n        type=\"button\"\n        onClick={() => {\n          setViewMode(\"list\");\n          resetForm();\n        }}\n        className=\"mb-6 flex items-center gap-2 text-text-link hover:underline font-medium\"\n      >\n        <svg\n          className=\"size-4\"\n          fill=\"none\"\n          viewBox=\"0 0 24 24\"\n          stroke=\"currentColor\"\n        >\n          <path\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            strokeWidth={2}\n            d=\"M10 19l-7-7m0 0l7-7m-7 7h18\"\n          />\n        </svg>\n        {tr(\"auth.users.backToUsers\", \"Back to Users\")}\n      </button>\n\n      <div className=\"p-6 rounded-xl border border-border-subtle bg-bg-surface shadow-sm\">\n        <h1 className=\"text-2xl font-semibold text-text-primary mb-2\">\n          {tr(\"auth.users.editUser\", \"Edit User\")}\n        </h1>\n\n        {selectedUser && (\n          <p className=\"text-text-secondary mb-6\">\n            {tr(\"auth.users.editingUser\", \"Editing:\")}{\" \"}\n            <strong>{selectedUser.email}</strong>\n          </p>\n        )}\n\n        {error && (\n          <div className=\"mb-6 flex items-start gap-3 p-4 rounded-xl bg-status-error-bg-subtle border border-status-error-border\">\n            <AlertIcon className=\"size-5 text-status-error-text flex-shrink-0 mt-0.5\" />\n            <div className=\"flex-1\">\n              <p className=\"text-sm text-status-error-text\">{error}</p>\n            </div>\n          </div>\n        )}\n\n        <form\n          onSubmit={handleUpdate}\n          className=\"space-y-6\"\n          aria-describedby={error ? errorId : undefined}\n          noValidate\n        >\n          <div className=\"grid grid-cols-2 gap-4\">\n            <div>\n              <label\n                htmlFor=\"edit-username\"\n                className=\"block text-sm font-medium text-text-primary mb-2\"\n              >\n                {tr(\"auth.users.fieldUsername\", \"Username\")}\n              </label>\n              <input\n                id=\"edit-username\"\n                type=\"text\"\n                aria-label={tr(\"auth.users.fieldUsername\", \"Username\")}\n                value={formData.username}\n                onChange={(e) =>\n                  setFormData({ ...formData, username: e.target.value })\n                }\n                className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              />\n            </div>\n\n            <div>\n              <label\n                htmlFor=\"edit-name\"\n                className=\"block text-sm font-medium text-text-primary mb-2\"\n              >\n                {tr(\"auth.users.fieldName\", \"Name\")}\n              </label>\n              <input\n                id=\"edit-name\"\n                type=\"text\"\n                aria-label={tr(\"auth.users.fieldName\", \"Name\")}\n                value={formData.name}\n                onChange={(e) =>\n                  setFormData({ ...formData, name: e.target.value })\n                }\n                className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              />\n            </div>\n          </div>\n\n          <div className=\"grid grid-cols-2 gap-4\">\n            <div>\n              <label\n                htmlFor=\"edit-firstName\"\n                className=\"block text-sm font-medium text-text-primary mb-2\"\n              >\n                {tr(\"auth.users.fieldFirstName\", \"First Name\")}\n              </label>\n              <input\n                id=\"edit-firstName\"\n                type=\"text\"\n                aria-label={tr(\"auth.users.fieldFirstName\", \"First Name\")}\n                value={formData.firstName}\n                onChange={(e) =>\n                  setFormData({ ...formData, firstName: e.target.value })\n                }\n                className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              />\n            </div>\n\n            <div>\n              <label\n                htmlFor=\"edit-lastName\"\n                className=\"block text-sm font-medium text-text-primary mb-2\"\n              >\n                {tr(\"auth.users.fieldLastName\", \"Last Name\")}\n              </label>\n              <input\n                id=\"edit-lastName\"\n                type=\"text\"\n                aria-label={tr(\"auth.users.fieldLastName\", \"Last Name\")}\n                value={formData.lastName}\n                onChange={(e) =>\n                  setFormData({ ...formData, lastName: e.target.value })\n                }\n                className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              />\n            </div>\n          </div>\n\n          <div>\n            <label\n              htmlFor=\"edit-phoneNumber\"\n              className=\"block text-sm font-medium text-text-primary mb-2\"\n            >\n              {tr(\"auth.users.fieldPhoneNumber\", \"Phone Number\")}\n            </label>\n            <input\n              id=\"edit-phoneNumber\"\n              type=\"tel\"\n              aria-label={tr(\"auth.users.fieldPhoneNumber\", \"Phone Number\")}\n              value={formData.phoneNumber}\n              onChange={(e) =>\n                setFormData({ ...formData, phoneNumber: e.target.value })\n              }\n              className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n            />\n          </div>\n\n          <div className=\"grid grid-cols-2 gap-4\">\n            <div>\n              <label\n                htmlFor=\"edit-role\"\n                className=\"block text-sm font-medium text-text-primary mb-2\"\n              >\n                {tr(\"auth.users.fieldRole\", \"Role\")}\n              </label>\n              <select\n                id=\"edit-role\"\n                aria-label={tr(\"auth.users.fieldRole\", \"Role\")}\n                value={formData.role}\n                onChange={(e) =>\n                  setFormData({ ...formData, role: e.target.value as UserRole })\n                }\n                className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              >\n                {USER_ROLES.map((role) => (\n                  <option key={role} value={role}>\n                    {role.replace(\"_\", \" \")}\n                  </option>\n                ))}\n              </select>\n            </div>\n\n            <div>\n              <label\n                htmlFor=\"edit-status\"\n                className=\"block text-sm font-medium text-text-primary mb-2\"\n              >\n                {tr(\"auth.users.fieldStatus\", \"Status\")}\n              </label>\n              <select\n                id=\"edit-status\"\n                aria-label={tr(\"auth.users.fieldStatus\", \"Status\")}\n                value={formData.status}\n                onChange={(e) =>\n                  setFormData({\n                    ...formData,\n                    status: e.target.value as UserStatus,\n                  })\n                }\n                className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              >\n                {USER_STATUSES.map((status) => (\n                  <option key={status} value={status}>\n                    {status}\n                  </option>\n                ))}\n              </select>\n            </div>\n          </div>\n\n          <div className=\"flex items-center gap-3 p-4 rounded-xl bg-bg-canvas/50\">\n            <input\n              type=\"checkbox\"\n              id=\"emailVerified\"\n              checked={formData.emailVerified}\n              onChange={(e) =>\n                setFormData({ ...formData, emailVerified: e.target.checked })\n              }\n              className=\"size-5 rounded border-border-default text-text-link focus:ring-action-primary-bg\"\n            />\n            <label\n              htmlFor=\"emailVerified\"\n              className=\"text-sm font-medium text-text-primary\"\n            >\n              {tr(\"auth.users.fieldEmailVerified\", \"Email Verified\")}\n            </label>\n          </div>\n\n          <div className=\"flex gap-3 pt-4\">\n            <button\n              type=\"submit\"\n              disabled={isLoading}\n              className=\"auth-primary-button flex items-center gap-2 px-6 py-3 font-medium\"\n            >\n              {isLoading ? (\n                <>\n                  <SpinnerIcon className=\"size-4 animate-spin\" />\n                  {tr(\"auth.users.saving\", \"Saving...\")}\n                </>\n              ) : (\n                tr(\"auth.users.saveChanges\", \"Save Changes\")\n              )}\n            </button>\n            <button\n              type=\"button\"\n              onClick={() => {\n                setViewMode(\"list\");\n                resetForm();\n              }}\n              className=\"px-6 py-3 rounded-xl border border-border-default text-text-primary font-medium hover:bg-bg-sunken transition-colors\"\n            >\n              {tr(\"auth.users.cancel\", \"Cancel\")}\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"UsersPage.js","names":[],"sources":["../../../src/auth/pages/UsersPage.tsx"],"sourcesContent":["import { useState, useEffect, useCallback, useId } from \"react\";\nimport { useNavigate } from \"react-router-dom\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell\";\nimport { Button } from \"@burdenoff/fe-libs/button\";\nimport {\n  EmphasisPanel,\n  IllustratedEmptyState,\n  PagePurpose,\n  NextSteps,\n} from \"@burdenoff/fe-libs/ui\";\nimport { useAuthPermissions } from \"../hooks/useAuthPermissions\";\nimport { useUserOperations } from \"../hooks/useUserOperations\";\nimport { useAuthStore } from \"../store/authStore\";\nimport { ConfirmActionDialog } from \"../components/ConfirmActionDialog\";\nimport type {\n  User,\n  UserRole,\n  UserStatus,\n  UserFilterInput,\n  PaginationInput,\n} from \"../types\";\nimport { SpinnerIcon, AlertIcon } from \"../components/AuthIcons\";\nimport { nativeImpact, nativeNotify } from \"../../utils/nativeBridge\";\n\ntype ViewMode = \"list\" | \"edit\" | \"view\";\n\ninterface FormData {\n  username: string;\n  firstName: string;\n  lastName: string;\n  name: string;\n  phoneNumber: string;\n  role: UserRole;\n  status: UserStatus;\n  emailVerified: boolean;\n}\n\n// SUPER_ADMIN is determined by email allowlist at runtime, not stored as a\n// DB role — filtering by it always returns 0 rows, so it is excluded here.\nconst USER_ROLES: UserRole[] = [\n  \"TENANT_ADMIN\",\n  \"ORG_ADMIN\",\n  \"WORKSPACE_ADMIN\",\n  \"MEMBER\",\n  \"GUEST\",\n];\n\nconst USER_STATUSES: UserStatus[] = [\n  \"ACTIVE\",\n  \"INACTIVE\",\n  \"SUSPENDED\",\n  \"DELETED\",\n];\n\n/**\n * Users CRUDL page for managing users (admin only)\n */\nexport function UsersPage() {\n  const navigate = useNavigate();\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const translated = t(key);\n    return translated === key ? fallback : translated;\n  };\n  const isAuthenticated = useAuthStore((state) => state.isAuthenticated);\n  const currentUser = useAuthStore((state) => state.user);\n  const {\n    canViewUsers,\n    canUpdateUsers,\n    canDeleteUsers,\n    isLoading: permissionsLoading,\n  } = useAuthPermissions();\n  const { listUsers, updateUser, deleteUser, hardDeleteUser, isLoading } =\n    useUserOperations();\n\n  // Stable IDs for ARIA associations (accessibility)\n  const searchId = useId();\n  const roleFilterId = useId();\n  const statusFilterId = useId();\n  const errorId = useId();\n  const successId = useId();\n\n  const [isExporting, setIsExporting] = useState(false);\n\n  const handleExport = async () => {\n    setIsExporting(true);\n    try {\n      const filter: UserFilterInput = {};\n      if (searchQuery) filter.search = searchQuery;\n      if (filterRole) filter.role = filterRole;\n      if (filterStatus) filter.status = filterStatus;\n\n      const result = await listUsers(filter, { offset: 0, limit: 10000 });\n      const rows = result.users;\n\n      const headers = [\n        \"ID\",\n        \"Email\",\n        \"Username\",\n        \"First Name\",\n        \"Last Name\",\n        \"Phone\",\n        \"Role\",\n        \"Status\",\n        \"Email Verified\",\n        \"MFA Enabled\",\n        \"Last Login\",\n        \"Created At\",\n      ];\n\n      const escape = (v: string | undefined | null) => {\n        if (v == null) return \"\";\n        const s = String(v);\n        return s.includes(\",\") || s.includes('\"') || s.includes(\"\\n\")\n          ? `\"${s.replace(/\"/g, '\"\"')}\"`\n          : s;\n      };\n\n      const lines = [\n        headers.join(\",\"),\n        ...rows.map((u) =>\n          [\n            escape(u.id),\n            escape(u.email),\n            escape(u.username),\n            escape(u.firstName),\n            escape(u.lastName),\n            escape(u.phoneNumber),\n            escape(u.role),\n            escape(u.status),\n            escape(String(u.emailVerified)),\n            escape(String(u.mfaEnabled)),\n            escape(u.lastLoginAt),\n            escape(u.createdAt),\n          ].join(\",\"),\n        ),\n      ];\n\n      const blob = new Blob([lines.join(\"\\n\")], {\n        type: \"text/csv;charset=utf-8;\",\n      });\n      const url = URL.createObjectURL(blob);\n      const a = document.createElement(\"a\");\n      a.href = url;\n      a.download = `users-${new Date().toISOString().slice(0, 10)}.csv`;\n      a.click();\n      URL.revokeObjectURL(url);\n    } catch (err) {\n      setError(err instanceof Error ? err.message : \"Failed to export users\");\n    } finally {\n      setIsExporting(false);\n    }\n  };\n\n  const [users, setUsers] = useState<User[]>([]);\n  const [totalCount, setTotalCount] = useState(0);\n  const [hasMore, setHasMore] = useState(false);\n  const [viewMode, setViewMode] = useState<ViewMode>(\"list\");\n  const [selectedUser, setSelectedUser] = useState<User | null>(null);\n  const [formData, setFormData] = useState<FormData>({\n    username: \"\",\n    firstName: \"\",\n    lastName: \"\",\n    name: \"\",\n    phoneNumber: \"\",\n    role: \"MEMBER\",\n    status: \"ACTIVE\",\n    emailVerified: false,\n  });\n  const [error, setError] = useState<string | null>(null);\n  const [isUnauthorized, setIsUnauthorized] = useState(false);\n  const [successMessage, setSuccessMessage] = useState<string | null>(null);\n  const [pendingAction, setPendingAction] = useState<{\n    type: \"deactivate\" | \"hard-delete\";\n    user: User;\n  } | null>(null);\n  const [searchQuery, setSearchQuery] = useState(\"\");\n  const [filterRole, setFilterRole] = useState<UserRole | \"\">(\"\");\n  const [filterStatus, setFilterStatus] = useState<UserStatus | \"\">(\"\");\n  const [currentPage, setCurrentPage] = useState(0);\n  const pageSize = 10;\n\n  const fetchUsers = useCallback(async () => {\n    if (!isAuthenticated) return;\n\n    try {\n      setIsUnauthorized(false);\n      const filter: UserFilterInput = {};\n      if (searchQuery) filter.search = searchQuery;\n      if (filterRole) filter.role = filterRole;\n      if (filterStatus) filter.status = filterStatus;\n\n      const pagination: PaginationInput = {\n        offset: currentPage * pageSize,\n        limit: pageSize,\n      };\n\n      const result = await listUsers(filter, pagination);\n      setUsers(result.users);\n      setTotalCount(result.totalCount);\n      setHasMore(result.hasMore);\n      setError(null);\n    } catch (err) {\n      // Ignore abort errors - they happen during component unmount/re-render\n      if (\n        err instanceof Error &&\n        (err.name === \"AbortError\" || err.message.includes(\"aborted\"))\n      ) {\n        return;\n      }\n      const errorMessage =\n        err instanceof Error ? err.message : \"Failed to fetch users\";\n      // Check if it's an authorization error\n      if (\n        errorMessage.toLowerCase().includes(\"not authorized\") ||\n        errorMessage.toLowerCase().includes(\"forbidden\")\n      ) {\n        setIsUnauthorized(true);\n        setError(null);\n      } else {\n        setError(errorMessage);\n      }\n    }\n  }, [\n    listUsers,\n    searchQuery,\n    filterRole,\n    filterStatus,\n    currentPage,\n    isAuthenticated,\n  ]);\n\n  useEffect(() => {\n    fetchUsers();\n  }, [fetchUsers]);\n\n  const resetForm = () => {\n    setFormData({\n      username: \"\",\n      firstName: \"\",\n      lastName: \"\",\n      name: \"\",\n      phoneNumber: \"\",\n      role: \"MEMBER\",\n      status: \"ACTIVE\",\n      emailVerified: false,\n    });\n    setSelectedUser(null);\n    setError(null);\n    setSuccessMessage(null);\n  };\n\n  const handleUpdate = async (e: React.FormEvent) => {\n    e.preventDefault();\n    if (!selectedUser) return;\n    setError(null);\n\n    try {\n      await updateUser(selectedUser.id, {\n        username: formData.username || undefined,\n        firstName: formData.firstName || undefined,\n        lastName: formData.lastName || undefined,\n        name: formData.name || undefined,\n        phoneNumber: formData.phoneNumber || undefined,\n        role: formData.role,\n        status: formData.status,\n        emailVerified: formData.emailVerified,\n      });\n      setSuccessMessage(\n        tr(\"auth.users.updateSuccess\", \"User updated successfully!\"),\n      );\n      setViewMode(\"list\");\n      resetForm();\n      fetchUsers();\n    } catch (err) {\n      setError(err instanceof Error ? err.message : \"Failed to update user\");\n    }\n  };\n\n  const handleDelete = async (user: User) => {\n    void nativeImpact(\"medium\");\n    try {\n      const result = await deleteUser(user.id);\n      if (result.success) {\n        void nativeNotify(\"success\");\n        setSuccessMessage(\n          tr(\n            \"auth.users.userDeactivated\",\n            `User \"${user.email}\" has been deactivated.`,\n          ),\n        );\n        setPendingAction(null);\n        fetchUsers();\n      } else {\n        void nativeNotify(\"error\");\n        setError(result.message);\n      }\n    } catch (err) {\n      void nativeNotify(\"error\");\n      setError(err instanceof Error ? err.message : \"Failed to delete user\");\n    }\n  };\n\n  const handleHardDelete = async (user: User) => {\n    try {\n      const result = await hardDeleteUser(user.id);\n      if (result.success) {\n        setSuccessMessage(\n          tr(\n            \"auth.users.userPermanentlyDeleted\",\n            `User \"${user.email}\" has been permanently deleted.`,\n          ),\n        );\n        setPendingAction(null);\n        fetchUsers();\n      } else {\n        setError(result.message);\n      }\n    } catch (err) {\n      setError(\n        err instanceof Error ? err.message : \"Failed to hard delete user\",\n      );\n    }\n  };\n\n  const startEdit = (user: User) => {\n    setSelectedUser(user);\n    setFormData({\n      username: user.username || \"\",\n      firstName: user.firstName || \"\",\n      lastName: user.lastName || \"\",\n      name: user.name || \"\",\n      phoneNumber: user.phoneNumber || \"\",\n      role: user.role,\n      status: user.status,\n      emailVerified: user.emailVerified,\n    });\n    setViewMode(\"edit\");\n    setError(null);\n  };\n\n  const pendingActionDialog = (\n    <ConfirmActionDialog\n      open={pendingAction !== null}\n      onOpenChange={(open) => {\n        if (!open) {\n          setPendingAction(null);\n        }\n      }}\n      title={\n        pendingAction?.type === \"hard-delete\"\n          ? tr(\"auth.users.hardDeleteTitle\", \"Permanently delete user?\")\n          : tr(\"auth.users.deactivateTitle\", \"Deactivate user?\")\n      }\n      description={\n        pendingAction?.type === \"hard-delete\"\n          ? pendingAction\n            ? tr(\n                \"auth.users.hardDeleteDesc\",\n                `This permanently deletes \"${pendingAction.user.email}\" and cannot be undone.`,\n              )\n            : \"\"\n          : pendingAction\n            ? tr(\n                \"auth.users.deactivateDesc\",\n                `\"${pendingAction.user.email}\" will be prevented from signing in until reactivated.`,\n              )\n            : \"\"\n      }\n      confirmText={\n        pendingAction?.type === \"hard-delete\"\n          ? tr(\"auth.users.hardDeleteConfirm\", \"Delete permanently\")\n          : tr(\"auth.users.deactivateConfirm\", \"Deactivate user\")\n      }\n      variant={pendingAction?.type === \"hard-delete\" ? \"danger\" : \"warning\"}\n      onConfirm={async () => {\n        if (!pendingAction) return;\n        if (pendingAction.type === \"hard-delete\") {\n          await handleHardDelete(pendingAction.user);\n          return;\n        }\n        await handleDelete(pendingAction.user);\n      }}\n    />\n  );\n\n  const getRoleColor = (role: UserRole) => {\n    switch (role) {\n      case \"SUPER_ADMIN\":\n        return \"bg-accent-purple-subtle text-accent-purple\";\n      case \"TENANT_ADMIN\":\n        return \"bg-status-info-bg-subtle text-status-info-text\";\n      case \"ORG_ADMIN\":\n        return \"bg-accent-indigo-subtle text-accent-indigo\";\n      case \"WORKSPACE_ADMIN\":\n        return \"bg-accent-cyan-subtle text-accent-cyan\";\n      case \"MEMBER\":\n        return \"bg-status-success-bg-subtle text-status-success-text\";\n      case \"GUEST\":\n        return \"bg-bg-sunken text-text-primary\";\n      default:\n        return \"bg-bg-sunken text-text-primary\";\n    }\n  };\n\n  const getStatusColor = (status: UserStatus) => {\n    switch (status) {\n      case \"ACTIVE\":\n        return \"bg-status-success-bg-subtle text-status-success-text\";\n      case \"INACTIVE\":\n        return \"bg-status-warning-bg-subtle text-status-warning-text\";\n      case \"SUSPENDED\":\n        return \"bg-status-warning-bg-subtle text-status-warning-text\";\n      case \"DELETED\":\n        return \"bg-status-error-bg-subtle text-status-error-text\";\n      default:\n        return \"bg-bg-sunken text-text-primary\";\n    }\n  };\n\n  // Authentication check\n  if (!isAuthenticated) {\n    return (\n      <div className=\"max-w-6xl mx-auto p-6\">\n        <IllustratedEmptyState\n          illustration=\"empty-generic\"\n          title={tr(\"auth.users.authRequired\", \"Authentication Required\")}\n          description={tr(\n            \"auth.users.signInToManage\",\n            \"Please sign in to manage users\",\n          )}\n        />\n      </div>\n    );\n  }\n\n  // Loading permissions\n  if (permissionsLoading) {\n    return (\n      <div className=\"max-w-6xl mx-auto p-6\">\n        <div className=\"text-center py-16\">\n          <SpinnerIcon className=\"size-8 mx-auto text-text-secondary animate-spin\" />\n          <p className=\"mt-4 text-text-secondary\">\n            {tr(\"auth.users.loadingPermissions\", \"Loading permissions...\")}\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  // Authorization check - user needs user:read permission\n  if (!canViewUsers || isUnauthorized) {\n    return (\n      <div className=\"max-w-6xl mx-auto p-6\">\n        <IllustratedEmptyState\n          illustration=\"empty-generic\"\n          title={tr(\"auth.users.adminAccessRequired\", \"Admin Access Required\")}\n          description={\n            <>\n              {tr(\n                \"auth.users.adminAccessDesc\",\n                \"You need administrator privileges to view and manage users.\",\n              )}{\" \"}\n              {tr(\n                \"auth.users.requiredRoles\",\n                \"Required roles: Super Admin, Tenant Admin, or Org Admin\",\n              )}\n            </>\n          }\n        />\n      </div>\n    );\n  }\n\n  // List view\n  if (viewMode === \"list\") {\n    return (\n      <div className=\"max-w-6xl mx-auto p-6\">\n        {pendingActionDialog}\n        {/* Header */}\n        <div className=\"flex items-center justify-between mb-8\">\n          <div>\n            <h1 className=\"text-3xl font-semibold text-text-primary\">\n              {tr(\"auth.users.title\", \"Users\")}\n            </h1>\n            <p className=\"text-text-secondary mt-2\">\n              {tr(\"auth.users.subtitle\", \"Manage users in your organization\")} (\n              {totalCount} {tr(\"auth.users.paginationUsers\", \"total\")})\n            </p>\n          </div>\n          {/* Export button */}\n          <button\n            type=\"button\"\n            onClick={() => void handleExport()}\n            disabled={isExporting}\n            aria-label={tr(\"auth.users.exportAriaLabel\", \"Export user list\")}\n            className=\"flex items-center gap-2 px-4 py-2.5 rounded-xl border border-border-default text-text-primary bg-bg-surface hover:bg-bg-sunken disabled:opacity-50 disabled:cursor-not-allowed transition-colors font-medium\"\n          >\n            {isExporting ? (\n              <>\n                <SpinnerIcon\n                  className=\"size-4 animate-spin\"\n                  aria-hidden=\"true\"\n                />\n                {tr(\"auth.users.exporting\", \"Exporting...\")}\n              </>\n            ) : (\n              <>\n                <svg\n                  className=\"size-4\"\n                  fill=\"none\"\n                  viewBox=\"0 0 24 24\"\n                  stroke=\"currentColor\"\n                  aria-hidden=\"true\"\n                >\n                  <path\n                    strokeLinecap=\"round\"\n                    strokeLinejoin=\"round\"\n                    strokeWidth={2}\n                    d=\"M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4\"\n                  />\n                </svg>\n                {tr(\"auth.users.export\", \"Export\")}\n              </>\n            )}\n          </button>\n        </div>\n\n        <PagePurpose className=\"mb-6\">\n          {tr(\n            \"auth.users.purpose\",\n            \"Manage everyone with access to your organization. Search and filter accounts, review their role and status, edit details, or deactivate people who should no longer have access.\",\n          )}\n        </PagePurpose>\n\n        {/* Emphasis: directory summary — the one highlighted zone */}\n        <EmphasisPanel className=\"mb-6\">\n          <p className=\"text-sm font-medium text-text-secondary\">\n            {tr(\"auth.users.summaryLabel\", \"People in this organization\")}\n          </p>\n          <p className=\"mt-1 text-3xl font-semibold text-text-primary\">\n            {totalCount}\n          </p>\n          <p className=\"mt-1 text-sm text-text-secondary\">\n            {tr(\n              \"auth.users.summaryHint\",\n              \"Use the filters below to find a specific person or role.\",\n            )}\n          </p>\n        </EmphasisPanel>\n\n        {/* Live region for status announcements */}\n        <div aria-live=\"polite\" aria-atomic=\"true\" className=\"sr-only\">\n          {successMessage}\n        </div>\n        <div\n          role=\"alert\"\n          aria-live=\"assertive\"\n          aria-atomic=\"true\"\n          className=\"sr-only\"\n        >\n          {error}\n        </div>\n\n        {/* Success Message */}\n        {successMessage && (\n          <output\n            id={successId}\n            className=\"block mb-6 p-4 rounded-xl bg-status-success-bg-subtle border border-status-success-border\"\n          >\n            <p className=\"text-status-success-text\">{successMessage}</p>\n            <button\n              type=\"button\"\n              onClick={() => setSuccessMessage(null)}\n              className=\"mt-2 text-sm text-status-success-text hover:underline\"\n            >\n              {tr(\"auth.users.dismiss\", \"Dismiss\")}\n            </button>\n          </output>\n        )}\n\n        {/* Error Message */}\n        {error && (\n          <div\n            id={errorId}\n            role=\"alert\"\n            className=\"mb-6 flex items-start gap-3 p-4 rounded-xl bg-status-error-bg-subtle border border-status-error-border\"\n          >\n            <AlertIcon\n              className=\"size-5 text-status-error-text flex-shrink-0 mt-0.5\"\n              aria-hidden=\"true\"\n            />\n            <div className=\"flex-1\">\n              <p className=\"text-sm text-status-error-text\">{error}</p>\n              <button\n                type=\"button\"\n                onClick={() => setError(null)}\n                className=\"mt-2 text-sm text-status-error-text hover:underline\"\n              >\n                {tr(\"auth.users.dismiss\", \"Dismiss\")}\n              </button>\n            </div>\n          </div>\n        )}\n\n        {/* Filters */}\n        <div className=\"mb-6 p-4 rounded-xl border border-border-subtle bg-bg-surface\">\n          <div className=\"flex flex-wrap gap-4 items-end\">\n            {/* Visually hidden labels satisfy WCAG — placeholders are not labels */}\n            <div className=\"flex-1 min-w-[200px]\">\n              <label htmlFor={searchId} className=\"sr-only\">\n                {tr(\"auth.users.searchLabel\", \"Search users\")}\n              </label>\n              <input\n                id={searchId}\n                type=\"search\"\n                aria-label={tr(\"auth.users.searchLabel\", \"Search users\")}\n                placeholder={tr(\n                  \"auth.users.searchPlaceholder\",\n                  \"Search by email, username, or name...\",\n                )}\n                value={searchQuery}\n                onChange={(e) => {\n                  setSearchQuery(e.target.value);\n                  setCurrentPage(0);\n                }}\n                className=\"w-full px-4 py-2.5 border border-border-default rounded-xl bg-bg-surface text-text-primary placeholder-text-tertiary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              />\n            </div>\n            <div>\n              <label htmlFor={roleFilterId} className=\"sr-only\">\n                {tr(\"auth.users.filterRoleLabel\", \"Filter by role\")}\n              </label>\n              <select\n                id={roleFilterId}\n                value={filterRole}\n                onChange={(e) => {\n                  setFilterRole(e.target.value as UserRole | \"\");\n                  setCurrentPage(0);\n                }}\n                className=\"px-4 py-2.5 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              >\n                <option value=\"\">\n                  {tr(\"auth.users.allRoles\", \"All Roles\")}\n                </option>\n                {USER_ROLES.map((role) => (\n                  <option key={role} value={role}>\n                    {role.replace(\"_\", \" \")}\n                  </option>\n                ))}\n              </select>\n            </div>\n            <div>\n              <label htmlFor={statusFilterId} className=\"sr-only\">\n                {tr(\"auth.users.filterStatusLabel\", \"Filter by status\")}\n              </label>\n              <select\n                id={statusFilterId}\n                value={filterStatus}\n                onChange={(e) => {\n                  setFilterStatus(e.target.value as UserStatus | \"\");\n                  setCurrentPage(0);\n                }}\n                className=\"px-4 py-2.5 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              >\n                <option value=\"\">\n                  {tr(\"auth.users.allStatuses\", \"All Statuses\")}\n                </option>\n                {USER_STATUSES.map((status) => (\n                  <option key={status} value={status}>\n                    {status}\n                  </option>\n                ))}\n              </select>\n            </div>\n          </div>\n        </div>\n\n        {isLoading ? (\n          <div\n            aria-live=\"polite\"\n            aria-busy=\"true\"\n            className=\"flex items-center justify-center py-12\"\n          >\n            <SpinnerIcon\n              className=\"size-8 text-text-link animate-spin\"\n              aria-hidden=\"true\"\n            />\n            <span className=\"ml-3 text-text-secondary\">\n              {tr(\"auth.users.loadingUsers\", \"Loading users...\")}\n            </span>\n          </div>\n        ) : users.length === 0 ? (\n          <IllustratedEmptyState\n            illustration={\n              searchQuery || filterRole || filterStatus\n                ? \"empty-search\"\n                : \"empty-people\"\n            }\n            title={tr(\"auth.users.noUsersFound\", \"No users found\")}\n            description={\n              searchQuery || filterRole || filterStatus\n                ? tr(\n                    \"auth.users.noUsersFilteredDesc\",\n                    \"No users match your current search or filters. Try clearing them to see everyone.\",\n                  )\n                : tr(\n                    \"auth.users.noUsersDesc\",\n                    \"Once people join your organization they'll show up here for you to manage.\",\n                  )\n            }\n          />\n        ) : (\n          <>\n            {/* Users Table */}\n            <div className=\"rounded-xl border border-border-subtle bg-bg-surface overflow-hidden shadow-sm\">\n              <div className=\"overflow-x-auto\">\n                <table\n                  className=\"w-full min-w-[800px]\"\n                  aria-label={tr(\"auth.users.tableAriaLabel\", \"Users table\")}\n                >\n                  <thead>\n                    <tr className=\"border-b border-border-subtle bg-bg-canvas\">\n                      <th\n                        scope=\"col\"\n                        className=\"text-left p-4 text-sm font-medium text-text-secondary w-[280px]\"\n                      >\n                        {tr(\"auth.users.columnUser\", \"User\")}\n                      </th>\n                      <th\n                        scope=\"col\"\n                        className=\"text-left p-4 text-sm font-medium text-text-secondary w-[130px]\"\n                      >\n                        {tr(\"auth.users.columnRole\", \"Role\")}\n                      </th>\n                      <th\n                        scope=\"col\"\n                        className=\"text-left p-4 text-sm font-medium text-text-secondary w-[100px]\"\n                      >\n                        {tr(\"auth.users.columnStatus\", \"Status\")}\n                      </th>\n                      <th\n                        scope=\"col\"\n                        className=\"text-left p-4 text-sm font-medium text-text-secondary w-[80px]\"\n                      >\n                        {tr(\"auth.users.columnVerified\", \"Verified\")}\n                      </th>\n                      <th\n                        scope=\"col\"\n                        className=\"text-left p-4 text-sm font-medium text-text-secondary w-[100px]\"\n                      >\n                        {tr(\"auth.users.columnLastLogin\", \"Last Login\")}\n                      </th>\n                      <th\n                        scope=\"col\"\n                        className=\"text-right p-4 text-sm font-medium text-text-secondary w-[180px]\"\n                      >\n                        {tr(\"auth.users.columnActions\", \"Actions\")}\n                      </th>\n                    </tr>\n                  </thead>\n                  <tbody>\n                    {users.map((user) => (\n                      <tr\n                        key={user.id}\n                        className=\"border-b border-border-subtle last:border-b-0 hover:bg-bg-sunken/50 transition-colors\"\n                      >\n                        <td className=\"p-4\">\n                          <div className=\"flex items-center gap-3 min-w-0\">\n                            <div className=\"auth-brand-badge flex size-10 shrink-0 items-center justify-center rounded-full font-medium\">\n                              {(user.name || user.username || user.email)\n                                .charAt(0)\n                                .toUpperCase()}\n                            </div>\n                            <div className=\"min-w-0 flex-1\">\n                              <p className=\"font-medium text-text-primary truncate\">\n                                {user.name || user.username}\n                              </p>\n                              <p className=\"text-sm text-text-secondary truncate\">\n                                {user.email}\n                              </p>\n                            </div>\n                          </div>\n                        </td>\n                        <td className=\"p-4\">\n                          <span\n                            className={`inline-block px-2.5 py-1 rounded-full text-xs font-medium whitespace-nowrap ${getRoleColor(user.role)}`}\n                          >\n                            {user.role.replace(\"_\", \" \")}\n                          </span>\n                        </td>\n                        <td className=\"p-4\">\n                          <span\n                            className={`inline-block px-2.5 py-1 rounded-full text-xs font-medium whitespace-nowrap ${getStatusColor(user.status)}`}\n                          >\n                            {user.status}\n                          </span>\n                        </td>\n                        <td className=\"p-4\">\n                          {user.emailVerified ? (\n                            <span className=\"inline-flex items-center gap-1 text-status-success-text whitespace-nowrap\">\n                              <svg\n                                className=\"size-4 flex-shrink-0\"\n                                fill=\"currentColor\"\n                                viewBox=\"0 0 20 20\"\n                              >\n                                <path\n                                  fillRule=\"evenodd\"\n                                  d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z\"\n                                  clipRule=\"evenodd\"\n                                />\n                              </svg>\n                              <span className=\"text-sm\">\n                                {tr(\"auth.users.verifiedYes\", \"Yes\")}\n                              </span>\n                            </span>\n                          ) : (\n                            <span className=\"inline-flex items-center gap-1 text-status-warning-text whitespace-nowrap\">\n                              <svg\n                                className=\"size-4 flex-shrink-0\"\n                                fill=\"currentColor\"\n                                viewBox=\"0 0 20 20\"\n                              >\n                                <path\n                                  fillRule=\"evenodd\"\n                                  d=\"M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z\"\n                                  clipRule=\"evenodd\"\n                                />\n                              </svg>\n                              <span className=\"text-sm\">\n                                {tr(\"auth.users.verifiedNo\", \"No\")}\n                              </span>\n                            </span>\n                          )}\n                        </td>\n                        <td className=\"p-4 text-sm text-text-secondary whitespace-nowrap\">\n                          {user.lastLoginAt\n                            ? new Date(user.lastLoginAt).toLocaleDateString()\n                            : tr(\"auth.users.lastLoginNever\", \"Never\")}\n                        </td>\n                        <td className=\"p-4\">\n                          <div className=\"flex justify-end gap-1.5 flex-nowrap\">\n                            <button\n                              type=\"button\"\n                              onClick={() => navigate(`/auth/users/${user.id}`)}\n                              aria-label={`${tr(\"auth.users.actionView\", \"View\")} ${user.name || user.username || user.email}`}\n                              className=\"px-2.5 py-1.5 rounded-lg text-xs font-medium border border-border-default text-text-primary bg-bg-surface hover:bg-bg-sunken transition-colors whitespace-nowrap flex-shrink-0\"\n                            >\n                              {tr(\"auth.users.actionView\", \"View\")}\n                            </button>\n                            {canUpdateUsers && (\n                              <button\n                                type=\"button\"\n                                onClick={() => startEdit(user)}\n                                aria-label={`${tr(\"auth.users.actionEdit\", \"Edit\")} ${user.name || user.username || user.email}`}\n                                className=\"px-2.5 py-1.5 rounded-lg text-xs font-medium border border-status-info-border text-text-link bg-bg-surface hover:bg-status-info-bg-subtle transition-colors whitespace-nowrap flex-shrink-0\"\n                              >\n                                {tr(\"auth.users.actionEdit\", \"Edit\")}\n                              </button>\n                            )}\n                            {canDeleteUsers && user.status !== \"DELETED\" && (\n                              <button\n                                type=\"button\"\n                                onClick={() =>\n                                  setPendingAction({ type: \"deactivate\", user })\n                                }\n                                aria-label={`${tr(\"auth.users.actionDelete\", \"Delete\")} ${user.name || user.username || user.email}`}\n                                className=\"px-2.5 py-1.5 rounded-lg text-xs font-medium border border-status-error-border text-status-error-text bg-bg-surface hover:bg-status-error-bg-subtle transition-colors whitespace-nowrap flex-shrink-0\"\n                              >\n                                {tr(\"auth.users.actionDelete\", \"Delete\")}\n                              </button>\n                            )}\n                          </div>\n                        </td>\n                      </tr>\n                    ))}\n                  </tbody>\n                </table>\n              </div>\n            </div>\n\n            {/* Pagination */}\n            <div className=\"mt-6 flex items-center justify-between\">\n              <p className=\"text-sm text-text-secondary\">\n                {tr(\"auth.users.showing\", \"Showing\")}{\" \"}\n                {currentPage * pageSize + 1} {tr(\"auth.users.to\", \"to\")}{\" \"}\n                {Math.min((currentPage + 1) * pageSize, totalCount)}{\" \"}\n                {tr(\"auth.users.of\", \"of\")} {totalCount}{\" \"}\n                {tr(\"auth.users.paginationUsers\", \"users\")}\n              </p>\n              <nav\n                aria-label={tr(\n                  \"auth.users.paginationAriaLabel\",\n                  \"User list pagination\",\n                )}\n              >\n                <div className=\"flex gap-2\">\n                  <button\n                    type=\"button\"\n                    onClick={() =>\n                      setCurrentPage((prev) => Math.max(0, prev - 1))\n                    }\n                    disabled={currentPage === 0}\n                    aria-label={tr(\n                      \"auth.users.previousPageAriaLabel\",\n                      \"Go to previous page\",\n                    )}\n                    className=\"px-4 py-2 rounded-lg border border-border-default text-text-primary bg-bg-surface disabled:opacity-50 disabled:cursor-not-allowed hover:bg-bg-sunken transition-colors\"\n                  >\n                    {tr(\"auth.users.previousPage\", \"Previous\")}\n                  </button>\n                  <button\n                    type=\"button\"\n                    onClick={() => setCurrentPage((prev) => prev + 1)}\n                    disabled={!hasMore}\n                    aria-label={tr(\n                      \"auth.users.nextPageAriaLabel\",\n                      \"Go to next page\",\n                    )}\n                    className=\"px-4 py-2 rounded-lg border border-border-default text-text-primary bg-bg-surface disabled:opacity-50 disabled:cursor-not-allowed hover:bg-bg-sunken transition-colors\"\n                  >\n                    {tr(\"auth.users.nextPage\", \"Next\")}\n                  </button>\n                </div>\n              </nav>\n            </div>\n\n            <NextSteps\n              className=\"mt-8\"\n              storageKey=\"auth-users\"\n              steps={[\n                {\n                  id: \"search-user\",\n                  label: tr(\n                    \"auth.users.nextSearch\",\n                    \"Find a specific person\",\n                  ),\n                  description: tr(\n                    \"auth.users.nextSearchDesc\",\n                    \"Use the search and role / status filters above to narrow the list.\",\n                  ),\n                  onClick: () => {\n                    const el = document.getElementById(searchId);\n                    if (el instanceof HTMLInputElement) el.focus();\n                  },\n                },\n                {\n                  id: \"export-users\",\n                  label: tr(\"auth.users.nextExport\", \"Export the user list\"),\n                  description: tr(\n                    \"auth.users.nextExportDesc\",\n                    \"Download a CSV of users matching your current filters.\",\n                  ),\n                  onClick: () => void handleExport(),\n                },\n              ]}\n            />\n          </>\n        )}\n      </div>\n    );\n  }\n\n  // View details\n  if (viewMode === \"view\" && selectedUser) {\n    return (\n      <div className=\"max-w-4xl mx-auto p-6\">\n        {pendingActionDialog}\n        <button\n          type=\"button\"\n          onClick={() => {\n            setViewMode(\"list\");\n            resetForm();\n          }}\n          className=\"mb-6 flex items-center gap-2 text-text-link hover:underline font-medium\"\n        >\n          <svg\n            className=\"size-4\"\n            fill=\"none\"\n            viewBox=\"0 0 24 24\"\n            stroke=\"currentColor\"\n          >\n            <path\n              strokeLinecap=\"round\"\n              strokeLinejoin=\"round\"\n              strokeWidth={2}\n              d=\"M10 19l-7-7m0 0l7-7m-7 7h18\"\n            />\n          </svg>\n          {tr(\"auth.users.backToUsers\", \"Back to Users\")}\n        </button>\n\n        <div className=\"p-6 rounded-xl border border-border-subtle bg-bg-surface shadow-sm\">\n          <div className=\"flex items-center gap-4 mb-8\">\n            <div className=\"auth-brand-badge flex size-20 items-center justify-center rounded-full text-3xl font-semibold\">\n              {(\n                selectedUser.name ||\n                selectedUser.username ||\n                selectedUser.email\n              )\n                .charAt(0)\n                .toUpperCase()}\n            </div>\n            <div>\n              <h1 className=\"text-2xl font-semibold text-text-primary\">\n                {selectedUser.name || selectedUser.username}\n              </h1>\n              <p className=\"text-text-secondary\">{selectedUser.email}</p>\n              <div className=\"flex items-center gap-2 mt-2\">\n                <span\n                  className={`px-2.5 py-1 rounded-full text-xs font-medium ${getRoleColor(selectedUser.role)}`}\n                >\n                  {selectedUser.role.replace(\"_\", \" \")}\n                </span>\n                <span\n                  className={`px-2.5 py-1 rounded-full text-xs font-medium ${getStatusColor(selectedUser.status)}`}\n                >\n                  {selectedUser.status}\n                </span>\n              </div>\n            </div>\n          </div>\n\n          <div className=\"grid grid-cols-2 gap-6\">\n            <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n              <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                {tr(\"auth.users.viewDetailsUsername\", \"Username\")}\n              </label>\n              <p className=\"text-text-primary font-medium\">\n                {selectedUser.username}\n              </p>\n            </div>\n\n            <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n              <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                {tr(\"auth.users.viewDetailsEmail\", \"Email\")}\n              </label>\n              <p className=\"text-text-primary font-medium\">\n                {selectedUser.email}\n              </p>\n            </div>\n\n            <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n              <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                {tr(\"auth.users.viewDetailsEmailVerified\", \"Email Verified\")}\n              </label>\n              <p className=\"text-text-primary font-medium\">\n                {selectedUser.emailVerified ? (\n                  <span className=\"text-status-success-text\">\n                    {tr(\"auth.users.verifiedYes\", \"Yes\")}\n                  </span>\n                ) : (\n                  <span className=\"text-status-warning-text\">\n                    {tr(\"auth.users.verifiedNo\", \"No\")}\n                  </span>\n                )}\n              </p>\n            </div>\n\n            <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n              <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                {tr(\"auth.users.viewDetailsMfaEnabled\", \"MFA Enabled\")}\n              </label>\n              <p className=\"text-text-primary font-medium\">\n                {selectedUser.mfaEnabled ? (\n                  <span className=\"text-status-success-text\">\n                    {tr(\"auth.users.verifiedYes\", \"Yes\")}\n                  </span>\n                ) : (\n                  <span className=\"text-text-secondary\">\n                    {tr(\"auth.users.verifiedNo\", \"No\")}\n                  </span>\n                )}\n              </p>\n            </div>\n\n            {selectedUser.phoneNumber && (\n              <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n                <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                  {tr(\"auth.users.viewDetailsPhoneNumber\", \"Phone Number\")}\n                </label>\n                <p className=\"text-text-primary font-medium\">\n                  {selectedUser.phoneNumber}\n                </p>\n              </div>\n            )}\n\n            <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n              <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                {tr(\"auth.users.viewDetailsLastLogin\", \"Last Login\")}\n              </label>\n              <p className=\"text-text-primary font-medium\">\n                {selectedUser.lastLoginAt\n                  ? new Date(selectedUser.lastLoginAt).toLocaleString()\n                  : tr(\"auth.users.lastLoginNever\", \"Never\")}\n              </p>\n            </div>\n\n            <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n              <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                {tr(\"auth.users.viewDetailsCreated\", \"Created\")}\n              </label>\n              <p className=\"text-text-primary font-medium\">\n                {new Date(selectedUser.createdAt).toLocaleString()}\n              </p>\n            </div>\n\n            <div className=\"p-4 rounded-lg bg-bg-canvas/50\">\n              <label className=\"block text-sm font-medium text-text-secondary mb-1\">\n                {tr(\"auth.users.viewDetailsLastUpdated\", \"Last Updated\")}\n              </label>\n              <p className=\"text-text-primary font-medium\">\n                {new Date(selectedUser.updatedAt).toLocaleString()}\n              </p>\n            </div>\n          </div>\n\n          <div className=\"mt-8 pt-6 border-t border-border-subtle flex gap-3\">\n            <Button\n              type=\"button\"\n              onClick={() => startEdit(selectedUser)}\n              variant=\"default\"\n              className=\"font-semibold\"\n            >\n              {tr(\"auth.users.editUser\", \"Edit User\")}\n            </Button>\n            {selectedUser.status !== \"DELETED\" && (\n              <button\n                type=\"button\"\n                onClick={() =>\n                  setPendingAction({ type: \"deactivate\", user: selectedUser })\n                }\n                className=\"px-4 py-2.5 rounded-xl border border-status-error-border text-status-error-text font-medium hover:bg-status-error-bg-subtle transition-colors\"\n              >\n                {tr(\"auth.users.deleteUser\", \"Delete User\")}\n              </button>\n            )}\n            {canDeleteUsers &&\n              selectedUser.status === \"DELETED\" &&\n              currentUser?.role === \"SUPER_ADMIN\" && (\n                <button\n                  type=\"button\"\n                  onClick={() =>\n                    setPendingAction({\n                      type: \"hard-delete\",\n                      user: selectedUser,\n                    })\n                  }\n                  className=\"px-4 py-2.5 rounded-xl bg-status-error-bg text-white font-medium hover:bg-status-error-bg-hover transition-colors\"\n                >\n                  {tr(\"auth.users.permanentlyDelete\", \"Permanently Delete\")}\n                </button>\n              )}\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  // Edit form\n  return (\n    <div className=\"max-w-2xl mx-auto p-6\">\n      {pendingActionDialog}\n      <button\n        type=\"button\"\n        onClick={() => {\n          setViewMode(\"list\");\n          resetForm();\n        }}\n        className=\"mb-6 flex items-center gap-2 text-text-link hover:underline font-medium\"\n      >\n        <svg\n          className=\"size-4\"\n          fill=\"none\"\n          viewBox=\"0 0 24 24\"\n          stroke=\"currentColor\"\n        >\n          <path\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            strokeWidth={2}\n            d=\"M10 19l-7-7m0 0l7-7m-7 7h18\"\n          />\n        </svg>\n        {tr(\"auth.users.backToUsers\", \"Back to Users\")}\n      </button>\n\n      <div className=\"p-6 rounded-xl border border-border-subtle bg-bg-surface shadow-sm\">\n        <h1 className=\"text-2xl font-semibold text-text-primary mb-2\">\n          {tr(\"auth.users.editUser\", \"Edit User\")}\n        </h1>\n\n        {selectedUser && (\n          <p className=\"text-text-secondary mb-6\">\n            {tr(\"auth.users.editingUser\", \"Editing:\")}{\" \"}\n            <strong>{selectedUser.email}</strong>\n          </p>\n        )}\n\n        {error && (\n          <div className=\"mb-6 flex items-start gap-3 p-4 rounded-xl bg-status-error-bg-subtle border border-status-error-border\">\n            <AlertIcon className=\"size-5 text-status-error-text flex-shrink-0 mt-0.5\" />\n            <div className=\"flex-1\">\n              <p className=\"text-sm text-status-error-text\">{error}</p>\n            </div>\n          </div>\n        )}\n\n        <form\n          onSubmit={handleUpdate}\n          className=\"space-y-6\"\n          aria-describedby={error ? errorId : undefined}\n          noValidate\n        >\n          <div className=\"grid grid-cols-2 gap-4\">\n            <div>\n              <label\n                htmlFor=\"edit-username\"\n                className=\"block text-sm font-medium text-text-primary mb-2\"\n              >\n                {tr(\"auth.users.fieldUsername\", \"Username\")}\n              </label>\n              <input\n                id=\"edit-username\"\n                type=\"text\"\n                aria-label={tr(\"auth.users.fieldUsername\", \"Username\")}\n                value={formData.username}\n                onChange={(e) =>\n                  setFormData({ ...formData, username: e.target.value })\n                }\n                className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              />\n            </div>\n\n            <div>\n              <label\n                htmlFor=\"edit-name\"\n                className=\"block text-sm font-medium text-text-primary mb-2\"\n              >\n                {tr(\"auth.users.fieldName\", \"Name\")}\n              </label>\n              <input\n                id=\"edit-name\"\n                type=\"text\"\n                aria-label={tr(\"auth.users.fieldName\", \"Name\")}\n                value={formData.name}\n                onChange={(e) =>\n                  setFormData({ ...formData, name: e.target.value })\n                }\n                className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              />\n            </div>\n          </div>\n\n          <div className=\"grid grid-cols-2 gap-4\">\n            <div>\n              <label\n                htmlFor=\"edit-firstName\"\n                className=\"block text-sm font-medium text-text-primary mb-2\"\n              >\n                {tr(\"auth.users.fieldFirstName\", \"First Name\")}\n              </label>\n              <input\n                id=\"edit-firstName\"\n                type=\"text\"\n                aria-label={tr(\"auth.users.fieldFirstName\", \"First Name\")}\n                value={formData.firstName}\n                onChange={(e) =>\n                  setFormData({ ...formData, firstName: e.target.value })\n                }\n                className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              />\n            </div>\n\n            <div>\n              <label\n                htmlFor=\"edit-lastName\"\n                className=\"block text-sm font-medium text-text-primary mb-2\"\n              >\n                {tr(\"auth.users.fieldLastName\", \"Last Name\")}\n              </label>\n              <input\n                id=\"edit-lastName\"\n                type=\"text\"\n                aria-label={tr(\"auth.users.fieldLastName\", \"Last Name\")}\n                value={formData.lastName}\n                onChange={(e) =>\n                  setFormData({ ...formData, lastName: e.target.value })\n                }\n                className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              />\n            </div>\n          </div>\n\n          <div>\n            <label\n              htmlFor=\"edit-phoneNumber\"\n              className=\"block text-sm font-medium text-text-primary mb-2\"\n            >\n              {tr(\"auth.users.fieldPhoneNumber\", \"Phone Number\")}\n            </label>\n            <input\n              id=\"edit-phoneNumber\"\n              type=\"tel\"\n              aria-label={tr(\"auth.users.fieldPhoneNumber\", \"Phone Number\")}\n              value={formData.phoneNumber}\n              onChange={(e) =>\n                setFormData({ ...formData, phoneNumber: e.target.value })\n              }\n              className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n            />\n          </div>\n\n          <div className=\"grid grid-cols-2 gap-4\">\n            <div>\n              <label\n                htmlFor=\"edit-role\"\n                className=\"block text-sm font-medium text-text-primary mb-2\"\n              >\n                {tr(\"auth.users.fieldRole\", \"Role\")}\n              </label>\n              <select\n                id=\"edit-role\"\n                aria-label={tr(\"auth.users.fieldRole\", \"Role\")}\n                value={formData.role}\n                onChange={(e) =>\n                  setFormData({ ...formData, role: e.target.value as UserRole })\n                }\n                className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              >\n                {USER_ROLES.map((role) => (\n                  <option key={role} value={role}>\n                    {role.replace(\"_\", \" \")}\n                  </option>\n                ))}\n              </select>\n            </div>\n\n            <div>\n              <label\n                htmlFor=\"edit-status\"\n                className=\"block text-sm font-medium text-text-primary mb-2\"\n              >\n                {tr(\"auth.users.fieldStatus\", \"Status\")}\n              </label>\n              <select\n                id=\"edit-status\"\n                aria-label={tr(\"auth.users.fieldStatus\", \"Status\")}\n                value={formData.status}\n                onChange={(e) =>\n                  setFormData({\n                    ...formData,\n                    status: e.target.value as UserStatus,\n                  })\n                }\n                className=\"block w-full px-4 py-3 border border-border-default rounded-xl bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all\"\n              >\n                {USER_STATUSES.map((status) => (\n                  <option key={status} value={status}>\n                    {status}\n                  </option>\n                ))}\n              </select>\n            </div>\n          </div>\n\n          <div className=\"flex items-center gap-3 p-4 rounded-xl bg-bg-canvas/50\">\n            <input\n              type=\"checkbox\"\n              id=\"emailVerified\"\n              checked={formData.emailVerified}\n              onChange={(e) =>\n                setFormData({ ...formData, emailVerified: e.target.checked })\n              }\n              className=\"size-5 rounded border-border-default text-text-link focus:ring-action-primary-bg\"\n            />\n            <label\n              htmlFor=\"emailVerified\"\n              className=\"text-sm font-medium text-text-primary\"\n            >\n              {tr(\"auth.users.fieldEmailVerified\", \"Email Verified\")}\n            </label>\n          </div>\n\n          <div className=\"flex gap-3 pt-4\">\n            <Button\n              type=\"submit\"\n              disabled={isLoading}\n              variant=\"default\"\n              size=\"lg\"\n              className=\"font-semibold\"\n            >\n              {isLoading ? (\n                <>\n                  <SpinnerIcon className=\"size-4 animate-spin\" />\n                  {tr(\"auth.users.saving\", \"Saving...\")}\n                </>\n              ) : (\n                tr(\"auth.users.saveChanges\", \"Save Changes\")\n              )}\n            </Button>\n            <button\n              type=\"button\"\n              onClick={() => {\n                setViewMode(\"list\");\n                resetForm();\n              }}\n              className=\"px-6 py-3 rounded-xl border border-border-default text-text-primary font-medium hover:bg-bg-sunken transition-colors\"\n            >\n              {tr(\"auth.users.cancel\", \"Cancel\")}\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/microfe-auth.css

@@ -1,3 +1,3 @@
-/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
-@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:Inter, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";--font-mono:"JetBrains Mono", ui-monospace, monospace;--color-indigo-500:oklch(58.5% .233 277.117);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-sm:24rem;--container-md:28rem;--container-2xl:42rem;--container-4xl:56rem;--container-5xl:64rem;--container-6xl:72rem;--container-7xl:80rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-widest:.1em;--leading-tight:1.25;--leading-relaxed:1.625;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--animate-spin:spin 1s linear infinite;--blur-sm:8px;--blur-3xl:64px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--radius:.5rem;--color-primary:221.2 83.2% 53.3%}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-none{pointer-events:none}.invisible{visibility:hidden}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.inset-0{inset:calc(var(--spacing) * 0)}.inset-y-0{inset-block:calc(var(--spacing) * 0)}.-top-40{top:calc(var(--spacing) * -40)}.top-0{top:calc(var(--spacing) * 0)}.top-1\/2{top:50%}.top-4{top:calc(var(--spacing) * 4)}.top-full{top:100%}.-right-20{right:calc(var(--spacing) * -20)}.right-0{right:calc(var(--spacing) * 0)}.right-4{right:calc(var(--spacing) * 4)}.-bottom-40{bottom:calc(var(--spacing) * -40)}.bottom-0{bottom:calc(var(--spacing) * 0)}.-left-40{left:calc(var(--spacing) * -40)}.left-0{left:calc(var(--spacing) * 0)}.left-1\/4{left:25%}.z-10{z-index:10}.z-50{z-index:50}.container{width:100%}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.mx-4{margin-inline:calc(var(--spacing) * 4)}.mx-auto{margin-inline:auto}.my-8{margin-block:calc(var(--spacing) * 8)}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:calc(var(--spacing) * 1)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-10{margin-top:calc(var(--spacing) * 10)}.mt-12{margin-top:calc(var(--spacing) * 12)}.mb-1{margin-bottom:calc(var(--spacing) * 1)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.mb-8{margin-bottom:calc(var(--spacing) * 8)}.ml-3{margin-left:calc(var(--spacing) * 3)}.ml-4{margin-left:calc(var(--spacing) * 4)}.ml-auto{margin-left:auto}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.table{display:table}.size-2{width:calc(var(--spacing) * 2);height:calc(var(--spacing) * 2)}.size-3{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-5{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.size-6{width:calc(var(--spacing) * 6);height:calc(var(--spacing) * 6)}.size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}.size-10{width:calc(var(--spacing) * 10);height:calc(var(--spacing) * 10)}.size-12{width:calc(var(--spacing) * 12);height:calc(var(--spacing) * 12)}.size-14{width:calc(var(--spacing) * 14);height:calc(var(--spacing) * 14)}.size-16{width:calc(var(--spacing) * 16);height:calc(var(--spacing) * 16)}.size-20{width:calc(var(--spacing) * 20);height:calc(var(--spacing) * 20)}.size-48{width:calc(var(--spacing) * 48);height:calc(var(--spacing) * 48)}.size-72{width:calc(var(--spacing) * 72);height:calc(var(--spacing) * 72)}.size-80{width:calc(var(--spacing) * 80);height:calc(var(--spacing) * 80)}.size-96{width:calc(var(--spacing) * 96);height:calc(var(--spacing) * 96)}.size-full{width:100%;height:100%}.h-0\.5{height:calc(var(--spacing) * .5)}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-12{height:calc(var(--spacing) * 12)}.h-full{height:100%}.min-h-\[400px\]{min-height:400px}.min-h-screen{min-height:100vh}.w-1\/4{width:25%}.w-2\/4{width:50%}.w-3\/4{width:75%}.w-10{width:calc(var(--spacing) * 10)}.w-48{width:calc(var(--spacing) * 48)}.w-64{width:calc(var(--spacing) * 64)}.w-\[80px\]{width:80px}.w-\[100px\]{width:100px}.w-\[130px\]{width:130px}.w-\[180px\]{width:180px}.w-\[280px\]{width:280px}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-5xl{max-width:var(--container-5xl)}.max-w-6xl{max-width:var(--container-6xl)}.max-w-7xl{max-width:var(--container-7xl)}.max-w-md{max-width:var(--container-md)}.max-w-sm{max-width:var(--container-sm)}.min-w-0{min-width:calc(var(--spacing) * 0)}.min-w-\[200px\]{min-width:200px}.min-w-\[800px\]{min-width:800px}.flex-1{flex:1}.flex-shrink-0,.shrink-0{flex-shrink:0}.rotate-180{rotate:180deg}.animate-spin{animation:var(--animate-spin)}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.list-inside{list-style-position:inside}.list-disc{list-style-type:disc}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-nowrap{flex-wrap:nowrap}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:calc(var(--spacing) * 1)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-8>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded{border-radius:var(--radius)}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-4{border-style:var(--tw-border-style);border-width:4px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\[var\(--color-accent-primary\)\]{border-color:var(--color-accent-primary)}.border-\[var\(--color-border-default\)\]{border-color:var(--color-border-default)}.border-\[var\(--color-border-primary\)\]{border-color:var(--color-border-primary)}.border-\[var\(--color-border-subtle\)\]{border-color:var(--color-border-subtle)}.border-\[var\(--color-status-error-border\)\]{border-color:var(--color-status-error-border)}.border-\[var\(--color-status-success-border\)\]{border-color:var(--color-status-success-border)}.border-\[var\(--color-status-warning-border\)\]{border-color:var(--color-status-warning-border)}.border-primary{border-color:var(--color-primary)}.border-t-transparent{border-top-color:#0000}.bg-\[var\(--color-accent-primary\)\]{background-color:var(--color-accent-primary)}.bg-\[var\(--color-action-primary-bg\)\]{background-color:var(--color-action-primary-bg)}.bg-\[var\(--color-action-secondary-bg-subtle\)\]{background-color:var(--color-action-secondary-bg-subtle)}.bg-\[var\(--color-background-base\)\]{background-color:var(--color-background-base)}.bg-\[var\(--color-bg-accent\)\]{background-color:var(--color-bg-accent)}.bg-\[var\(--color-bg-canvas\)\]{background-color:var(--color-bg-canvas)}.bg-\[var\(--color-bg-disabled\)\]{background-color:var(--color-bg-disabled)}.bg-\[var\(--color-bg-muted\)\]{background-color:var(--color-bg-muted)}.bg-\[var\(--color-bg-sunken\)\]{background-color:var(--color-bg-sunken)}.bg-\[var\(--color-bg-surface\)\]{background-color:var(--color-bg-surface)}.bg-\[var\(--color-status-error-bg\)\]{background-color:var(--color-status-error-bg)}.bg-\[var\(--color-status-error-bg-subtle\)\]{background-color:var(--color-status-error-bg-subtle)}.bg-\[var\(--color-status-error-subtle\)\]{background-color:var(--color-status-error-subtle)}.bg-\[var\(--color-status-info-bg-subtle\)\]{background-color:var(--color-status-info-bg-subtle)}.bg-\[var\(--color-status-success-bg-subtle\)\]{background-color:var(--color-status-success-bg-subtle)}.bg-\[var\(--color-status-success-subtle\)\]{background-color:var(--color-status-success-subtle)}.bg-\[var\(--color-status-warning-bg\)\]{background-color:var(--color-status-warning-bg)}.bg-\[var\(--color-status-warning-bg-subtle\)\]{background-color:var(--color-status-warning-bg-subtle)}.bg-black\/40{background-color:#0006}@supports (color:color-mix(in lab, red, red)){.bg-black\/40{background-color:color-mix(in oklab, var(--color-black) 40%, transparent)}}.bg-black\/50{background-color:#00000080}@supports (color:color-mix(in lab, red, red)){.bg-black\/50{background-color:color-mix(in oklab, var(--color-black) 50%, transparent)}}.object-contain{-o-object-fit:contain;object-fit:contain}.object-cover{-o-object-fit:cover;object-fit:cover}.p-0\.5{padding:calc(var(--spacing) * .5)}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.p-8{padding:calc(var(--spacing) * 8)}.p-12{padding:calc(var(--spacing) * 12)}.px-1{padding-inline:calc(var(--spacing) * 1)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:calc(var(--spacing) * 1)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-12{padding-block:calc(var(--spacing) * 12)}.py-16{padding-block:calc(var(--spacing) * 16)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pt-12{padding-top:calc(var(--spacing) * 12)}.pr-3\.5{padding-right:calc(var(--spacing) * 3.5)}.pr-4{padding-right:calc(var(--spacing) * 4)}.pr-12{padding-right:calc(var(--spacing) * 12)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pl-3{padding-left:calc(var(--spacing) * 3)}.pl-3\.5{padding-left:calc(var(--spacing) * 3.5)}.pl-\[3\.5rem\]{padding-left:3.5rem}.pl-\[3\.25rem\]{padding-left:3.25rem}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-tight{--tw-leading:var(--leading-tight);line-height:var(--leading-tight)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-widest{--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest)}.break-all{word-break:break-all}.whitespace-nowrap{white-space:nowrap}.text-\[var\(--color-accent-primary\)\]{color:var(--color-accent-primary)}.text-\[var\(--color-action-primary-text\)\]{color:var(--color-action-primary-text)}.text-\[var\(--color-action-secondary-text\)\]{color:var(--color-action-secondary-text)}.text-\[var\(--color-status-error\)\]{color:var(--color-status-error)}.text-\[var\(--color-status-error-text\)\]{color:var(--color-status-error-text)}.text-\[var\(--color-status-info-text\)\]{color:var(--color-status-info-text)}.text-\[var\(--color-status-success\)\]{color:var(--color-status-success)}.text-\[var\(--color-status-success-text\)\]{color:var(--color-status-success-text)}.text-\[var\(--color-status-warning-text\)\]{color:var(--color-status-warning-text)}.text-\[var\(--color-text-disabled\)\]{color:var(--color-text-disabled)}.text-\[var\(--color-text-inverse\)\]{color:var(--color-text-inverse)}.text-\[var\(--color-text-link\)\]{color:var(--color-text-link)}.text-\[var\(--color-text-primary\)\]{color:var(--color-text-primary)}.text-\[var\(--color-text-secondary\)\]{color:var(--color-text-secondary)}.text-\[var\(--color-text-tertiary\)\]{color:var(--color-text-tertiary)}.text-white{color:var(--color-white)}.text-white\/80{color:#fffc}@supports (color:color-mix(in lab, red, red)){.text-white\/80{color:color-mix(in oklab, var(--color-white) 80%, transparent)}}.capitalize{text-transform:capitalize}.lowercase{text-transform:lowercase}.uppercase{text-transform:uppercase}.underline{text-decoration-line:underline}.underline-offset-2{text-underline-offset:2px}.placeholder-\[var\(--color-text-secondary\)\]::placeholder{color:var(--color-text-secondary)}.opacity-0{opacity:0}.opacity-5{opacity:.05}.opacity-25{opacity:.25}.opacity-50{opacity:.5}.opacity-75{opacity:.75}.opacity-80{opacity:.8}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.blur-3xl{--tw-blur:blur(var(--blur-3xl));filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.backdrop-blur{--tw-backdrop-blur:blur(8px);-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.backdrop-blur-sm{--tw-backdrop-blur:blur(var(--blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-shadow{transition-property:box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-300{--tw-duration:.3s;transition-duration:.3s}.outline-none{--tw-outline-style:none;outline-style:none}.select-all{-webkit-user-select:all;user-select:all}@media (hover:hover){.group-hover\:bg-\[var\(--color-action-primary-bg-subtle\)\]:is(:where(.group):hover *){background-color:var(--color-action-primary-bg-subtle)}.group-hover\:bg-\[var\(--color-action-secondary-bg-subtle\)\]:is(:where(.group):hover *){background-color:var(--color-action-secondary-bg-subtle)}.group-hover\:text-\[var\(--color-text-primary\)\]:is(:where(.group):hover *){color:var(--color-text-primary)}.group-hover\:text-indigo-500:is(:where(.group):hover *){color:var(--color-indigo-500)}.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}.peer-checked\:opacity-100:is(:where(.peer):checked~*){opacity:1}.peer-focus\:ring-2:is(:where(.peer):focus~*){--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.placeholder\:text-\[var\(--color-text-tertiary\)\]::placeholder{color:var(--color-text-tertiary)}.last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}@media (hover:hover){.hover\:border-\[var\(--color-action-primary-border\)\]:hover{border-color:var(--color-action-primary-border)}.hover\:border-\[var\(--color-action-secondary-border\)\]:hover{border-color:var(--color-action-secondary-border)}.hover\:border-\[var\(--color-border-strong\)\]:hover{border-color:var(--color-border-strong)}.hover\:bg-\[var\(--color-accent-primary-hover\)\]:hover{background-color:var(--color-accent-primary-hover)}.hover\:bg-\[var\(--color-action-primary-bgHover\)\]:hover{background-color:var(--color-action-primary-bgHover)}.hover\:bg-\[var\(--color-bg-muted\)\]:hover{background-color:var(--color-bg-muted)}.hover\:bg-\[var\(--color-bg-subtle\)\]:hover{background-color:var(--color-bg-subtle)}.hover\:bg-\[var\(--color-bg-sunken\)\]:hover{background-color:var(--color-bg-sunken)}.hover\:bg-\[var\(--color-status-error-bg-subtle\)\]:hover{background-color:var(--color-status-error-bg-subtle)}.hover\:text-\[var\(--color-text-primary\)\]:hover{color:var(--color-text-primary)}.hover\:text-\[var\(--color-text-secondary\)\]:hover{color:var(--color-text-secondary)}.hover\:underline:hover{text-decoration-line:underline}.hover\:opacity-90:hover{opacity:.9}.hover\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.hover\:shadow-md:hover{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}}.focus\:border-primary:focus{border-color:var(--color-primary)}.focus\:border-transparent:focus{border-color:#0000}.focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus\:ring-\[var\(--color-accent-primary\)\]:focus{--tw-ring-color:var(--color-accent-primary)}.focus\:ring-primary\/20:focus{--tw-ring-color:color-mix(in srgb, 221.2 83.2% 53.3% 20%, transparent)}@supports (color:color-mix(in lab, red, red)){.focus\:ring-primary\/20:focus{--tw-ring-color:color-mix(in oklab, var(--color-primary) 20%, transparent)}}.focus\:ring-offset-2:focus{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-40:disabled{opacity:.4}.disabled\:opacity-50:disabled{opacity:.5}.disabled\:opacity-60:disabled{opacity:.6}.disabled\:shadow-none:disabled{--tw-shadow:0 0 #0000;box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}@media (width>=40rem){.sm\:not-sr-only{clip-path:none;white-space:normal;width:auto;height:auto;margin:0;padding:0;position:static;overflow:visible}.sm\:top-6{top:calc(var(--spacing) * 6)}.sm\:right-6{right:calc(var(--spacing) * 6)}.sm\:col-span-2{grid-column:span 2/span 2}.sm\:block{display:block}.sm\:inline{display:inline}.sm\:h-14{height:calc(var(--spacing) * 14)}.sm\:w-12{width:calc(var(--spacing) * 12)}.sm\:w-auto{width:auto}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:justify-between{justify-content:space-between}.sm\:gap-3{gap:calc(var(--spacing) * 3)}.sm\:p-12{padding:calc(var(--spacing) * 12)}.sm\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.sm\:text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}}@media (width>=48rem){.md\:col-span-2{grid-column:span 2/span 2}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:flex-row{flex-direction:row}.md\:items-center{align-items:center}.md\:justify-between{justify-content:space-between}}@media (width>=64rem){.lg\:col-span-1{grid-column:span 1/span 1}.lg\:flex{display:flex}.lg\:hidden{display:none}.lg\:w-1\/2{width:50%}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:text-left{text-align:left}}}.dark{--color-background:222.2 84% 4.9%;--color-foreground:210 40% 98%;--color-card:222.2 84% 4.9%;--color-card-foreground:210 40% 98%;--color-popover:222.2 84% 4.9%;--color-popover-foreground:210 40% 98%;--color-primary:217.2 91.2% 59.8%;--color-primary-foreground:222.2 47.4% 11.2%;--color-secondary:217.2 32.6% 17.5%;--color-secondary-foreground:210 40% 98%;--color-muted:217.2 32.6% 17.5%;--color-muted-foreground:215 20.2% 65.1%;--color-accent:217.2 32.6% 17.5%;--color-accent-foreground:210 40% 98%;--color-destructive:0 62.8% 30.6%;--color-destructive-foreground:210 40% 98%;--color-border:217.2 32.6% 17.5%;--color-input:217.2 32.6% 17.5%;--color-ring:224.3 76.3% 48%}body{font-feature-settings:"rlig" 1, "calt" 1}.auth-primary-button{background:var(--color-action-primary-bg);color:var(--color-action-primary-text);box-shadow:0 12px 30px var(--color-action-primary-bg);border-radius:.75rem}@supports (color:color-mix(in lab, red, red)){.auth-primary-button{box-shadow:0 12px 30px color-mix(in srgb, var(--color-action-primary-bg) 24%, transparent)}}.auth-primary-button{transition:opacity .16s,transform .16s,box-shadow .16s,background-color .16s}.auth-primary-button:hover{opacity:.96;box-shadow:0 16px 36px var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-primary-button:hover{box-shadow:0 16px 36px color-mix(in srgb, var(--color-action-primary-bg) 30%, transparent)}}.auth-primary-button:focus-visible{outline:2px solid var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-primary-button:focus-visible{outline:2px solid color-mix(in srgb, var(--color-action-primary-bg) 45%, transparent)}}.auth-primary-button:focus-visible{outline-offset:2px}.auth-primary-button:disabled{cursor:not-allowed;opacity:.55;box-shadow:none}.auth-brand-badge{background:linear-gradient(135deg, var(--color-action-primary-bg) 0%, var(--color-action-primary-bg) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-brand-badge{background:linear-gradient(135deg, color-mix(in srgb, var(--color-action-primary-bg) 92%, white 8%) 0%, color-mix(in srgb, var(--color-action-primary-bg) 72%, var(--color-bg-surface) 28%) 100%)}}.auth-brand-badge{color:var(--color-action-primary-text);box-shadow:0 12px 30px var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-brand-badge{box-shadow:0 12px 30px color-mix(in srgb, var(--color-action-primary-bg) 22%, transparent)}}.auth-brand-panel{background:radial-gradient(circle at top left, var(--color-action-primary-bg) 0%, transparent 35%), radial-gradient(circle at bottom right, var(--color-text-link) 0%, transparent 38%), linear-gradient(135deg, var(--color-bg-surface) 0%, var(--color-bg-canvas) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-brand-panel{background:radial-gradient(circle at top left, color-mix(in srgb, var(--color-action-primary-bg) 20%, transparent) 0%, transparent 35%), radial-gradient(circle at bottom right, color-mix(in srgb, var(--color-text-link) 18%, transparent) 0%, transparent 38%), linear-gradient(135deg, color-mix(in srgb, var(--color-bg-surface) 92%, black 8%) 0%, color-mix(in srgb, var(--color-bg-canvas) 70%, black 30%) 100%)}}.auth-brand-panel,.auth-brand-copy{color:var(--color-text-primary)}@supports (color:color-mix(in lab, red, red)){.auth-brand-copy{color:color-mix(in srgb, var(--color-text-primary) 88%, white 12%)}}.auth-brand-copy-muted{color:var(--color-text-secondary)}@supports (color:color-mix(in lab, red, red)){.auth-brand-copy-muted{color:color-mix(in srgb, var(--color-text-secondary) 75%, white 25%)}}.auth-highlight-chip{background:var(--color-bg-surface)}@supports (color:color-mix(in lab, red, red)){.auth-highlight-chip{background:color-mix(in srgb, var(--color-bg-surface) 84%, transparent)}}.auth-highlight-chip{border:1px solid var(--color-border-subtle)}@supports (color:color-mix(in lab, red, red)){.auth-highlight-chip{border:1px solid color-mix(in srgb, var(--color-border-subtle) 65%, transparent)}}.auth-highlight-chip{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.auth-shell-gradient{background:linear-gradient(180deg, var(--color-bg-canvas) 0%, var(--color-bg-surface) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-shell-gradient{background:linear-gradient(180deg, color-mix(in srgb, var(--color-bg-canvas) 96%, transparent) 0%, color-mix(in srgb, var(--color-bg-surface) 96%, transparent) 100%)}}.auth-hero-card{background:linear-gradient(135deg, var(--color-action-primary-bg) 0%, var(--color-text-link) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-hero-card{background:linear-gradient(135deg, color-mix(in srgb, var(--color-action-primary-bg) 90%, transparent) 0%, color-mix(in srgb, var(--color-text-link) 70%, var(--color-action-primary-bg) 30%) 100%)}}.auth-hero-card{color:var(--color-action-primary-text);box-shadow:0 18px 42px var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-hero-card{box-shadow:0 18px 42px color-mix(in srgb, var(--color-action-primary-bg) 26%, transparent)}}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}
+/*! tailwindcss v4.3.1 | MIT License | https://tailwindcss.com */
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:Inter, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";--font-mono:"JetBrains Mono", ui-monospace, monospace;--color-indigo-500:oklch(58.5% .233 277.117);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-sm:24rem;--container-md:28rem;--container-2xl:42rem;--container-4xl:56rem;--container-5xl:64rem;--container-6xl:72rem;--container-7xl:80rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-widest:.1em;--leading-tight:1.25;--leading-relaxed:1.625;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--animate-spin:spin 1s linear infinite;--blur-sm:8px;--blur-3xl:64px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--radius:.5rem;--color-primary:221.2 83.2% 53.3%}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-none{pointer-events:none}.invisible{visibility:hidden}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.inset-0{inset:0}.inset-y-0{inset-block:0}.-top-40{top:calc(var(--spacing) * -40)}.top-0{top:0}.top-1\/2{top:50%}.top-4{top:calc(var(--spacing) * 4)}.top-full{top:100%}.-right-20{right:calc(var(--spacing) * -20)}.right-0{right:0}.right-4{right:calc(var(--spacing) * 4)}.-bottom-40{bottom:calc(var(--spacing) * -40)}.bottom-0{bottom:0}.-left-40{left:calc(var(--spacing) * -40)}.left-0{left:0}.left-1\/4{left:25%}.z-10{z-index:10}.z-50{z-index:50}.container{width:100%}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.mx-4{margin-inline:calc(var(--spacing) * 4)}.mx-auto{margin-inline:auto}.my-8{margin-block:calc(var(--spacing) * 8)}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-10{margin-top:calc(var(--spacing) * 10)}.mt-12{margin-top:calc(var(--spacing) * 12)}.mb-1{margin-bottom:var(--spacing)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-5{margin-bottom:calc(var(--spacing) * 5)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.mb-8{margin-bottom:calc(var(--spacing) * 8)}.ml-3{margin-left:calc(var(--spacing) * 3)}.ml-4{margin-left:calc(var(--spacing) * 4)}.ml-auto{margin-left:auto}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.table{display:table}.size-2{width:calc(var(--spacing) * 2);height:calc(var(--spacing) * 2)}.size-3{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-5{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.size-6{width:calc(var(--spacing) * 6);height:calc(var(--spacing) * 6)}.size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}.size-10{width:calc(var(--spacing) * 10);height:calc(var(--spacing) * 10)}.size-12{width:calc(var(--spacing) * 12);height:calc(var(--spacing) * 12)}.size-14{width:calc(var(--spacing) * 14);height:calc(var(--spacing) * 14)}.size-16{width:calc(var(--spacing) * 16);height:calc(var(--spacing) * 16)}.size-20{width:calc(var(--spacing) * 20);height:calc(var(--spacing) * 20)}.size-48{width:calc(var(--spacing) * 48);height:calc(var(--spacing) * 48)}.size-72{width:calc(var(--spacing) * 72);height:calc(var(--spacing) * 72)}.size-80{width:calc(var(--spacing) * 80);height:calc(var(--spacing) * 80)}.size-96{width:calc(var(--spacing) * 96);height:calc(var(--spacing) * 96)}.size-full{width:100%;height:100%}.h-0\.5{height:calc(var(--spacing) * .5)}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-12{height:calc(var(--spacing) * 12)}.h-full{height:100%}.min-h-\[400px\]{min-height:400px}.min-h-screen{min-height:100vh}.w-1\/4{width:25%}.w-2\/4{width:50%}.w-3\/4{width:75%}.w-10{width:calc(var(--spacing) * 10)}.w-48{width:calc(var(--spacing) * 48)}.w-64{width:calc(var(--spacing) * 64)}.w-\[80px\]{width:80px}.w-\[100px\]{width:100px}.w-\[130px\]{width:130px}.w-\[180px\]{width:180px}.w-\[280px\]{width:280px}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-5xl{max-width:var(--container-5xl)}.max-w-6xl{max-width:var(--container-6xl)}.max-w-7xl{max-width:var(--container-7xl)}.max-w-md{max-width:var(--container-md)}.max-w-sm{max-width:var(--container-sm)}.min-w-0{min-width:0}.min-w-\[200px\]{min-width:200px}.min-w-\[800px\]{min-width:800px}.flex-1{flex:1}.flex-shrink-0,.shrink-0{flex-shrink:0}.rotate-180{rotate:180deg}.animate-spin{animation:var(--animate-spin)}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.list-inside{list-style-position:inside}.list-disc{list-style-type:disc}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-nowrap{flex-wrap:nowrap}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-8>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded{border-radius:var(--radius)}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-4{border-style:var(--tw-border-style);border-width:4px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\[var\(--color-accent-primary\)\]{border-color:var(--color-accent-primary)}.border-\[var\(--color-border-default\)\]{border-color:var(--color-border-default)}.border-\[var\(--color-border-primary\)\]{border-color:var(--color-border-primary)}.border-\[var\(--color-border-subtle\)\]{border-color:var(--color-border-subtle)}.border-\[var\(--color-status-error-border\)\]{border-color:var(--color-status-error-border)}.border-\[var\(--color-status-success-border\)\]{border-color:var(--color-status-success-border)}.border-\[var\(--color-status-warning-border\)\]{border-color:var(--color-status-warning-border)}.border-primary{border-color:var(--color-primary)}.border-t-transparent{border-top-color:#0000}.bg-\[var\(--color-accent-primary\)\]{background-color:var(--color-accent-primary)}.bg-\[var\(--color-action-primary-bg\)\]{background-color:var(--color-action-primary-bg)}.bg-\[var\(--color-action-secondary-bg-subtle\)\]{background-color:var(--color-action-secondary-bg-subtle)}.bg-\[var\(--color-background-base\)\]{background-color:var(--color-background-base)}.bg-\[var\(--color-bg-accent\)\]{background-color:var(--color-bg-accent)}.bg-\[var\(--color-bg-canvas\)\]{background-color:var(--color-bg-canvas)}.bg-\[var\(--color-bg-disabled\)\]{background-color:var(--color-bg-disabled)}.bg-\[var\(--color-bg-muted\)\]{background-color:var(--color-bg-muted)}.bg-\[var\(--color-bg-sunken\)\]{background-color:var(--color-bg-sunken)}.bg-\[var\(--color-bg-surface\)\]{background-color:var(--color-bg-surface)}.bg-\[var\(--color-status-error-bg\)\]{background-color:var(--color-status-error-bg)}.bg-\[var\(--color-status-error-bg-subtle\)\]{background-color:var(--color-status-error-bg-subtle)}.bg-\[var\(--color-status-error-subtle\)\]{background-color:var(--color-status-error-subtle)}.bg-\[var\(--color-status-info-bg-subtle\)\]{background-color:var(--color-status-info-bg-subtle)}.bg-\[var\(--color-status-success-bg-subtle\)\]{background-color:var(--color-status-success-bg-subtle)}.bg-\[var\(--color-status-success-subtle\)\]{background-color:var(--color-status-success-subtle)}.bg-\[var\(--color-status-warning-bg\)\]{background-color:var(--color-status-warning-bg)}.bg-\[var\(--color-status-warning-bg-subtle\)\]{background-color:var(--color-status-warning-bg-subtle)}.bg-black\/40{background-color:#0006}@supports (color:color-mix(in lab, red, red)){.bg-black\/40{background-color:color-mix(in oklab, var(--color-black) 40%, transparent)}}.bg-black\/50{background-color:#00000080}@supports (color:color-mix(in lab, red, red)){.bg-black\/50{background-color:color-mix(in oklab, var(--color-black) 50%, transparent)}}.object-contain{-o-object-fit:contain;object-fit:contain}.object-cover{-o-object-fit:cover;object-fit:cover}.p-0\.5{padding:calc(var(--spacing) * .5)}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.p-8{padding:calc(var(--spacing) * 8)}.p-12{padding:calc(var(--spacing) * 12)}.px-1{padding-inline:var(--spacing)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-12{padding-block:calc(var(--spacing) * 12)}.py-16{padding-block:calc(var(--spacing) * 16)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pt-12{padding-top:calc(var(--spacing) * 12)}.pr-3\.5{padding-right:calc(var(--spacing) * 3.5)}.pr-4{padding-right:calc(var(--spacing) * 4)}.pr-12{padding-right:calc(var(--spacing) * 12)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pl-3{padding-left:calc(var(--spacing) * 3)}.pl-3\.5{padding-left:calc(var(--spacing) * 3.5)}.pl-\[3\.5rem\]{padding-left:3.5rem}.pl-\[3\.25rem\]{padding-left:3.25rem}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-tight{--tw-leading:var(--leading-tight);line-height:var(--leading-tight)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-widest{--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest)}.break-all{word-break:break-all}.whitespace-nowrap{white-space:nowrap}.text-\[var\(--color-accent-primary\)\]{color:var(--color-accent-primary)}.text-\[var\(--color-action-primary-bg\)\]{color:var(--color-action-primary-bg)}.text-\[var\(--color-action-primary-text\)\]{color:var(--color-action-primary-text)}.text-\[var\(--color-action-secondary-text\)\]{color:var(--color-action-secondary-text)}.text-\[var\(--color-status-error\)\]{color:var(--color-status-error)}.text-\[var\(--color-status-error-text\)\]{color:var(--color-status-error-text)}.text-\[var\(--color-status-info-text\)\]{color:var(--color-status-info-text)}.text-\[var\(--color-status-success\)\]{color:var(--color-status-success)}.text-\[var\(--color-status-success-text\)\]{color:var(--color-status-success-text)}.text-\[var\(--color-status-warning-text\)\]{color:var(--color-status-warning-text)}.text-\[var\(--color-text-disabled\)\]{color:var(--color-text-disabled)}.text-\[var\(--color-text-inverse\)\]{color:var(--color-text-inverse)}.text-\[var\(--color-text-link\)\]{color:var(--color-text-link)}.text-\[var\(--color-text-primary\)\]{color:var(--color-text-primary)}.text-\[var\(--color-text-secondary\)\]{color:var(--color-text-secondary)}.text-\[var\(--color-text-tertiary\)\]{color:var(--color-text-tertiary)}.text-white{color:var(--color-white)}.capitalize{text-transform:capitalize}.lowercase{text-transform:lowercase}.uppercase{text-transform:uppercase}.underline{text-decoration-line:underline}.underline-offset-2{text-underline-offset:2px}.placeholder-\[var\(--color-text-secondary\)\]::placeholder{color:var(--color-text-secondary)}.opacity-0{opacity:0}.opacity-5{opacity:.05}.opacity-25{opacity:.25}.opacity-50{opacity:.5}.opacity-75{opacity:.75}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.blur-3xl{--tw-blur:blur(var(--blur-3xl));filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.backdrop-blur-sm{--tw-backdrop-blur:blur(var(--blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-shadow{transition-property:box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-300{--tw-duration:.3s;transition-duration:.3s}.outline-none{--tw-outline-style:none;outline-style:none}.select-all{-webkit-user-select:all;user-select:all}@media (hover:hover){.group-hover\:bg-\[var\(--color-action-primary-bg-subtle\)\]:is(:where(.group):hover *){background-color:var(--color-action-primary-bg-subtle)}.group-hover\:bg-\[var\(--color-action-secondary-bg-subtle\)\]:is(:where(.group):hover *){background-color:var(--color-action-secondary-bg-subtle)}.group-hover\:text-\[var\(--color-text-primary\)\]:is(:where(.group):hover *){color:var(--color-text-primary)}.group-hover\:text-indigo-500:is(:where(.group):hover *){color:var(--color-indigo-500)}.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}.peer-checked\:opacity-100:is(:where(.peer):checked~*){opacity:1}.peer-focus\:ring-2:is(:where(.peer):focus~*){--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.placeholder\:text-\[var\(--color-text-tertiary\)\]::placeholder{color:var(--color-text-tertiary)}.last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}@media (hover:hover){.hover\:border-\[var\(--color-action-primary-border\)\]:hover{border-color:var(--color-action-primary-border)}.hover\:border-\[var\(--color-action-secondary-border\)\]:hover{border-color:var(--color-action-secondary-border)}.hover\:border-\[var\(--color-border-strong\)\]:hover{border-color:var(--color-border-strong)}.hover\:bg-\[var\(--color-accent-primary-hover\)\]:hover{background-color:var(--color-accent-primary-hover)}.hover\:bg-\[var\(--color-action-primary-bgHover\)\]:hover{background-color:var(--color-action-primary-bgHover)}.hover\:bg-\[var\(--color-bg-muted\)\]:hover{background-color:var(--color-bg-muted)}.hover\:bg-\[var\(--color-bg-subtle\)\]:hover{background-color:var(--color-bg-subtle)}.hover\:bg-\[var\(--color-bg-sunken\)\]:hover{background-color:var(--color-bg-sunken)}.hover\:bg-\[var\(--color-status-error-bg-subtle\)\]:hover{background-color:var(--color-status-error-bg-subtle)}.hover\:text-\[var\(--color-text-primary\)\]:hover{color:var(--color-text-primary)}.hover\:text-\[var\(--color-text-secondary\)\]:hover{color:var(--color-text-secondary)}.hover\:underline:hover{text-decoration-line:underline}.hover\:opacity-90:hover{opacity:.9}.hover\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.hover\:shadow-md:hover{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}}.focus\:border-primary:focus{border-color:var(--color-primary)}.focus\:border-transparent:focus{border-color:#0000}.focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus\:ring-\[var\(--color-accent-primary\)\]:focus{--tw-ring-color:var(--color-accent-primary)}.focus\:ring-primary\/20:focus{--tw-ring-color:color-mix(in srgb, 221.2 83.2% 53.3% 20%, transparent)}@supports (color:color-mix(in lab, red, red)){.focus\:ring-primary\/20:focus{--tw-ring-color:color-mix(in oklab, var(--color-primary) 20%, transparent)}}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-40:disabled{opacity:.4}.disabled\:opacity-50:disabled{opacity:.5}.disabled\:opacity-60:disabled{opacity:.6}@media (width>=40rem){.sm\:not-sr-only{clip-path:none;white-space:normal;width:auto;height:auto;margin:0;padding:0;position:static;overflow:visible}.sm\:top-6{top:calc(var(--spacing) * 6)}.sm\:right-6{right:calc(var(--spacing) * 6)}.sm\:col-span-2{grid-column:span 2/span 2}.sm\:block{display:block}.sm\:inline{display:inline}.sm\:h-14{height:calc(var(--spacing) * 14)}.sm\:w-12{width:calc(var(--spacing) * 12)}.sm\:w-auto{width:auto}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:justify-between{justify-content:space-between}.sm\:gap-3{gap:calc(var(--spacing) * 3)}.sm\:p-12{padding:calc(var(--spacing) * 12)}.sm\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.sm\:text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}}@media (width>=48rem){.md\:col-span-2{grid-column:span 2/span 2}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:flex-row{flex-direction:row}.md\:items-center{align-items:center}.md\:justify-between{justify-content:space-between}}@media (width>=64rem){.lg\:col-span-1{grid-column:span 1/span 1}.lg\:flex{display:flex}.lg\:hidden{display:none}.lg\:w-1\/2{width:50%}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:text-left{text-align:left}}}.dark{--color-background:222.2 84% 4.9%;--color-foreground:210 40% 98%;--color-card:222.2 84% 4.9%;--color-card-foreground:210 40% 98%;--color-popover:222.2 84% 4.9%;--color-popover-foreground:210 40% 98%;--color-primary:217.2 91.2% 59.8%;--color-primary-foreground:222.2 47.4% 11.2%;--color-secondary:217.2 32.6% 17.5%;--color-secondary-foreground:210 40% 98%;--color-muted:217.2 32.6% 17.5%;--color-muted-foreground:215 20.2% 65.1%;--color-accent:217.2 32.6% 17.5%;--color-accent-foreground:210 40% 98%;--color-destructive:0 62.8% 30.6%;--color-destructive-foreground:210 40% 98%;--color-border:217.2 32.6% 17.5%;--color-input:217.2 32.6% 17.5%;--color-ring:224.3 76.3% 48%}body{font-feature-settings:"rlig" 1, "calt" 1}.auth-primary-button{background:var(--color-action-primary-bg);color:var(--color-action-primary-text);box-shadow:0 12px 30px var(--color-action-primary-bg);border-radius:.75rem}@supports (color:color-mix(in lab, red, red)){.auth-primary-button{box-shadow:0 12px 30px color-mix(in srgb, var(--color-action-primary-bg) 24%, transparent)}}.auth-primary-button{transition:opacity .16s,transform .16s,box-shadow .16s,background-color .16s}.auth-primary-button:hover{opacity:.96;box-shadow:0 16px 36px var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-primary-button:hover{box-shadow:0 16px 36px color-mix(in srgb, var(--color-action-primary-bg) 30%, transparent)}}.auth-primary-button:focus-visible{outline:2px solid var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-primary-button:focus-visible{outline:2px solid color-mix(in srgb, var(--color-action-primary-bg) 45%, transparent)}}.auth-primary-button:focus-visible{outline-offset:2px}.auth-primary-button:disabled{cursor:not-allowed;opacity:.55;box-shadow:none}.auth-brand-badge{background:linear-gradient(135deg, var(--color-action-primary-bg) 0%, var(--color-action-primary-bg) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-brand-badge{background:linear-gradient(135deg, color-mix(in srgb, var(--color-action-primary-bg) 92%, white 8%) 0%, color-mix(in srgb, var(--color-action-primary-bg) 72%, var(--color-bg-surface) 28%) 100%)}}.auth-brand-badge{color:var(--color-action-primary-text);box-shadow:0 12px 30px var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-brand-badge{box-shadow:0 12px 30px color-mix(in srgb, var(--color-action-primary-bg) 22%, transparent)}}.auth-brand-panel{background:radial-gradient(circle at top left, var(--color-action-primary-bg) 0%, transparent 35%), radial-gradient(circle at bottom right, var(--color-text-link) 0%, transparent 38%), linear-gradient(135deg, var(--color-bg-surface) 0%, var(--color-bg-canvas) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-brand-panel{background:radial-gradient(circle at top left, color-mix(in srgb, var(--color-action-primary-bg) 20%, transparent) 0%, transparent 35%), radial-gradient(circle at bottom right, color-mix(in srgb, var(--color-text-link) 18%, transparent) 0%, transparent 38%), linear-gradient(135deg, color-mix(in srgb, var(--color-bg-surface) 92%, black 8%) 0%, color-mix(in srgb, var(--color-bg-canvas) 70%, black 30%) 100%)}}.auth-brand-panel,.auth-brand-copy{color:var(--color-text-primary)}@supports (color:color-mix(in lab, red, red)){.auth-brand-copy{color:color-mix(in srgb, var(--color-text-primary) 88%, white 12%)}}.auth-brand-copy-muted{color:var(--color-text-secondary)}@supports (color:color-mix(in lab, red, red)){.auth-brand-copy-muted{color:color-mix(in srgb, var(--color-text-secondary) 75%, white 25%)}}.auth-highlight-chip{background:var(--color-bg-surface)}@supports (color:color-mix(in lab, red, red)){.auth-highlight-chip{background:color-mix(in srgb, var(--color-bg-surface) 84%, transparent)}}.auth-highlight-chip{border:1px solid var(--color-border-subtle)}@supports (color:color-mix(in lab, red, red)){.auth-highlight-chip{border:1px solid color-mix(in srgb, var(--color-border-subtle) 65%, transparent)}}.auth-highlight-chip{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.auth-shell-gradient{background:linear-gradient(180deg, var(--color-bg-canvas) 0%, var(--color-bg-surface) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-shell-gradient{background:linear-gradient(180deg, color-mix(in srgb, var(--color-bg-canvas) 96%, transparent) 0%, color-mix(in srgb, var(--color-bg-surface) 96%, transparent) 100%)}}.auth-hero-card{background:linear-gradient(135deg, var(--color-action-primary-bg) 0%, var(--color-text-link) 100%)}@supports (color:color-mix(in lab, red, red)){.auth-hero-card{background:linear-gradient(135deg, color-mix(in srgb, var(--color-action-primary-bg) 90%, transparent) 0%, color-mix(in srgb, var(--color-text-link) 70%, var(--color-action-primary-bg) 30%) 100%)}}.auth-hero-card{color:var(--color-action-primary-text);box-shadow:0 18px 42px var(--color-action-primary-bg)}@supports (color:color-mix(in lab, red, red)){.auth-hero-card{box-shadow:0 18px 42px color-mix(in srgb, var(--color-action-primary-bg) 26%, transparent)}}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}
 /*$vite$:1*/

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@burdenoff/microfe-auth",
-  "version": "2026.624.3",
+  "version": "2026.626.1",
   "description": "Auth microfrontend for Burdenoff products",
   "type": "module",
   "imports": {
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@apollo/client": "^4.0.9",
-    "@burdenoff/fe-libs": "2026.530.8",
+    "@burdenoff/fe-libs": "2026.625.5",
     "@types/qrcode.react": "^3.0.0",
     "clsx": "^2.1.1",
     "graphql": "^16.12.0",