diff --git a/js/client-rooms.js b/js/client-rooms.js
index ae7e9f11b..d54613d86 100644
--- a/js/client-rooms.js
+++ b/js/client-rooms.js
@@ -80,9 +80,9 @@
 			if (rooms.userCount) {
 				var userCount = Number(rooms.userCount);
 				var battleCount = Number(rooms.battleCount);
-				var leftSide = '<span style="' + Dex.getPokemonIcon('meloetta', true) + ';" class="picon icon-left" title="Meloetta is PS\'s mascot! The Aria forme is about using its voice, and represents our chatrooms."></span> <button class="button" name="finduser" title="Find an online user"><strong>' + userCount + '</strong> ' + (userCount == 1 ? 'user' : 'users') + ' online</button>';
-				var rightSide = '<button class="button" name="roomlist" title="Watch an active battle"><strong>' + battleCount + '</strong> active ' + (battleCount == 1 ? 'battle' : 'battles') + '</button> <span style="' + Dex.getPokemonIcon('meloetta-pirouette') + '" class="picon icon-right" title="Meloetta is PS\'s mascot! The Pirouette forme is Fighting-type, and represents our battles."></span>';
-				this.$('.roomlisttop').html('<table class="roomcounters" border="0" cellspacing="0" cellpadding="0" width="100%"><tr><td>' + leftSide + '</td><td>' + rightSide + '</td></tr></table>');
+				var leftSide = '<button class="button" name="finduser" title="Find an online user"><span class="pixelated usercount" title="Meloetta is PS\'s mascot! The Aria forme is about using its voice, and represents our chatrooms." ></span><strong>' + userCount + '</strong> ' + (userCount == 1 ? 'user' : 'users') + ' online</button> ';
+				var rightSide = '<button class="button" name="roomlist" title="Watch an active battle"><span class="pixelated battlecount" title="Meloetta is PS\'s mascot! The Pirouette forme is Fighting-type, and represents our battles." ></span><strong>' + battleCount + '</strong> active ' + (battleCount == 1 ? 'battle' : 'battles') + '</button>';
+				this.$('.roomlisttop').html('<div class="roomcounters">' + leftSide + '</td><td>' + rightSide + '</div>');
 			}
 			this.$('.roomlist').first().html('<h2 class="rooms-officialchatrooms">Official chat rooms</h2>' + _.map(rooms.official, this.renderRoomBtn).join("") +
 				(rooms.pspl && rooms.pspl.length ? '<a href="https://www.smogon.com/forums/threads/3649563/" target="_blank"><h2 class="rooms-psplchatrooms">PSPL Winner</h2></a>' + _.map(rooms.pspl, this.renderRoomBtn).join("") : ''));
