diff --git a/public/stylesheets/board.css b/public/stylesheets/board.css
index bc1c67ac2f..8c91522682 100644
--- a/public/stylesheets/board.css
+++ b/public/stylesheets/board.css
@@ -621,7 +621,7 @@ div.table {
   transition: background-color 0.13s;
 }
 .pocket.usable piece:hover {
-  background: #999;
+  background-color: #999;
 }
 .pocket piece::after {
   content: attr(data-nb);
diff --git a/ui/analyse/src/crazy/crazyView.js b/ui/analyse/src/crazy/crazyView.js
index f7348e92e0..083e41adda 100644
--- a/ui/analyse/src/crazy/crazyView.js
+++ b/ui/analyse/src/crazy/crazyView.js
@@ -2,21 +2,6 @@ var crazyDrag = require('./crazyDrag');
 var partial = require('chessground').util.partial;
 var m = require('mithril');
 
-function crazyPocketTag(role, color) {
-  return {
-    tag: 'div',
-    attrs: {
-      class: 'no-square'
-    },
-    children: [{
-      tag: 'piece',
-      attrs: {
-        class: role + ' ' + color
-      }
-    }]
-  };
-}
-
 var eventNames = ['mousedown', 'touchstart'];
 
 module.exports = {
diff --git a/ui/round/src/crazy/crazyDrag.js b/ui/round/src/crazy/crazyDrag.js
index 772d98a4ba..66385434cb 100644
--- a/ui/round/src/crazy/crazyDrag.js
+++ b/ui/round/src/crazy/crazyDrag.js
@@ -5,10 +5,8 @@ var game = require('game').game;
 module.exports = function(ctrl, e) {
   if (e.button !== undefined && e.button !== 0) return; // only touch or left click
   if (ctrl.replaying() || !game.isPlayerPlaying(ctrl.data)) return;
-  var node = e.target;
-  var role = node.getAttribute('data-role'),
-    color = node.getAttribute('data-color');
-  console.log(node, role, color);
+  var role = e.target.getAttribute('data-role'),
+    color = e.target.getAttribute('data-color');
   if (!role || !color) return;
   e.stopPropagation();
   e.preventDefault();
diff --git a/ui/round/src/crazy/crazyView.js b/ui/round/src/crazy/crazyView.js
index 08c9fe856b..22b9a9c6e4 100644
--- a/ui/round/src/crazy/crazyView.js
+++ b/ui/round/src/crazy/crazyView.js
@@ -4,21 +4,6 @@ var crazyDrag = require('./crazyDrag');
 var game = require('game').game;
 var m = require('mithril');
 
-function crazyPocketTag(role, color) {
-  return {
-    tag: 'div',
-    attrs: {
-      class: 'no-square'
-    },
-    children: [{
-      tag: 'piece',
-      attrs: {
-        class: role + ' ' + color
-      }
-    }]
-  };
-}
-
 var eventNames = ['mousedown', 'touchstart'];
 
 module.exports = {
@@ -27,10 +12,9 @@ module.exports = {
     if (!step.crazy) return;
     var pocket = step.crazy.pockets[color === 'white' ? 0 : 1];
     var oKeys = Object.keys(pocket)
-    var crowded = oKeys.length >= 4;
     var usable = position === 'bottom' && !ctrl.replaying() && game.isPlayerPlaying(ctrl.data);
     return m('div', {
-        class: 'pocket ' + position + (oKeys.length > 4 ? ' crowded' : '') + (usable ? ' usable' : ''),
+        class: 'pocket is2d ' + position + (usable ? ' usable' : ''),
         config: position === 'bottom' ? function(el, isUpdate, context) {
           if (isUpdate) return;
           var onstart = partial(crazyDrag, ctrl);
@@ -45,13 +29,12 @@ module.exports = {
         } : null
       },
       oKeys.map(function(role) {
-        var pieces = [];
-        for (var i = 0; i < pocket[role]; i++) pieces.push(crazyPocketTag(role, color));
-        return m('div', {
-          class: 'role',
+        return m('piece', {
           'data-role': role,
           'data-color': color,
-        }, pieces);
+          'data-nb': pocket[role],
+          class: role + ' ' + color
+        });
       })
     );
   }