+#PanelUI-popup #PanelUI-contents:empty {
+ height: 128px;
+}
+
+#PanelUI-popup #PanelUI-contents:empty::before {
+ content: "";
+ background-image: url("chrome://browser/skin/customizableui/whimsy-bw.png");
+ display: block;
+ width: 64px;
+ height: 64px;
+ position: absolute;
+ animation: moveX 3.05s linear 0s infinite alternate,
+ moveY 3.4s linear 0s infinite alternate;
+}
+
+#PanelUI-popup #PanelUI-contents:-moz-locale-dir(rtl):empty::before {
+ animation: moveXRTL 3.05s linear 0s infinite alternate,
+ moveY 3.4s linear 0s infinite alternate;
+}
+
+#PanelUI-popup #PanelUI-contents:empty:hover::before {
+ background-image: url("chrome://browser/skin/customizableui/whimsy.png");
+}
+
+@media (min-resolution: 2dppx) {
+ #PanelUI-popup #PanelUI-contents:empty::before {
+ background-image: url("chrome://browser/skin/customizableui/whimsy-bw@2x.png");
+ background-size: 64px 64px;
+ }
+ #PanelUI-popup #PanelUI-contents:empty:hover::before {
+ background-image: url("chrome://browser/skin/customizableui/whimsy@2x.png");
+ }
+}
+
+@keyframes moveX {
+ /* These values are adjusted for the padding on the panel. */
+ from { margin-left: -9px; } to { margin-left: calc(100% - 55px); }
+}
+@keyframes moveXRTL {
+ /* These values are adjusted for the padding on the panel. */
+ from { margin-right: -9px; } to { margin-right: calc(100% - 55px); }
+}
+@keyframes moveY {
+ /* These values are adjusted for the padding and height of the panel. */
+ from { margin-top: -.5em; } to { margin-top: calc(64px - .5em); }
+}
+