@import"https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap";@import"https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&family=Pacifico&display=swap";:root{--dark-gray: #1a2a32;--gray: #2e4756;--light-gray: #d3d3d3;--turquoise: #4d8785;--yellow: #c49442;--dark-yellow: #b18942;--danger: rgb(249, 127, 66)}.other-container{width:100vw;height:100vh;background-color:var(--dark-gray);display:flex;flex-direction:column;align-items:center;font-family:Oswald,sans-serif}.other-container h2{margin:1.2rem auto .2rem;color:var(--yellow);letter-spacing:2px;font-weight:400;font-size:1.8rem;text-transform:uppercase}.board-wraper{margin-top:1.4rem;display:grid;grid-template-columns:repeat(3,5.5rem);grid-template-rows:2.5rem .5rem repeat(3,5.5rem) .5rem 35px 40px;gap:4px}.board-wraper div{display:grid;background-color:#2e4756;border-radius:.4rem;place-items:center;color:#f8d19f}.board-wraper .turn-wraper{grid-column:span 3;background-color:#3f5969}.board-wraper .turns{width:100%;height:100%;background-color:#4d4934}.board-wraper h3{font-weight:100;font-size:1.6rem;color:#ff0;letter-spacing:4px;animation:turn-animate 3s}.board-wraper .turns p{font-size:1.2rem;animation:turn-animate 3s;color:#aaa;letter-spacing:2px}.board-wraper .turns p span{color:#1fc21a;margin:0 .5rem 0 .2rem;font-weight:600;font-size:1.4rem;width:2.2rem;height:2.2rem;border-radius:50%;background-color:#656049;display:inline-block;text-align:center;padding-left:2px;box-sizing:border-box}.board-wraper .square{font-size:2rem;font-weight:200;color:var(--dark-yellow);cursor:pointer;font-family:Pacifico,cursive}.board-wraper .square:hover{filter:brightness(.9)}.board-wraper .hovering:hover:before{content:attr(data-foo);position:absolute;color:#695c47}.board-wraper .res{font-size:.8rem;padding:.2rem;color:#333;display:flex;justify-content:center;gap:.3rem}.board-wraper .res1,.board-wraper .res3{background-color:var(--turquoise)}.board-wraper .res2{background-color:var(--yellow)}.board-wraper .res span{color:#ccc;font-weight:600}.board-wraper .changeColor{background-color:orange}.board-wraper .clearall{grid-column:span 2;color:#aaa;font-size:.8rem;background-color:#4d4934}.board-wraper .actions{background-color:var(--danger);color:#047304;font-size:.75rem;letter-spacing:1px}.board-wraper .dividers{grid-column:span 3;background-color:var(--dark-gray)}.btns{text-transform:uppercase}.btns:hover{filter:brightness(.8);cursor:pointer}@keyframes turn-animate{0%{opacity:.1;transform:translate(-30px)}80%{opacity:1;transform:translate(0)}}*{margin:0;padding:0;box-sizing:border-box}body{background-color:#c8f3e4;width:100vw;height:100vh}.app{width:100%;height:100%}