.header{width:50%;height:80px;min-width:280px;max-width:500px;margin:0 auto}.header .title{font-size:48px;float:left}@media screen and (max-width: 700px){.header .title{font-size:32px}}.header .action-bar{width:100%;clear:both;user-select:none;font-size:16px}.header .action-bar .newgame-menu{float:left}.header .action-bar .undo{float:right}.header .action-bar .undo:hover{cursor:pointer}.header .status-bar{margin:10px 0 0 0;float:right}@media screen and (max-width: 700px){.header .status-bar{margin:5px 0 0 0}}.header .status-bar span{position:relative;box-sizing:content-box;display:inline-block;padding:15px 20px 0px 20px;line-height:30px;color:#2c3e50;background:#a9a9a9;border-radius:3px}@media screen and (max-width: 700px){.header .status-bar span{line-height:24px}}.header .status-bar .score:after,.header .status-bar .best:after{position:absolute;width:100%;top:5px;left:0;text-transform:uppercase;font-size:13px;line-height:13px;text-align:center}.header .status-bar .score:after{content:"Score"}.header .status-bar .best:after{content:"Best"}.twentyfoureight-container{position:absolute;top:80px;bottom:0;width:100%}.twentyfoureight-container .overlay{transition:all 200ms ease-in-out;color:#2c3e50;position:absolute;display:grid;opacity:0;pointer-events:none;width:98%;height:98%;margin:auto;left:0;right:0;background-color:rgba(214,214,214,.9);grid-template-areas:"msg" "menu";grid-template-rows:50% 50%;z-index:2}.twentyfoureight-container .overlay.--show{opacity:1;pointer-events:auto}.twentyfoureight-container .overlay .message{grid-area:msg;display:flex;align-items:flex-end;justify-content:center;margin:0 0 10px 0;font-size:64px}@media screen and (max-width: 700px){.twentyfoureight-container .overlay .message{font-size:48px}}.twentyfoureight-container .overlay .menu{grid-area:menu}.twentyfoureight-container .loader{color:#2c3e50;position:absolute;display:block;width:98%;height:98%;margin:auto;left:0;right:0;background-color:rgba(214,214,214,.9);z-index:10}.twentyfoureight-container .loader-hex,.twentyfoureight-container .loader-border{width:10vh;height:10vh;position:absolute;background:#2c3e50;-webkit-clip-path:polygon(0% 50%, 25% 95%, 75% 95%, 100% 50%, 75% 5%, 25% 5%);clip-path:polygon(0% 50%, 25% 95%, 75% 95%, 100% 50%, 75% 5%, 25% 5%);overflow:hidden;left:50%;top:50%;transform:translate(-50%, -50%)}.twentyfoureight-container .loader-border{width:90%;height:90%}.twentyfoureight-container .loader-content{width:150%;height:100%;background:#d6d6d6;position:absolute;top:50%;left:50%;animation:contentAnimation 2s infinite linear;transform-origin:center top}@keyframes contentAnimation{0%{transform:translateX(-50%) rotate(0deg)}100%{transform:translateX(-50%) rotate(360deg)}}.button{background:#a9a9a9;border:1px solid #989898;color:#2c3e50;border-radius:3px;padding:2px 4px;user-select:none}.button:hover{cursor:pointer}