@import"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap";*{box-sizing:border-box;margin:0;padding:0}:root{font-family:Nunito,sans-serif;font-size:1.2rem;color-scheme:light dark}html{width:100%;height:100%}body{background:#fff;display:flex;align-items:start;justify-content:center;height:100vh;background-image:url(./assets/images/grass.png);background-position:center bottom;background-repeat:no-repeat;background-attachment:fixed}header{display:flex;flex-direction:column;margin-top:1.5rem}header h1{font-weight:700;color:#f6a1ad;font-size:1.8rem;margin:0 auto}header p{margin:.7rem 2rem;text-align:center}.scoreboard{display:flex;flex-direction:column;padding:.5rem 0 2rem}.scoreboard p{margin:auto}.scoreboard p span{font-weight:700}.gamestatus{display:flex;justify-content:center;margin-top:.5rem}.gamestatus p{margin:0 .5rem}.egglist{background:#daf0f1;padding:2.4rem 0}.egglist ul{display:grid;justify-content:center;grid-template-columns:repeat(2,100px);gap:1rem;list-style:none;padding-left:0;margin:0}.egglist p{margin-top:1rem;text-align:center}button.egg{background-color:#0000;padding:10px 4px;border:0;outline:0}button.egg:focus{outline:2px solid rgba(246,161,173,1);outline-offset:2px}.egg{transition:transform .1s ease}.egg:active{transform:scale(.9)}.egg img{transition:all .2s ease-in-out;width:100px;max-width:100px}.egg img:hover{transform:scale(1.1)}.game-controls{margin:1rem;display:flex;justify-content:center}.game-button{margin:1rem;padding:.5rem 1rem;font-size:1rem;border:none;border-radius:8px;cursor:pointer;background-color:#f6a1ad;color:#fff;transition:background-color .2s ease}.game-button:hover{background-color:#f88494}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:grid;place-items:center;z-index:1000;animation:fadeIn .3s ease-in-out forwards}.modal-content{background:#fff;border-radius:8px;padding:2rem;max-width:400px;width:90%;box-shadow:0 0 10px #0003;text-align:center;position:relative;animation:popIn .3s ease-in-out forwards}.modal-close{position:absolute;top:.5rem;right:.5rem;font-size:1.2rem;background:none;border:none;cursor:pointer;color:#444}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes popIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@media (prefers-color-scheme: dark){body{background-color:#333}.egglist p,.modal-content{color:#222}}@media (min-width: 768px){header{margin-top:3rem}header h1{font-size:2rem}header p{margin:.7rem 0}.egglist ul{grid-template-columns:repeat(4,100px)}}