.game{position:relative;overflow:visible;display:flex;justify-content:center;align-items:center;width:100%;height:100%}.render-target{position:relative;flex:1;max-height:100vh;flex-basis:100%}.scramble-container{font-family:League Spartan,sans-serif;display:grid;height:100vh;width:100%;grid-template-areas:"past" "current";grid-template-rows:minmax(0,1fr) .5fr;position:fixed;top:0;right:0;bottom:0;left:0}.turn{display:flex;gap:1rem;margin-bottom:1rem}.turn .letter-box{border:4px solid var(--g_unsolved);font-size:1.2em;width:3rem;height:3rem;display:flex;align-items:center;justify-content:center;background-color:var(--g_bg)}.turn .letter-box.-filled{background-color:var(--g_unsolved);color:var(--keyFG)}.turn .resolved-distance{width:3rem;height:3rem;max-width:3rem;max-height:3rem;font-size:1em;gap:.2rem;display:flex;align-items:center}.turn .resolved-distance[data-valence=good]{color:var(--g_textDark)}.turn .resolved-distance[data-valence=bad]{color:var(--error)}.previous-turns{grid:"past";justify-self:center;align-self:end}.current-turn{grid:"current";justify-self:center}.loading-screen{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;text-align:center;p {font-size: .8em;}}.loading-screen>button{font-size:1.5rem;outline:none;border:none;background-color:var(--key);color:var(--keyFG);padding:.5rem 2rem;border-radius:99px;font-weight:700;font-family:League Spartan,sans-serif;cursor:pointer;transition:all .1s ease-in-out}.loading-screen>button:hover{transform:scale(1.05)}.loading-screen>button:active{transform:scale(.95)}@keyframes headShake{0%{transform:translate(0)}6.5%{transform:translate(-6px) rotateY(-9deg)}18.5%{transform:translate(5px) rotateY(7deg)}31.5%{transform:translate(-3px) rotateY(-5deg)}43.5%{transform:translate(2px) rotateY(3deg)}50%{transform:translate(0)}}.headShake{animation:.7s ease-in-out headShake forwards}