#main{justify-content:center;margin-top:64px;display:flex}.info{background-color:var(--clr-primary-3);border-radius:10px;align-self:stretch;width:256px;height:fit-content;margin-top:64px}.info h2{text-align:center;font-family:var(--ff-subheading);font-size:var(--fs-subheading);margin-top:24px;margin-bottom:16px}.info p{text-align:center;font-family:var(--ff-description);font-size:var(--fs-description);margin:0 12px 2px}.info p:last-child{margin-bottom:24px}#instructions{margin-left:64px}#board-top-bar{width:512px;height:64px;display:flex}#piece-selector{background-color:var(--clr-primary-3);border-radius:24px;justify-content:center;align-items:center;width:140px;height:48px;margin:8px 8px 8px 0;display:flex}.selector-piece{width:42px;height:42px;image-rendering:pixelated;border:2px solid #0000;margin:4px}#selected-piece{border:2px solid var(--clr-background);border-radius:50%}#right-of-top-bar{margin-left:auto}#timer{text-align:right;font-family:var(--ff-clock);font-size:var(--fs-clock);color:var(--clr-primary-1);border:0;margin:0}#board-bottom-bar{margin-top:20px}#board{aspect-ratio:1;grid-template-rows:repeat(6,1fr);grid-template-columns:repeat(6,1fr);width:512px;display:grid}.cell{cursor:pointer;place-items:center;display:grid}.cell.light{background-color:var(--clr-primary-1)}.cell.dark{background-color:var(--clr-primary-2)}.cell.light.highlighted{background-color:var(--clr-accent-1)}.cell.dark.highlighted{background-color:var(--clr-accent-2)}.piece{object-fit:contain;width:90%;height:90%;image-rendering:pixelated}#bottom-bar{align-items:center;width:96%;height:24px;margin-left:2%;margin-right:2%;display:flex;position:fixed;bottom:16px;left:0}#left-of-bottom-bar{display:flex}#right-of-bottom-bar{margin-left:auto;display:flex}.button{font-family:var(--ff-button);font-size:var(--fs-button);color:var(--clr-primary-1);cursor:pointer;margin:16px;text-decoration:none}.button:hover{text-decoration:underline}#popup-background{background-color:var(--clr-primary-4);border-radius:10px;flex-direction:column;justify-content:center;width:320px;height:240px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-100%);box-shadow:4px 4px 8px 2px #0003}#popup-bottom{margin-top:auto;margin-bottom:24px}#popup-background h2{text-align:center;font-family:var(--ff-solved);font-size:var(--fs-solved);color:var(--clr-primary-1);margin-top:24px;margin-bottom:0}#popup-background p{text-align:center;font-family:var(--ff-s-info);font-size:var(--fs-s-info);color:var(--clr-primary-1);margin-top:8px;margin-bottom:8px}#popup-background .button{font-family:var(--ff-button);font-size:var(--fs-button);color:var(--clr-primary-1);cursor:pointer}#info{width:60%;position:fixed;left:50%;transform:translate(-50%)}#info h2{text-align:center;font-family:var(--ff-subheading);font-size:var(--fs-subheading);color:var(--clr-primary-1);margin-top:24px;margin-bottom:16px}#info p{text-align:center;font-family:var(--ff-description);font-size:var(--fs-description);color:var(--clr-primary-1);margin:0 24px 24px}#info .button{font-family:var(--ff-button);font-size:var(--fs-button)}a{color:var(--clr-primary-1)}:root{--clr-background:#819281;--clr-primary-1:#f8f4ec;--clr-primary-2:#b9c9b1;--clr-primary-3:#edf8ec;--clr-primary-4:#7da17d;--clr-accent-1:#fbdada;--clr-accent-2:#cd7a7a;--clr-description:#000;--ff-button:"Nunito Sans", sans-serif;--fs-button:16px;--ff-subheading:"Nunito", serif;--fs-subheading:32px;--ff-level:"Kalam", serif;--fs-level:32px;--ff-description:"Kalam", serif;--fs-description:16px;--ff-clock:"Caveat", serif;--fs-clock:48px;--ff-solved:"Nunito", serif;--fs-solved:24px;--ff-s-info:"Kalam", serif;--fs-s-info:16px}@font-face{font-family:Nunito Sans;src:url(/assets/nunito-sans-latin-400-normal-AkRraKH2.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Nunito;src:url(/assets/nunito-latin-400-normal-r8SDr6Up.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Kalam;src:url(/assets/kalam-latin-400-normal-BthBl_aR.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Caveat;src:url(/assets/caveat-latin-400-normal-D6LQsQ_v.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}html{background-color:var(--clr-background)}