Index: /CKEditor/branches/features/kama/_source/skins/kama/skin.js
===================================================================
--- /CKEditor/branches/features/kama/_source/skins/kama/skin.js	(revision 3561)
+++ /CKEditor/branches/features/kama/_source/skins/kama/skin.js	(revision 3562)
@@ -34,6 +34,6 @@
 .cke_skin_kama .cke_menuitem .cke_icon_wrapper\
 {\
-	background-color: ${color} !important;\
-	border-color: ${color} !important;\
+	background-color: $color !important;\
+	border-color: $color !important;\
 }\
 \
@@ -42,6 +42,6 @@
 .cke_skin_kama .cke_menuitem a:active .cke_icon_wrapper\
 {\
-	background-color: ${color} !important;\
-	border-color: ${color} !important;\
+	background-color: $color !important;\
+	border-color: $color !important;\
 }\
 \
@@ -50,5 +50,5 @@
 .cke_skin_kama .cke_menuitem a:active .cke_label\
 {\
-	background-color: ${color} !important;\
+	background-color: $color !important;\
 }\
 \
@@ -64,17 +64,17 @@
 .cke_skin_kama .cke_menuitem a.cke_disabled:active .cke_icon_wrapper\
 {\
-	background-color: ${color} !important;\
-	border-color: ${color} !important;\
+	background-color: $color !important;\
+	border-color: $color !important;\
 }\
 \
 .cke_skin_kama .cke_menuitem a.cke_disabled .cke_icon_wrapper\
 {\
-	background-color: ${color} !important;\
-	border-color: ${color} !important;\
+	background-color: $color !important;\
+	border-color: $color !important;\
 }\
 \
 .cke_skin_kama .cke_menuseparator\
 {\
-	background-color: ${color} !important;\
+	background-color: $color !important;\
 }\
 \
@@ -83,19 +83,37 @@
 .cke_skin_kama .cke_menuitem a:active\
 {\
-	background-color: ${color} !important;\
+	background-color: $color !important;\
 }";
 
-				uiStyle.setAttribute("type", "text/css");
-				var regex = /\$\{color\}/g;
+				uiStyle.setAttribute( "type", "text/css" );
+				var regex = /\$color/g;
+
+				// We have to split CSS declarations for webkit.
+				if ( CKEDITOR.env.webkit )
+				{
+					cssSrc = cssSrc.split( '}' ).slice( 0, -1 );
+					for ( var i in cssSrc )
+							cssSrc[ i ] = cssSrc[ i ].split( '{' );
+				}
 
 				return ( menuSetUiColor =
 					function( color )
 					{
-						var css = cssSrc.replace( regex, color );
-
-						if ( CKEDITOR.env.ie )
-							uiStyle.$.styleSheet.cssText = css;
+						if ( CKEDITOR.env.webkit )
+						{
+							for ( var i in cssSrc )
+								uiStyle.$.sheet.addRule(
+									cssSrc[ i ][ 0 ], cssSrc[ i ][ 1 ].replace( regex, color )
+								);
+						}
 						else
-							uiStyle.setHtml( css );
+						{
+							var css = cssSrc.replace( regex, color );
+
+							if ( CKEDITOR.env.ie )
+								uiStyle.$.styleSheet.cssText = css;
+							else
+								uiStyle.setHtml( css );
+						}
 					})( color );
 			}
@@ -121,8 +139,6 @@
 							cssId + "_dialog a.cke_dialog_tab",
 							cssId + "_dialog .cke_dialog_footer"
-						];
-
-					var cssSrc = cssSelectors.join( ',' )
-							+ "{ background-color: ${color} !important; }";
+						].join( ',' );
+					var cssProperties = "background-color: $color !important;";
 
 					uiStyle.setAttribute("type", "text/css");
@@ -131,11 +147,13 @@
 						function( color )
 						{
-							var css = cssSrc.replace( '${color}', color );
+							var css = cssProperties.replace( '$color', color );
 							editor.uiColor = color;
-							
+
 							if ( CKEDITOR.env.ie )
-								uiStyle.$.styleSheet.cssText = css;
+								uiStyle.$.styleSheet.cssText = cssSelectors + '{' + css + '}';
+							else if ( CKEDITOR.env.webkit )
+								uiStyle.$.sheet.addRule( cssSelectors, css );
 							else
-								uiStyle.setHtml( css );
+								uiStyle.setHtml( cssSelectors + '{' + css + '}' );
 
 							menuSetUiColor( color );
@@ -165,4 +183,19 @@
 			if ( editor.config.uiColor )
 				editor.setUiColor( editor.config.uiColor );
+
+			// Fix editor width
+			editor.on( 'mode', function( event )
+			{
+				if ( !CKEDITOR.env.ie || CKEDITOR.env.version >= 8 || CKEDITOR.env.quirks )
+					return;
+				if ( editor.mode == 'wysiwyg' )
+					editor.container.getElementsByTag( 'iframe' ).getItem(0).setStyle( 'width', '99%' );
+				else if ( editor.mode == 'source' )
+				{
+					var textarea = editor.container.getElementsByTag( 'textarea' ).getItem(0),
+						width = parseInt( textarea.getStyle( 'width' ) );
+					textarea.setStyle( 'width' , (width - 10) + 'px' );
+				}
+			});
 		}
 	};
Index: /CKEditor/branches/features/kama/_source/skins/kama/toolbar.css
===================================================================
--- /CKEditor/branches/features/kama/_source/skins/kama/toolbar.css	(revision 3561)
+++ /CKEditor/branches/features/kama/_source/skins/kama/toolbar.css	(revision 3562)
@@ -228,5 +228,5 @@
 {
 	display: inline-block;
-	height: 18px;
+	height: 17px;
 	width: 8px;
 	background-position: right center;
@@ -324,5 +324,5 @@
 
 .cke_skin_kama .cke_rtl.cke_browser_gecko .cke_button .cke_label,
-.cke_skin_kama .cke_rtl.cke_browser_gecko .cke_break
+.cke_skin_kama .cke_rtl.cke_browser_gearrcko .cke_break
 {
 	float: right;
@@ -330,5 +330,6 @@
 
 .cke_skin_kama .cke_browser_ie8 .cke_button .cke_label,
-.cke_skin_kama .cke_browser_opera .cke_button .cke_label
+.cke_skin_kama .cke_browser_opera .cke_button .cke_label,
+.cke_skin_kama .cke_browser_webkit .cke_button .cke_label
 {
 	float: right;
@@ -336,5 +337,6 @@
 
 .cke_skin_kama .cke_browser_ie8 .cke_rtl .cke_button .cke_label,
-.cke_skin_kama .cke_browser_opera .cke_rtl .cke_button .cke_label
+.cke_skin_kama .cke_browser_opera .cke_rtl .cke_button .cke_label,
+.cke_skin_kama .cke_browser_webkit .cke_rtl .cke_button .cke_label
 {
 	float: left;
Index: /CKEditor/branches/features/kama/_source/skins/v2/toolbar.css
===================================================================
--- /CKEditor/branches/features/kama/_source/skins/v2/toolbar.css	(revision 3561)
+++ /CKEditor/branches/features/kama/_source/skins/v2/toolbar.css	(revision 3562)
@@ -218,5 +218,5 @@
 {
 	display: inline-block;
-	height: 18px;
+	height: 17px;
 	width: 8px;
 	background-position: right center;