CSS class selector doesn't work for me

ApacheRoyaleCSSIssue.mxml

<?xml version="1.0" encoding="utf-8"?>
<js:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
				xmlns:js="library://ns.apache.org/royale/basic">
	
	<fx:Script>
		<![CDATA[
			import components.ACEEditor;
			
			protected var aceEditor:ACEEditor;
			
			private function onInitComplete():void {
				
				this.aceEditor = new ACEEditor("editor");
				this.aceEditor.setValue("Hello world");
				this.aceEditor.setTheme("ace/theme/chrome");
				this.aceEditor.setMode("ace/mode/actionscript");
			}
			
		]]>
	</fx:Script>
	
	<js:valuesImpl>
		<js:SimpleCSSValuesImpl />
	</js:valuesImpl>
	
	<fx:Style>
		@namespace "http://www.w3.org/1999/xhtml";
		@namespace js "library://ns.apache.org/royale/basic";
	
		global {
			/* This works:
			font-family: monospace;
			*/
		}
		
		.aceEditor {
			/* This doesn't work */
			font-family: monospace;
		}
	</fx:Style>	 
	
	<js:initialView>
		<js:View id="mainView" width="100%" height="100%" currentState="default" initComplete="onInitComplete()">
			<js:beads>
				<js:VerticalLayout />
				<js:SimpleStatesImpl />
      </js:beads>
			<js:Group id="editor" className="aceEditor" width="100%" height="100%" />
		</js:View>
	</js:initialView>
	
 </js:Application>