Theme assignment failing for jQuery Mobile on ASP.NET MVC 3

I'm trying to create a web application using ASP.NET MVC 3 and jQuery Mobile. All I am trying to do is get a simple page to run.

I have added the meta, script, and css references to my head:

<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="@Url.Content("~/Content/themes/mobile/jquery.mobile-1.1.0-rc.1.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.7.2.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.mobile-1.1.0-rc.1.js")" type="text/javascript"></script>

and my body is simply:

@RenderBody()

On my Index view I have the basic jQuery page markup:

<div data-role="page">
    <div data-role="header">
        <h1>Page Title</h1>
    </div>
    <div data-role="content">
        <h2>@ViewBag.Message</h2>
        <p>
            To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">
                http://asp.net/mvc</a>.
        </p>
    </div>
    <div data-role="footer">
        <h4>Page Footer</h4>
    </div>
</div>

The jQuery Mobile is initialized, since (most of) the correct classes are being added to the page/header/content/footer divs, but for some reason it is not finding the correct data for the theme.

What ends up happening is the page ends up looking like this:

<div data-role="page" tabindex="0" class="ui-page ui-body-[object Object] ui-page-active" style="min-height: 965px; ">

The correct page should look like this:

<div data-role="page" tabindex="0" class="ui-page ui-body-c ui-page-active" style="min-height: 965px; ">

I have even tried manually declaring the page theme:

<div data-role="page" data-theme="c">

but this doesn't change the outcome.

Any idea on why this is happening?