@import"https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;700&display=swap";body{max-height:100vh;font-family:Outfit,sans-serif;margin:0;padding:0;height:100vh;overflow:hidden;background-color:#1a2a33;display:grid;justify-content:center;align-items:flex-start;grid-template-rows:repeat(4,auto)}body .add-OIcon{background-image:url(./src/assets/icon-o.svg)}body .add-XIcon{background-image:url(./src/assets/icon-x.svg)}body .active-icon{transform:scale(1.05)}body .not-active-icon{opacity:.5;transform:scale(.9)}body .overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;z-index:999;display:none;pointer-events:all}body button{cursor:pointer}body #new-game-menu{margin-top:1rem;grid-row:1/5;display:grid;grid-template-rows:repeat(4,auto);width:90vw}body #new-game-menu #new-game-menu-logo-container{grid-row:1;display:flex;justify-content:center;margin-bottom:1.5rem}body #new-game-menu #icon-picker-outer-container{grid-row:2;background-color:#1f3641;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;border-radius:15px;border-bottom:10px solid rgba(12,18,23,.6745098039);padding:1rem 0}body #new-game-menu #icon-picker-outer-container h1{color:#a8bfc9;font-size:1rem;letter-spacing:1px;margin-top:1.5rem}body #new-game-menu #icon-picker-outer-container #icon-picker-inner-container{background-color:#1a2a33;padding:.7rem;display:flex;width:85%;justify-content:space-between;border-radius:10px;height:3.6rem;gap:.8rem}body #new-game-menu #icon-picker-outer-container #icon-picker-inner-container button{border-radius:10px;width:100%;border:none;display:flex;justify-content:center;align-items:center}body #new-game-menu #icon-picker-outer-container #icon-picker-inner-container button img{height:1.8rem}body #new-game-menu #icon-picker-outer-container #icon-picker-inner-container .active-button{background-color:#a8bfc9}body #new-game-menu #icon-picker-outer-container h2{letter-spacing:.88px;font-size:14px;font-weight:400;color:#a8bfc9}body #new-game-menu #menu-new-game-cpu-button,body #new-game-menu #menu-new-game-multi-button{color:#1a2a33;border:none;border-radius:15px;height:4rem;font-weight:700;font-size:1rem;opacity:.5}body #new-game-menu #menu-new-game-cpu-button{grid-row:3;margin:2rem 0 1rem;background-color:#f2b137;border-bottom:10px solid #b9872b}body #new-game-menu #menu-new-game-multi-button{grid-row:4;background-color:#31c3bd;border-bottom:10px solid #218683;margin-bottom:2.5rem}body #new-game-menu #start-game{grid-row:5;background-color:#fff;border-bottom:10px solid rgba(55,64,69,.4784313725)!important;color:#1a2a33;border:none;border-radius:15px;height:4rem;font-weight:700;font-size:1rem;width:80%;margin:0 auto;cursor:not-allowed;opacity:.3;transition:opacity .3s ease}body #new-game-menu #start-game:disabled{pointer-events:none;opacity:.5;transform:scale(1);animation:none}body #new-game-menu #start-game.enabled{cursor:pointer;opacity:1;animation:pulse 2s infinite ease-in-out}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}body #during-game-container{display:none;grid-row:5;width:90vw;height:85vh}body #during-game-container #during-game-top-row-container{display:grid;grid-template-columns:repeat(3,1fr);margin:0 0 2rem;padding:0;justify-content:space-around;align-items:center;max-height:2.5rem;padding:0 .5rem}body #during-game-container #actual-turn-container{background-color:#1f3641;border-bottom:6px solid rgba(12,18,23,.6745098039);border-radius:5px;letter-spacing:.88px;font-size:14px;font-weight:700;color:#a8bfc9;max-height:2.2rem;display:flex;align-items:center;justify-content:center;opacity:.8}body #during-game-container #restart-button{background-color:#a8bfc9;width:2.5rem;height:2.5rem;border-radius:5px;border-bottom:5px solid rgba(55,64,69,.4784313725);display:flex;align-items:center;justify-content:center;border-left:none;border-right:none;border-top:none;grid-column:3;justify-self:flex-end}body #during-game-container #restart-button img{width:1rem}body #during-game-container #fields-container{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,1fr);gap:4rem}body #during-game-container #fields-container #first-field-row,body #during-game-container #fields-container #second-field-row,body #during-game-container #fields-container #third-field-row,body #during-game-container #fields-container #scores-container{display:flex;flex-direction:row;justify-content:space-around;align-items:center}body #during-game-container #fields-container #first-field-row{grid-row:1;grid-column:1/4}body #during-game-container #fields-container #second-field-row{grid-row:2;grid-column:1/4;margin-top:-6rem}body #during-game-container #fields-container #third-field-row{grid-row:3;grid-column:1/4;margin-top:-12rem}body #during-game-container #fields-container .field{width:5rem;height:5rem;border-radius:10px;background-color:#1f3641;border-bottom:8px solid rgba(12,18,23,.6745098039);border-top:none;border-left:none;border-right:none;opacity:.65;cursor:pointer}body #during-game-container #fields-container .field:focus{outline:none}body #during-game-container #fields-container .field:active{outline:none;box-shadow:none}body #during-game-container #fields-container .field:disabled{cursor:default;opacity:1}body #during-game-container #fields-container .field img{width:2.5rem}body #during-game-container #scores-container{margin-top:-16rem;grid-row:4;grid-column:1/4}body #during-game-container #scores-container #x-scores-container{background-color:#31c3bd}body #during-game-container #scores-container #ties-container{background-color:#a8bfc9}body #during-game-container #scores-container #o-scores-container{background-color:#f2b137}body #during-game-container #scores-container .scores{width:6rem;height:4rem;border-radius:10px;display:flex;flex-direction:column;justify-content:center;align-items:center}body #during-game-container #scores-container .scores #player1-current-points,body #during-game-container #scores-container .scores #current-ties,body #during-game-container #scores-container .scores #player2-current-points{font-size:20px;font-weight:700;letter-spacing:1.25px}body #during-game-container #scores-container .scores p{color:#1a2a33;letter-spacing:.75px;margin:0;font-size:12px}body #modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:100vw;height:16rem;background-color:#1f3641;justify-content:center;align-items:center;text-align:center;padding:1rem 0;z-index:1000;display:none}body #modal #modal-result-text{font-size:1.3rem;font-weight:700;letter-spacing:.88px;color:#a8bfc9;margin:0}body #modal #o-turn,body #modal #x-turn,body #modal #restart-game{display:flex;justify-content:center;align-items:center;gap:.5rem}body #modal #o-turn img,body #modal #x-turn img,body #modal #restart-game img{width:1.9rem;height:1.9rem}body #modal #o-turn p,body #modal #x-turn p,body #modal #restart-game p{font-weight:700;letter-spacing:1.25px;font-size:1.5rem}body #modal #o-turn p{color:#f2b137}body #modal #x-turn p{color:#31c3bd}body #modal #restart-game{color:#a8bfc9}body #modal #modal-buttons-container{display:flex;gap:1rem;justify-content:center}body #modal #modal-buttons-container button{border-top:none;border-right:none;border-left:none;border-radius:10px;width:auto;height:3.25rem;letter-spacing:1px;color:#1a2a33;font-size:1rem;font-weight:700;padding:1rem}body #modal #modal-buttons-container #quit-button{background-color:#a8bfc9;border-bottom:5px solid rgba(55,64,69,.4784313725)}body #modal #modal-buttons-container #next-round-button{background-color:#f2b137;border-bottom:5px solid #b9872b}@media (min-width: 500px){#new-game-menu{margin:5rem 20rem!important;width:60vw!important;max-height:10rem!important}#during-game-container{width:60vw!important;margin:0 0 2rem!important}#during-game-container #during-game-top-row-container{grid-row:1;margin-bottom:0!important}#during-game-container #fields-container{display:grid;grid-template-rows:repeat(4,auto)!important;align-items:flex-start;gap:0!important;grid-row:2/5}#during-game-container #fields-container #first-field-row,#during-game-container #fields-container #second-field-row,#during-game-container #fields-container #third-field-row{margin:0!important}#during-game-container #scores-container{grid-row:5!important;margin:0!important}}@media (min-width: 1024px){#new-game-menu,#during-game-container{width:30rem!important}.field{width:7rem!important;height:7rem!important}}