#root{display:grid;grid-template-rows:auto 1fr auto;justify-items:center;min-height:100vh;width:100vw;background-color:var(--main-bg-colour)}:root{--footer-font-size: 12px}footer{width:100%;padding-top:8px;background-color:var(--footer-border-colour);box-shadow:var(--shadow)}.footer-content-wrapper{display:flex;align-items:center;justify-content:center;gap:5px;width:100%;padding:4px 8px 8px;background-color:var(--footer-bg-colour);box-shadow:var(--shadow)}.footer-text{font-size:var(--footer-font-size);color:var(--footer-text-colour)}.footer-image-container>a{display:flex;align-items:center;justify-content:center}.footer-image-container>a,.footer-image-container>a>svg{height:20px;width:20px}.footer-image-container>a>svg{fill:var(--footer-icon-colour)}@media screen and (min-width: 601px){:root{--footer-font-size: 14px}}:root{--header-font-size: 20px}header{width:100%;padding-bottom:12px;color:var(--header-text-colour);background-color:var(--header-border-colour);box-shadow:var(--shadow)}.header-background-wrapper{display:flex;align-items:center;justify-content:center;background-color:var(--header-bg-colour);box-shadow:var(--shadow)}.header-content-wrapper{padding:8px 8px 4px}.primary-title,.secondary-title{font-size:var(--header-font-size)}.primary-title{font-weight:800}.secondary-title{font-family:Itim,Comic Sans MS,Brush Script MT,Segoe Script,Apple Chancery,cursive;font-weight:600}@media screen and (min-width: 601px){:root{--header-font-size: 30px}}:root{--description-font-size: 12px;--main-max-height: 1000px}main{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 1fr;column-gap:12px;row-gap:12px;align-items:center;width:100%;max-width:1000px;padding:12px}.game-description{font-size:var(--description-font-size);color:var(--description-colour)}@media screen and (min-width: 601px){:root{--description-font-size: 18px}main{grid-template-columns:1fr 150px;grid-template-rows:auto 1fr;padding:40px}.scoreboard{align-self:flex-start}}@media screen and (min-width: 1200px){main{max-height:var(--main-max-height)}}:root{--card-grid-min-col-width: 110px}.card-grid{grid-area:2 / 1 / 3 / 3;display:grid;grid-auto-rows:1fr;grid-template-columns:repeat(auto-fit,minmax(var(--card-grid-min-col-width),1fr));row-gap:8px;column-gap:8px}@media screen and (max-width: 380px){:root{--card-grid-min-col-width: 90px}}@media screen and (min-width: 601px) and (max-width: 823px){:root{--card-grid-min-col-width: 110px}}@media screen and (min-width: 824px){:root{--card-grid-min-col-width: 150px}}@media screen and (min-width: 601px){.card-grid{align-self:flex-start;grid-area:1 / 1 / -1 / 2}}:root{--modal-padding-size: 20px}.modal-wrapper{position:fixed;top:0;left:0;display:flex;align-items:center;justify-content:center;width:100%;height:100%;background-color:var(--modal-blur-bg)}.modal{background-color:var(--modal-bg-colour);border-radius:10px;overflow:hidden}.modal-header{padding-bottom:12px;background-color:var(--modal-header-border-colour);box-shadow:var(--shadow)}.modal-header-background{padding:4px;text-align:center;font-size:30px;font-weight:700;color:var(--modal-header-colour);background-color:var(--modal-header-bg-colour);box-shadow:var(--shadow)}.modal-content{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--modal-padding-size);padding:var(--modal-padding-size)}.modal-scores{display:flex;gap:var(--modal-padding-size)}.modal-footer{padding-top:8px;background-color:var(--modal-footer-border-colour);box-shadow:var(--shadow)}.modal-footer-background{height:16px;background-color:var(--modal-footer-bg-colour);box-shadow:var(--shadow)}@media screen and (min-width: 601px){:root{--modal-padding-size: 40px}}.play-again-button{padding:12px 24px;color:var(--play-again-button-colour);text-align:center;font-weight:500;font-size:20px;border-radius:25px;background-color:var(--play-again-button-bg-colour);box-shadow:var(--shadow)}.play-again-button:hover{background-color:var(--play-again-button-hover-bg-colour)}.play-again-button:active{background-color:var(--play-again-button-active-bg-colour)}.play-again-button:focus{outline:2px solid var(--play-again-button-focus-outline-colour)}:root{--scoreboard-border-rounding: 10px;--scoreboard-padding: 8px;--scoreboard-font-size: 16px;--scoreboard-value-font-size: 34px;--scoreboard-width: 100px}.scoreboard{width:var(--scoreboard-width);overflow:hidden;background-color:var(--scoreboard-bg-colour);border:3px solid var(--scoreboard-border-colour);border-radius:var(--scoreboard-border-rounding);box-shadow:var(--shadow)}.primary-score,.secondary-score{font-size:var(--scoreboard-font-size);font-weight:700}.primary-score{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--scoreboard-padding)}.primary-score>.scoreboard-value{font-size:var(--scoreboard-value-font-size);font-weight:700}.secondary-score{display:flex;align-items:center;justify-content:center;gap:4px;padding:var(--scoreboard-padding)}.score-section{color:var(--score-section-colour);background-color:var(--score-section-bg-colour)}.best-score-section{color:var(--best-score-section-colour)}@media screen and (min-width: 601px){:root{--scoreboard-padding: 12px;--scoreboard-font-size: 20px;--scoreboard-value-font-size: 40px;--scoreboard-width: 100%}.scoreboard{justify-self:center}}:root{--villager-card-border-radius: 10px;--villager-card-max-height: 175px;--villager-card-font-size: 12px}.villager-card{border-radius:var(--villager-card-border-radius);overflow:hidden;box-shadow:var(--shadow);cursor:pointer}.villager-card:hover{outline:2px solid var(--villager-card-hover-outline)}.villager-card:active{outline:2px solid var(--villager-card-active-outline)}.villager-img{width:100%;aspect-ratio:1 / 1;background-color:var(--villager-card-bg-colour)}.villager-img>img{width:100%;height:100%}.villager-title-card{text-align:center;padding:8px;font-size:var(--villager-card-font-size)}@media screen and (min-width: 601px){:root{--villager-card-font-size: 20px}}:root{--start-offset: 5px;--bounce-distance: -5px;--bounce-delay: .15s}.loading-wrapper{grid-area:2 / 1 / 3 / 3;display:flex;align-items:center;justify-content:center;gap:2px;height:100%;width:100%;color:var(--loader-colour);font-size:20px;border:2px solid var(--loader-border-colour);border-radius:10px;background-color:var(--loader-bg-colour)}.loader{display:grid;grid-template-columns:repeat(3,1fr);column-gap:5px}.ball{height:3px;width:3px;background-color:var(--loader-colour);border-radius:50%;animation:2.5s bounce infinite}.ball-2{animation-delay:var(--bounce-delay)}.ball-3{animation-delay:calc(var(--bounce-delay) * 2)}@keyframes bounce{0%{transform:translateY(var(--start-offset))}35%{transform:translateY(var(--bounce-distance))}70%{transform:translateY(var(--start-offset))}to{transform:translateY(var(--start-offset))}}@media screen and (min-width: 601px){.loading-wrapper{align-self:flex-start;grid-area:1 / 1 / -1 / 2}}:root{font-family:Fredoka,Arial Rounded MT Bold,Trebuchet MS,Verdana,Helvetica,sans-serif;line-height:1.5;font-weight:400;box-sizing:border-box;color-scheme:light dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--yellow-100: #EDE06A;--yellow-200: #D6C278;--pink-100: #fff7f8;--pink-200: #F1B8BF;--pink-300: #EEA0A9;--tan-100: #FFF8DC;--green-100: #59CFB8;--green-200: #0BC5B6;--green-300: #00A59C;--brown-100: #8B4513;--brown-200: #5C4033;--brown-300: #333333;--white: #FFFFFF;--shadow: 0 0 4px #00000030;--shadow-bg: #00000095;--main-bg-colour: var(--tan-100);--description-colour: var(--brown-300);--loader-colour: var(--pink-300);--loader-bg-colour: var(--white);--loader-border-colour: var(--pink-300);--header-bg-colour: var(--pink-300);--header-border-colour: var(--pink-200);--header-text-colour: var(--brown-300);--scoreboard-border-colour: var(--pink-300);--scoreboard-bg-colour: var(--pink-300);--score-section-colour: var(--pink-300);--score-section-bg-colour: var(--white);--best-score-section-colour: var(--white);--villager-card-bg-colour: var(--pink-100);--villager-card-hover-outline: var(--green-200);--villager-card-active-outline: var(--green-300);--footer-border-colour: var(--pink-200);--footer-bg-colour: var(--pink-300);--footer-text-colour: var(--brown-300);--footer-icon-colour: var(--brown-300);--modal-bg-colour: var(--tan-100);--modal-header-border-colour: var(--pink-200);--modal-header-bg-colour: var(--pink-300);--modal-header-colour: var(--brown-300);--modal-footer-border-colour: var(--pink-200);--modal-footer-bg-colour: var(--pink-300);--modal-blur-bg: var(--shadow-bg);--play-again-button-bg-colour: var(--green-100);--play-again-button-hover-bg-colour: var(--green-200);--play-again-button-focus-outline-colour: var(--brown-300);--play-again-button-active-bg-colour: var(--green-300);--play-again-button-colour: var(--white)}*{box-sizing:border-box;margin:0;padding:0;border:none}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}