@import"https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&display=swap";:root{--color-black-100: rgb(0, 1, 8);--color-black-90: rgb(0, 10, 81);--color-white-90: rgba(255, 255, 255, .9);--color-white-10: rgba(255, 255, 255, .1);--color-white-0: rgba(255, 255, 255, 0);--color-white: rgb(255, 255, 255);--color-yellow: rgb(249, 246, 9);--color-yellow-sun:rgb(252, 210, 86);--game-board-border: 3px}*{box-sizing:border-box}html{font-family:Quicksand,sans-serif;line-height:1.5;color:var(--color-white);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}body{background:linear-gradient(90deg,var(--color-black-100) 0%,var(--color-black-90) 100%);background-color:var(--color-black-100);background:linear-gradient(to top,var(--color-black-100) 0%,var(--color-black-90) 100%);min-height:100vh}header{text-align:center}header img{width:5rem;object-fit:contain;margin:3rem auto 1rem;filter:drop-shadow(0 0 8px rgba(0,0,0,.4))}h1{margin:0 auto 2rem;color:var(--color-white)}h2{font-size:4rem;text-align:center;color:var(--color-yellow-sun);margin:0}h3{font-size:2rem;margin:1rem 0}p{margin:0}#game-container{max-width:45rem;margin:2rem auto;position:relative;display:flex;flex-direction:column;align-items:center}.players{margin:1rem 0}.players.highlight-player li.active .player-name,.players.highlight-player li.active .player-symbol{color:var(--color-yellow)}.players button{width:3rem;border:none;background:none;color:#c3ba78;font-size:.9rem;cursor:pointer;transition:color .2s;padding:.5rem .25rem .25rem;text-align:center}.players button:hover{color:var(--color-yellow-sun)}.player{border:2px solid transparent;padding:.5rem;border-radius:4px;font-weight:700}.player-name{display:inline-block;width:10rem;font-size:1rem;color:var(--color-white-90);text-transform:uppercase;margin:0;padding:.5rem;border-radius:4px;text-overflow:ellipsis;text-align:center}.player input{font:inherit;font-size:1rem;width:10rem;border:none;padding:.5rem;animation:pulse-text 2s infinite;text-align:center;text-transform:uppercase}.player-symbol{margin-left:1rem;font-size:1rem;color:var(--color-white-90)}ol{list-style:none;margin:0;padding:0}.game-board{margin:1rem auto;display:inline-grid;grid-template-columns:repeat(3,minmax(10rem,3rem));grid-template-rows:repeat(3,minmax(10rem,3rem));gap:0}.game-board button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--color-white-0);border:none;color:var(--color-white-90);font-size:5rem;cursor:pointer}.game-board button:disabled{cursor:none}.game-board button:nth-of-type(-n+6){border-bottom:var(--game-board-border) solid var(--color-white-90)}.game-board button:nth-of-type(2),.game-board button:nth-of-type(5),.game-board button:nth-of-type(8){border-left:var(--game-board-border) solid var(--color-white-90);border-right:var(--game-board-border) solid var(--color-white-90)}.game-over{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:var(--color-black-90);animation:pop-in .5s cubic-bezier(.68,-.55,.65,.52) forwards}.game-over p{font-size:2rem;text-align:center;color:var(--color-white-90)}.game-over button{display:block;margin:0 auto;font-size:1.5rem;background-color:var(--color-black-90);border:2px solid var(--color-yellow-sun);color:var(--color-yellow-sun);padding:.5rem 1rem;border-radius:4px;cursor:pointer;transition:all .2s,color .2s;box-shadow:0 0 8px var(--color-black-100)}.game-over button:hover{background-color:var(--color-yellow-sun);color:var(--color-black-100);transform:scale(1.1);box-shadow:0 0 20px var(--color-black-100)}.log{max-width:20rem;margin:2rem auto;padding:0;text-align:center}#game-hints{text-align:center;color:#46432f}#game-hints h2{font-size:2rem;margin:0}#game-hints ul{list-style:none;padding:0;margin:0}#game-hints button{cursor:pointer;border:none;background:transparent;color:#23221f;font:inherit;margin-top:1.5rem}.flex{display:flex;gap:2rem}.flex-center{justify-content:center;align-items:center}.active{border-color:var(--color-yellow);animation:pulse 2s infinite ease-in-out}@keyframes slide-in-from-left{0%{opacity:0;transform:translate(-30%)}to{opacity:1;transform:translate(0)}}@keyframes pulse-text{0%{color:var(--color-white-90)}50%{color:#9f9d83}to{color:var(--color-white-90)}}@keyframes pulse-text-size{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes pulse{0%{border-color:var(--color-yellow);box-shadow:0 0 #f6e35a66}50%{border-color:#f8c031;box-shadow:0 0 0 .5rem #f8a53100}to{border-color:var(--color-yellow);box-shadow:0 0 #f6e35a00}}@keyframes pop-in{0%{transform:scale(0);opacity:0}80%{transform:scale(1.1);opacity:1}to{transform:scale(1)}}