PopUpManager displays layout reversed with altered styling

Problem occurred when trying to run a Flex 3 app in FlashBuilder 4. Running Flex 3 compatiblity mode using the Halo theme on Windows 7. Here is the code to reproduce.

THE APPLICATION
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx" layout="absolute" minWidth="955"
minHeight="600" creationComplete="initApp()">
<fx:Script>
<![CDATA[
import mx.core.FlexGlobals;
import mx.managers.PopUpManager;
public function initApp():void

{ var loginDialog:login=login(PopUpManager.createPopUp(DisplayObject(FlexGlobals.topLevelApplication), login)); PopUpManager.centerPopUp(loginDialog); }

]]
>
</fx:Script>
</mx:Application>

THEN THE PANEL
<?xml version="1.0" encoding="utf-8"?>
<mx:Panel title="Metalsmith: Login - Version " xmlns:mx="http://www.adobe.com/2006/mxml" verticalGap="0" horizontalScrollPolicy="off"
verticalScrollPolicy="off">
<mx:Form defaultButton="

{submitButton}

" height="126" width="400" horizontalScrollPolicy="off"
verticalScrollPolicy="off" id="form1">
<mx:FormItem label="Email:" required="true" width="100%">
<mx:TextInput id="ti_userName" width="100%"/>
</mx:FormItem>
<mx:FormItem label="Password:" required="true" width="100%">
<mx:TextInput id="ti_password" displayAsPassword="true" width="100%"/>
</mx:FormItem>
<mx:FormItem label="" width="100%" direction="horizontal">
<mx:Button label="Send Login" id="submitButton"/>
</mx:FormItem>
</mx:Form>
</mx:Panel>

Workaround (if any):
In Flex 4.1, explicitly set the direction and layoutDirection to "ltr" (although this shouldnt be needed).

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:mx="library://ns.adobe.com/flex/mx"
creationComplete="init();"
layoutDirection="ltr" direction="ltr">