html{height:100%;--green:#6aaa64;--darkendGreen:#538d4e;--yellow:#c9b559;--darkendYellow:#b59f3b;--lightGray:#d9d9d9;--gray:#85878a;--darkGray:#949699;--white:#fff;--black:#212121;--header-height:50px;--keyboard-height:200px;--game-max-width:500px;--header-btn-hover:#e5e7eb;--operator-bg:#d4d6d8;font-size:16px}html.dark{color:#fff;--header-btn-hover:#1f2937;--operator-bg:#111827;background-color:#121213}html,body{height:100%;width:100%;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-ms-user-select:none;user-select:none;touch-action:manipulation;flex-direction:column;justify-content:space-between;align-items:center;margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;display:flex;overflow-x:hidden}button{color:inherit;background-color:rgba(0,0,0,0);border:0}button>svg{pointer-events:none}.board{grid-template-columns:repeat(3,1fr);display:grid}.tile{width:76px;height:76px;--tile-shadow-color:gray;border:1px solid var(--tile-shadow-color);box-shadow:var(--tile-shadow-color)3px 3px 0px 0px;font-size:2.5rem;font-size:calc();cursor:pointer;border-radius:4px;justify-content:center;align-items:center;margin:8px;display:flex}@media (hover:hover){.tile:not([data-value="0"]):hover{box-shadow:var(--tile-shadow-color)1.5px 1.5px 0px 0px;-webkit-transform:translate(1.5px,1.5px);transform:translate(1.5px,1.5px)}}.tile:not([data-value="0"]):active{box-shadow:var(--tile-shadow-color)1.5px 1.5px 0px 0px;-webkit-transform:translate(1.5px,1.5px);transform:translate(1.5px,1.5px)}.tile[data-selected]{color:red;--tile-shadow-color:red;box-shadow:var(--tile-shadow-color)1.5px 1.5px 0px 0px;border-color:red;outline-color:red;-webkit-transform:translate(1.5px,1.5px);transform:translate(1.5px,1.5px)}.tile[data-selected]:focus-visible{outline:.75px solid red}.tile[data-value="0"]{cursor:default;outline:unset;--tile-shadow-color:rgba(128,128,128,.3);box-shadow:none}.controls{width:384px;justify-content:space-evenly;align-items:center;margin-bottom:32px;display:flex}.control-btn{border-radius:.25rem;justify-content:center;align-items:center;padding:4px 8px;transition:-webkit-transform .75s ease-in-out,-webkit-transform .75s ease-in-out,transform .75s ease-in-out;display:flex}.control-btn>svg{transition-property:-webkit-transform,-webkit-transform,transform;transition-timing-function:ease}.control-btn:hover>svg,.control-btn:focus-visible>svg{transition-duration:.85s;-webkit-transform:rotate(-360deg);transform:rotate(-360deg)}.control-btn:focus-visible{outline:2px solid #60a5fa}header{width:100%;border-bottom:1px solid #3a3a3c}header>div{height:50px;max-width:512px;justify-content:space-around;align-items:center;margin:0 auto;display:flex}.header-section{width:92px;justify-content:space-around;align-items:center;display:flex}.header-btn{cursor:pointer;border-radius:.25rem;justify-content:center;align-items:center;padding:4px 8px;display:flex}.header-btn:focus-visible{outline:2px solid #60a5fa}.header-btn:hover{background-color:var(--header-btn-hover)}.header-btn>svg{height:1.5rem;width:1.5rem;transition-property:-webkit-transform,-webkit-transform,transform;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.header-btn.rotate>svg{transition-duration:0s}.header-btn:hover>svg,.header-btn:focus-visible>svg{-webkit-transform:scale(1.1);transform:scale(1.1)}.header-btn.rotate:hover>svg,.header-btn.rotate:focus-visible>svg{transition-duration:.5s;-webkit-transform:rotate(90deg);transform:rotate(90deg)}#title{font-size:1.25rem;font-weight:600}@media (min-width:420px){.title{font-size:1.5rem}}.hud{text-align:center;gap:20px;display:flex}.lives{justify-content:center;align-items:center;display:flex}.heart{width:24px;fill:red;stroke:#000;stroke-width:.75px;-webkit-animation:scale 1.5s linear infinite;animation:scale 1.5s linear infinite}@-webkit-keyframes scale{0%{-webkit-transform:scale(.95);transform:scale(.95)}5%{-webkit-transform:scale(1.1);transform:scale(1.1)}39%{-webkit-transform:scale(.85);transform:scale(.85)}45%{-webkit-transform:scale(1);transform:scale(1)}60%{-webkit-transform:scale(.95);transform:scale(.95)}to{-webkit-transform:scale(.9);transform:scale(.9)}}@keyframes scale{0%{-webkit-transform:scale(.95);transform:scale(.95)}5%{-webkit-transform:scale(1.1);transform:scale(1.1)}39%{-webkit-transform:scale(.85);transform:scale(.85)}45%{-webkit-transform:scale(1);transform:scale(1)}60%{-webkit-transform:scale(.95);transform:scale(.95)}to{-webkit-transform:scale(.9);transform:scale(.9)}}.operators{width:300px;align-content:space-between;justify-content:space-between;display:flex}.operator{width:3rem;height:3rem;background-color:var(--operator-bg);border-radius:.5rem;padding:0;font-family:monospace;font-size:36px}.operator:focus-visible{outline:2px solid #60a5fa}.operator[data-selected]{background-color:green}.operator[data-selected]:focus-visible{outline:2px solid red}