:root{--camera-control-area-size:32px;--body-background:#181816;--body-color:#ffe7b3;--btn-color:#ffe7b3;--btn-background:#30200b;--btn-border-color:#6f4d1d;--btn-border-color-40:#6f4d1d40;--btn-border-color-30:#6f4d1d30;--btn-hover-background:#39270f;--btn-hover-border-color:#a9762a;--btn-hover-border-color-40:#a9762a40;--btn-hover-border-color-30:#a9762a30;--btn-active-background:#432e12;--btn-active-border-color:#a9762a;--command-bar-background:#1b1b1a;--command-bar-border-color:#403f3c}*{box-sizing:border-box}html,body{text-transform:uppercase;background:var(--body-background);color:var(--body-color);height:100%;margin:0;font-family:Impact,sans-serif;font-size:20px;overflow:hidden}#game{flex-direction:column;height:100%;display:flex;overflow:hidden}#board{flex-flow:column wrap;flex-grow:1;place-content:center;display:flex;position:relative;overflow:hidden}#board-canvas{image-rendering:pixelated;touch-action:none;user-select:none;transform-origin:0 0;transition:scale .2s ease-in-out}.command-bar{background:var(--command-bar-background);border-top:5px solid var(--command-bar-border-color);padding:1rem}#selected-unit{z-index:50;margin:1rem;position:absolute;bottom:0;right:0}.pad{grid-template-rows:repeat(3,33%);grid-template-columns:repeat(3,33%);display:grid}.pad button{cursor:pointer;background:0 0;border:0;outline:0;flex-flow:column;justify-content:center;align-items:center;margin:0;padding:0;display:flex}.pad button:hover{background:#00000040}.pad button:active{background:#00000080}.pad .up{grid-area:1/2/2/3}.pad .left{grid-area:2/1/3/2}.pad .middle{grid-area:2/2/3/3}.pad .right{grid-area:2/3/3/4}.pad .down{grid-area:3/2/4/3}#placing-units-overlay{justify-content:center;align-items:center;gap:1rem;padding:1rem;display:flex}#timer{background:var(--body-background);justify-content:center;align-items:center;gap:.5rem;width:100%;padding:.5rem;display:flex;position:absolute;top:0}#timer-bar{background:#f9f9f9;border:2px solid #fff;width:10rem}#timer-bar-border{border:4px solid #000}#timer-bar-inner{background:#8d8d8d;width:100%;height:.5rem;transition:width .2s linear}#title-screen,#game-over-screen{flex-direction:column;justify-content:center;align-items:center;height:100%;display:flex}.btn{cursor:pointer;background:var(--btn-background);box-shadow:0px 2px 4px var(--btn-border-color-40),0px 7px 13px -3px var(--btn-border-color-30),inset 0px -3px 0px var(--btn-border-color);color:var(--btn-color);will-change:box-shadow,transform;text-transform:inherit;-webkit-appearance:button;border:0;border-radius:6px;outline:0;flex-flow:column;justify-content:center;align-items:center;height:48px;margin:0;padding:0 32px;font-family:inherit;font-size:100%;transition:box-shadow .15s,transform .15s;display:flex}.btn:hover{background:var(--btn-hover-background);box-shadow:0px 4px 8px var(--btn-hover-border-color-40),0px 7px 13px -3px var(--btn-hover-border-color-30),inset 0px -3px 0px var(--btn-hover-border-color);transform:translateY(-2px)}.btn:active{background:var(--btn-active-background);box-shadow:inset 0px 3px 7px var(--btn-active-border-color);transform:translateY(2px)}.icon{image-rendering:pixelated;background-image:url(sprite-sheet.2157d5c1.png);background-repeat:no-repeat;background-size:auto 48px;width:48px;height:48px;display:inline-block}.icon-left-arrow{background-position:-1344px 0}.icon-right-arrow{background-position:-1296px 0}.icon-up-arrow{background-position:-1392px 0}.icon-down-arrow{background-position:-1440px 0}.icon-hold{background-position:-1248px 0}.hidden{display:none}