diff --git a/src/panel-rooms.tsx b/src/panel-rooms.tsx
index 156c82d8a..9ebd9d288 100644
--- a/src/panel-rooms.tsx
+++ b/src/panel-rooms.tsx
@@ -136,22 +136,20 @@ class RoomsPanel extends PSRoomPanel {
 				<i class="fa fa-caret-right"></i> Hide
 			</button>
 			<div class="roomcounters">
-				<span
-					style="background:transparent url(https://play.pokemonshowdown.com/sprites/pokemonicons-sheet.png?a5) no-repeat scroll -0px -2790px;"
-					class="picon icon-left"
-					title="Meloetta is PS's mascot! The Aria forme is about using its voice, and represents our chatrooms."
-				></span> {}
 				<button class="button" data-href="/users" title="Find an online user">
+					<span
+						class="pixelated usercount"
+						title="Meloetta is PS's mascot! The Aria forme is about using its voice, and represents our chatrooms."
+					></span>
 					<strong>{rooms.userCount || '-'}</strong> users online
 				</button> {}
 				<button class="button" data-href="/battles" title="Watch an active battle">
+					<span
+						class="pixelated battlecount"
+						title="Meloetta is PS's mascot! The Pirouette forme is Fighting-type, and represents our battles."
+					></span>
 					<strong>{rooms.battleCount || '-'}</strong> active battles
-				</button> {}
-				<span
-					style="background:transparent url(https://play.pokemonshowdown.com/sprites/pokemonicons-sheet.png?a5) no-repeat scroll -0px -2220px"
-					class="picon icon-right"
-					title="Meloetta is PS's mascot! The Pirouette forme is Fighting-type, and represents our battles."
-				></span>
+				</button>
 			</div>
 			<div>
 				<input
diff --git a/style/client.css b/style/client.css
index 9d58d39f9..8cabad36a 100644
--- a/style/client.css
+++ b/style/client.css
@@ -1220,10 +1220,8 @@ p.or:after {
 	margin-bottom: 10px;
 }
 .roomcounters {
-	margin: 4px auto;
-	max-width: 400px;
-}
-.roomcounters td {
+	max-width: 480px;
+	margin: 8px 0 15px 0;
 	text-align: center;
 }
 .roomcounters button {
@@ -1232,22 +1230,38 @@ p.or:after {
 	height: 60px;
 	padding: 3px 8px;
 	text-align: center;
+	vertical-align: middle;
 	font-size: 10pt;
+	position: relative;
 }
 .roomcounters button strong {
 	display: block;
 	font-size: 18pt;
 	font-weight: normal;
 }
-.roomcounters .icon-left {
-	display: inline-block;
-	vertical-align: middle;
-	transform:scaleX(-1);
-	webkit-transform:scaleX(-1);
+.roomcounters .usercount {
+	display: block;
+	width: 49px;
+	height: 63px;
+	position: absolute;
+	left: -30px;
+	bottom: -5px;
+	background: url(https://play.pokemonshowdown.com/sprites/gen5/meloetta.png) center no-repeat;
 }
-.roomcounters .icon-right {
-	display: inline-block;
-	vertical-align: middle;
+.roomcounters button:hover .usercount {
+	background: url(https://play.pokemonshowdown.com/sprites/gen5ani/meloetta.gif) center no-repeat;
+}
+.roomcounters .battlecount {
+	display: block;
+	width: 46px;
+	height: 76px;
+	position: absolute;
+	right: -30px;
+	bottom: -10px;
+	background: url(https://play.pokemonshowdown.com/sprites/gen5/meloetta-pirouette.png) center no-repeat;
+}
+.roomcounters button:hover .battlecount {
+	background: url(https://play.pokemonshowdown.com/sprites/gen5ani/meloetta-pirouette.gif) center no-repeat;
 }
 
 .roomlist {
diff --git a/style/client2.css b/style/client2.css
index 02478168d..67157897c 100644
--- a/style/client2.css
+++ b/style/client2.css
@@ -914,8 +914,8 @@ p.or:after {
 
 .roomcounters {
 	max-width: 480px;
-  margin: 4px 0 10px;
-  text-align: center;
+	margin: 8px 0 15px 0;
+	text-align: center;
 }
 .roomcounters button {
 	margin: 0 auto;
@@ -923,22 +923,38 @@ p.or:after {
 	height: 60px;
 	padding: 3px 8px;
 	text-align: center;
+	vertical-align: middle;
 	font-size: 10pt;
+	position: relative;
 }
 .roomcounters button strong {
 	display: block;
 	font-size: 18pt;
 	font-weight: normal;
 }
-.roomcounters .icon-left {
-	display: inline-block;
-	vertical-align: middle;
-	transform: scaleX(-1);
-	-webkit-transform: scaleX(-1);
+.roomcounters .usercount {
+	display: block;
+	width: 49px;
+	height: 63px;
+	position: absolute;
+	left: -30px;
+	bottom: -5px;
+	background: url(https://play.pokemonshowdown.com/sprites/gen5/meloetta.png) center no-repeat;
 }
-.roomcounters .icon-right {
-	display: inline-block;
-	vertical-align: middle;
+.roomcounters button:hover .usercount {
+	background: url(https://play.pokemonshowdown.com/sprites/gen5ani/meloetta.gif) center no-repeat;
+}
+.roomcounters .battlecount {
+	display: block;
+	width: 46px;
+	height: 76px;
+	position: absolute;
+	right: -30px;
+	bottom: -10px;
+	background: url(https://play.pokemonshowdown.com/sprites/gen5/meloetta-pirouette.png) center no-repeat;
+}
+.roomcounters button:hover .battlecount {
+	background: url(https://play.pokemonshowdown.com/sprites/gen5ani/meloetta-pirouette.gif) center no-repeat;
 }
 
 .roomlist {