!function(n){var r={};function e(t){if(r[t])return r[t].exports;var o=r[t]={i:t,l:!1,exports:{}};return n[t].call(o.exports,o,o.exports,e),o.l=!0,o.exports}e.m=n,e.c=r,e.d=function(n,r,t){e.o(n,r)||Object.defineProperty(n,r,{enumerable:!0,get:t})},e.r=function(n){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(n,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(n,"__esModule",{value:!0})},e.t=function(n,r){if(1&r&&(n=e(n)),8&r)return n;if(4&r&&"object"==typeof n&&n&&n.__esModule)return n;var t=Object.create(null);if(e.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:n}),2&r&&"string"!=typeof n)for(var o in n)e.d(t,o,function(r){return n[r]}.bind(null,o));return t},e.n=function(n){var r=n&&n.__esModule?function(){return n.default}:function(){return n};return e.d(r,"a",r),r},e.o=function(n,r){return Object.prototype.hasOwnProperty.call(n,r)},e.p="",e(e.s=1)}([,function(n,r,e){"use strict";e.r(r);e(2)},function(n,r,e){var t=e(3);"string"==typeof t&&(t=[[n.i,t,""]]);var o={transform:void 0};e(5)(t,o);t.locals&&(n.exports=t.locals)},function(n,r,e){(n.exports=e(4)(!1)).push([n.i,"* {\r\n list-style: none;\r\n color: #8f7a66;\r\n padding: 0;\r\n margin: 0;\r\n box-sizing: border-box;\r\n}\r\n\r\nbody {\r\n background-color: #ffffe0;\r\n}\r\n\r\n.wrapper {\r\n position: relative;\r\n width: 400px;\r\n height: 540px;\r\n /*border: 1px solid red;*/\r\n margin: 0 auto;\r\n}\r\n\r\n/*头部*/\r\n.header {\r\n width: 400px;\r\n height: 140px;\r\n /*border: 1px solid green;*/\r\n position: relative;\r\n /*opacity: 0.4;*/\r\n}\r\n\r\n.title, .slogan, .score, .best, .new-game, .github>span {\r\n position: absolute;\r\n}\r\n\r\n.title strong {\r\n display: inline-block;\r\n width: 260px;\r\n height: 100px;\r\n font-size: 78px;\r\n line-height: 100px;\r\n /*text-align: center;*/\r\n padding: 0 5px;\r\n /*border: 1px solid black;*/\r\n}\r\n\r\n.slogan {\r\n padding: 0 5px;\r\n top: 85px;\r\n /*border: 1px solid black;*/\r\n}\r\n/*.github>span>span {\r\n\tdisplay: inline-block;\r\n\twidth: 100px;\r\n\theight: 16px;\r\n\tline-height: 16px;\r\n\tposition: absolute;\r\n\tbottom: -24px;\r\n\tleft: -25px;\r\n\ttext-align: center;\r\n\tcolor: #2c2c2c;\r\n}*/\r\n\r\n\r\n/*分数*/\r\n\r\n/* 分数动画 */\r\n.score-animation, .best-animation {\r\n display: none;\r\n position: absolute;\r\n top: 25px;\r\n left: 10px;\r\n width: 65px;\r\n height: 30px;\r\n font-size: 24px;\r\n font-weight: bold;\r\n}\r\n\r\n.score {\r\n left: 220px;\r\n}\r\n\r\n.best {\r\n left: 315px;\r\n}\r\n\r\n.score, .best {\r\n position: absolute;\r\n width: 85px;\r\n height: 60px;\r\n line-height: 28px;\r\n top: 20px;\r\n background-color: #bbada0;\r\n}\r\n\r\n.score span, .best span, .new-game span {\r\n color: #ffffff;\r\n}\r\n\r\n.score, .best, .new-game, .game-board, .grid {\r\n text-align: center;\r\n border-radius: 5px;\r\n}\r\n\r\n.best .number, .score .number, .new-game {\r\n font-size: 22px;\r\n font-weight: bold;\r\n}\r\n\r\n.new-game {\r\n width: 180px;\r\n height: 40px;\r\n line-height: 40px;\r\n left: 220px;\r\n top: 90px;\r\n text-align: center;\r\n background-color: #8e7963;\r\n cursor: pointer;\r\n}\r\n\r\n.new-game:hover {\r\n width: 182px;\r\n height: 42px;\r\n line-height: 42px;\r\n left: 219px;\r\n top: 89px;\r\n font-size: 24px;\r\n}\r\n\r\n\r\n\r\n/*游戏主面板*/\r\n.game-board {\r\n width: 400px;\r\n height: 400px;\r\n padding: 5px 5px;\r\n background-color: #bbada0;\r\n /*opacity: 0.4;*/\r\n}\r\n\r\n.grid {\r\n position: relative;\r\n float: left;\r\n width: 87.5px;\r\n height: 87.5px;\r\n line-height: 87.5px;\r\n /*font-size: 48px;*/\r\n font-weight: bold;\r\n margin: 5px;\r\n background-color: #b0c4de;\r\n}\r\n\r\n.game-board .grid span {\r\n /*color: */\r\n\r\n}\r\n\r\n/*game over or win the game弹出页面*/\r\n.popup .game-over, .popup .win {\r\n position: absolute;\r\n left: 60px;\r\n text-align: center;\r\n width: 280px;\r\n height: 160px;\r\n border-radius: 5px;\r\n /*border: 1px solid red;*/\r\n opacity: 1.0;\r\n}\r\n\r\n.popup p {\r\n color: #8f7a66;\r\n}\r\n\r\n.popup .game-over {\r\n display: none;\r\n top: 230px;\r\n font-size: 36px;\r\n font-weight: bold;\r\n}\r\n\r\n.popup .win {\r\n display: none;\r\n top: 220px;\r\n font-size: 28px;\r\n font-weight: bold;\r\n}\r\n\r\np.try-again {\r\n color: #fff;\r\n font-size: 22px;\r\n width: 150px;\r\n height: 50px;\r\n line-height: 50px;\r\n border-radius: 5px;\r\n margin: 0 auto;\r\n background-color: #8f7a66;\r\n cursor: pointer;\r\n}\r\n\r\n.header, .game-board {\r\n /*opacity: 0.4;*/\r\n}\r\n\r\n.new-grid {\r\n background-color: #b0c4de !important;\r\n}\r\n\r\n/* 生成新格子动画 */\r\n@keyframes tempgrid {\r\n from {\r\n width: 45px;\r\n height: 45px;\r\n top: 24px;\r\n left: 24px;\r\n font-size: 18px;\r\n line-height: 45px;\r\n display: block;\r\n }\r\n\r\n to {\r\n width: 87.5px;\r\n height: 87.5px;\r\n top: 0px;\r\n left: 0px;\r\n font-size: 48px;\r\n line-height: 87.5px;\r\n display: none;\r\n }\r\n}\r\n\r\n@-webkit-keyframes tempgrid {\r\n from {\r\n width: 45px;\r\n height: 45px;\r\n top: 24px;\r\n left: 24px;\r\n font-size: 18px;\r\n line-height: 45px;\r\n display: block;\r\n }\r\n\r\n to {\r\n width: 87.5px;\r\n height: 87.5px;\r\n top: 0px;\r\n left: 0px;\r\n font-size: 48px;\r\n line-height: 87.5px;\r\n display: none;\r\n }\r\n}\r\n\r\n@-moz-keyframes tempgrid {\r\n from {\r\n width: 45px;\r\n height: 45px;\r\n top: 24px;\r\n left: 24px;\r\n font-size: 18px;\r\n line-height: 45px;\r\n display: block;\r\n }\r\n\r\n to {\r\n width: 87.5px;\r\n height: 87.5px;\r\n top: 0px;\r\n left: 0px;\r\n font-size: 48px;\r\n line-height: 87.5px;\r\n display: none;\r\n }\r\n}\r\n\r\n.temp-grid {\r\n animation: tempgrid 0.15s ease-in forwards;\r\n -webkit-animation: tempgrid 0.15s ease-in forwards;\r\n -ms-animation: tempgrid 0.15s ease-out forwards;\r\n -moz-animation: tempgrid 0.15s ease-out forwards;\r\n}\r\n\r\n\r\n\r\n/* mobile */\r\n\r\n/* 在 860px 像素或更小的屏幕上,将背景色设置为橄榄色 */\r\n@media screen and (max-width: 860px) {\r\n\r\n\r\n body {\r\n background-color: #fffadd;\r\n }\r\n\r\n .wrapper {\r\n width: 100%;\r\n /*height: 540px;*/\r\n /*border: 1px solid red;*/\r\n /*margin: 0 auto;*/\r\n }\r\n\r\n /*头部*/\r\n .header {\r\n width: 100%;\r\n /*height: 140px;*/\r\n position: relative;\r\n }\r\n\r\n .title, .slogan, .score, .best, .new-game {\r\n position: absolute;\r\n float: left;\r\n text-align: center;\r\n }\r\n\r\n\r\n .title, .slogan {\r\n width: 100%;\r\n\r\n }\r\n\r\n .title strong {\r\n display: inline-block;\r\n width: 100%;\r\n /*height: 260px;*/\r\n font-size: 487%;\r\n /* 100% 16px */\r\n /*line-height: 192%;*/\r\n text-align: center;\r\n /*padding: 0 5px;*/\r\n /*border: 1px solid black;*/\r\n }\r\n\r\n .slogan {\r\n /*margin-top: 10px;*/\r\n top: 65%;\r\n }\r\n\r\n /* github */\r\n /*.github>a {\r\n\ttop: 4%;\r\n\tright: 6.25%;\r\n}*/\r\n\r\n\r\n /*分数*/\r\n .score, .best, .new-game {\r\n width: 25%;\r\n /*border: 1px solid green;*/\r\n }\r\n\r\n /* 分数动画 */\r\n .score-animation, .best-animation {\r\n display: none;\r\n /*position: absolute;*/\r\n top: 25px;\r\n left: 10px;\r\n width: 65px;\r\n height: 30px;\r\n font-size: 24px;\r\n font-weight: bold;\r\n }\r\n\r\n .score, .best {\r\n /*position: absolute;*/\r\n line-height: 28px;\r\n top: 90%;\r\n background-color: #bbada0;\r\n }\r\n\r\n .score {\r\n left: 47.5%;\r\n }\r\n\r\n .best {\r\n left: 75%;\r\n }\r\n\r\n .new-game {\r\n width: 45%;\r\n height: 60px;\r\n line-height: 60px;\r\n left: 0;\r\n top: 90%;\r\n text-align: center;\r\n background-color: #8e7963;\r\n cursor: pointer;\r\n /*padding-bottom: 2em;*/\r\n font-size: 28px;\r\n }\r\n\r\n .new-game:hover {\r\n width: 45%;\r\n /*height: 42px;*/\r\n /*line-height: 42px;*/\r\n height: 60px;\r\n line-height: 60px;\r\n left: 0;\r\n top: 90%;\r\n /*line-height: 2e;*/\r\n font-size: 28px;\r\n }\r\n\r\n .score span, .best span, .new-game span {\r\n color: #ffffff;\r\n }\r\n\r\n .score, .best, .new-game, .game-board, .grid {\r\n text-align: center;\r\n border-radius: 5px;\r\n }\r\n\r\n .best .number, .score .number {\r\n font-size: 22px;\r\n font-weight: bold;\r\n }\r\n\r\n /*游戏主面板*/\r\n .game-board {\r\n position: absolute;\r\n /*display: none;*/\r\n width: 100%;\r\n height: auto;\r\n /*height: 400px;*/\r\n /*padding: 10px 10px;*/\r\n background-color: #bbada0;\r\n /*opacity: 0.4;*/\r\n top: 36%;\r\n }\r\n\r\n .grid {\r\n /*position: relative;*/\r\n float: left;\r\n width: 22%;\r\n /*height: */\r\n /*padding-bottom: 21.95%;*/\r\n /*height: 100%;*/\r\n line-height: 80px;\r\n /*font-size: 48px;*/\r\n font-weight: bold;\r\n /*padding-bottom: 410px;*/\r\n padding: 1.5%;\r\n background-color: #b0c4de;\r\n }\r\n\r\n /* 生成新格子动画 */\r\n @keyframes tempgrid {\r\n from {\r\n width: 50%;\r\n height: 50%;\r\n top: 25%;\r\n left: 25%;\r\n font-size: 24px;\r\n line-height: 192%;\r\n display: block;\r\n }\r\n\r\n to {\r\n width: 100%;\r\n height: 100%;\r\n top: 0px;\r\n left: 0px;\r\n font-size: 48px;\r\n line-height: 192%;\r\n display: none;\r\n }\r\n }\r\n\r\n @-webkit-keyframes tempgrid {\r\n from {\r\n width: 50%;\r\n height: 50%;\r\n top: 25%;\r\n left: 25%;\r\n font-size: 24px;\r\n line-height: 192%;\r\n display: block;\r\n }\r\n\r\n to {\r\n width: 100%;\r\n height: 100%;\r\n top: 0px;\r\n left: 0px;\r\n font-size: 48px;\r\n line-height: 192%;\r\n display: none;\r\n }\r\n }\r\n\r\n @-moz-keyframes tempgrid {\r\n from {\r\n width: 50%;\r\n height: 50%;\r\n top: 25%;\r\n left: 25%;\r\n font-size: 24px;\r\n line-height: 192%;\r\n display: block;\r\n }\r\n\r\n to {\r\n width: 100%;\r\n height: 100%;\r\n top: 0px;\r\n left: 0px;\r\n font-size: 48px;\r\n line-height: 192%;\r\n display: none;\r\n }\r\n }\r\n\r\n}",""])},function(n,r){n.exports=function(n){var r=[];return r.toString=function(){return this.map((function(r){var e=function(n,r){var e=n[1]||"",t=n[3];if(!t)return e;if(r&&"function"==typeof btoa){var o=(p=t,"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(p))))+" */"),i=t.sources.map((function(n){return"/*# sourceURL="+t.sourceRoot+n+" */"}));return[e].concat(i).concat([o]).join("\n")}var p;return[e].join("\n")}(r,n);return r[2]?"@media "+r[2]+"{"+e+"}":e})).join("")},r.i=function(n,e){"string"==typeof n&&(n=[[null,n,""]]);for(var t={},o=0;o=0&&d.splice(r,1)}function x(n){var r=document.createElement("style");return n.attrs.type="text/css",b(r,n.attrs),u(n,r),r}function b(n,r){Object.keys(r).forEach((function(e){n.setAttribute(e,r[e])}))}function m(n,r){var e,t,o,i;if(r.transform&&n.css){if(!(i=r.transform(n.css)))return function(){};n.css=i}if(r.singleton){var p=l++;e=s||(s=x(r)),t=v.bind(null,e,p,!1),o=v.bind(null,e,p,!0)}else n.sourceMap&&"function"==typeof URL&&"function"==typeof URL.createObjectURL&&"function"==typeof URL.revokeObjectURL&&"function"==typeof Blob&&"function"==typeof btoa?(e=function(n){var r=document.createElement("link");return n.attrs.type="text/css",n.attrs.rel="stylesheet",b(r,n.attrs),u(n,r),r}(r),t=z.bind(null,e,r),o=function(){g(e),e.href&&URL.revokeObjectURL(e.href)}):(e=x(r),t=k.bind(null,e),o=function(){g(e)});return t(n),function(r){if(r){if(r.css===n.css&&r.media===n.media&&r.sourceMap===n.sourceMap)return;t(n=r)}else o()}}n.exports=function(n,r){if("undefined"!=typeof DEBUG&&DEBUG&&"object"!=typeof document)throw new Error("The style-loader cannot be used in a non-browser environment");(r=r||{}).attrs="object"==typeof r.attrs?r.attrs:{},void 0===r.singleton&&(r.singleton=p()),void 0===r.insertInto&&(r.insertInto="head"),void 0===r.insertAt&&(r.insertAt="bottom");var e=c(n,r);return h(e,r),function(n){for(var t=[],o=0;o