:root{--color-light: #99687a;--color-dark: #371240;--color-primary: #db48ff;--color-secondary: #3bd9ff;--color-text: #ffe;--color-hover: #cc2562;--color-contrast: #cc2562;--size-xs: .5rem;--size-xs-sm: .9rem;--size-sm: 1rem;--size-sm-md: 1.3rem;--size-md: 1.5rem;--size-md-lg: 1.8rem;--size-lg: 2rem;--size-xl: 2.5rem}*{margin:0;padding:0;box-sizing:border-box;font-weight:400;word-break:break-word;letter-spacing:2px;text-decoration:none;list-style:none;border:none;outline:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}body{background:fixed url(data:image/png;base64,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) var(--color-dark);font-family:Rock Salt,cursive,sans-serif}body::-webkit-scrollbar,body::-webkit-scrollbar-button{width:20px;height:10px}body::-webkit-scrollbar-thumb{background-color:var(--color-primary);border:5px solid var(--color-dark);border-radius:20px}body::-webkit-scrollbar-thumb:hover,body::-webkit-scrollbar-thumb:active{background-color:var(--color-hover)}a{color:var(--color-contrast);transition:all .3s}a:focus,a:hover,a:active{color:var(--color-hover);text-decoration:underline}.flex-col-center{display:flex;flex-direction:column;align-items:center;justify-content:center}.flex-row-center{display:flex;flex-direction:row;align-items:center;justify-content:center}.game-container{width:100%;display:flex;flex-direction:column;align-items:center;color:var(--color-text);padding:0 var(--size-md)}header{margin-bottom:var(--size-xs)}.game-logo{width:100%;max-width:calc(var(--size-lg) * 9);transform:translateY(-100%);animation:slide-down 1.2s cubic-bezier(.35,.1,.4,1) forwards}.game-logo svg{width:100%}#svg-txt-hashtag,#svg-txt-jogo-da-velha{fill:var(--color-text);stroke-width:1px;stroke:var(--color-text);stroke-dasharray:171;stroke-dashoffset:171;animation:txt-logo 4.5s linear forwards}#rectangle-light-blue{animation:rectangle-light-blue 2s ease forwards;border-radius:6px;transform:translate(-4px,-4px);opacity:0}main h1,main p{font-size:var(--size-sm-md);margin-bottom:var(--size-sm)}main h1{animation:fade-in,flash 2.5s linear forwards;opacity:0}.game-board-container{background-color:var(--color-dark)}.game-board{max-width:300px;display:flex;flex-wrap:wrap;cursor:pointer;opacity:1}.game-board.game-over{cursor:default;animation:fade-out-3 2s ease forwards}.board-cell{width:94px;height:94px;display:flex;justify-content:center;font-size:var(--size-lg);align-items:center;background-color:var(--color-light);border-radius:6px;margin:3px;transition:.4s;animation:zoom-in .4s ease}.board-cell:hover,.board-cell:focus{opacity:.8}.player-turn{width:calc(var(--size-sm) + var(--size-sm-md));height:calc(var(--size-sm) + var(--size-sm-md));font-size:var(--size-xs-sm);font-weight:700;border-radius:4px;margin:calc(var(--size-md) / 2)}.player-O{background-color:var(--color-primary);box-shadow:0 0 6px var(--color-primary)}.player-X{background-color:var(--color-secondary);box-shadow:0 0 6px var(--color-secondary)}.player-O svg{stroke-width:1px;stroke:var(--color-text);stroke-dasharray:100;stroke-dashoffset:100;animation:draw-letter-o 2s ease forwards}.player-X svg #line-1{stroke:var(--color-text);stroke-dasharray:55;stroke-dashoffset:55;animation:draw-letter-x-line-1 .5s ease forwards}.player-X svg #line-2{stroke:var(--color-text);stroke-dasharray:30;stroke-dashoffset:30;animation:draw-letter-x-line-2 .6s ease .4s forwards}.game-result{animation:pulse 1.6s linear}footer{gap:var(--size-sm);margin-top:var(--size-md);margin-bottom:var(--size-lg)}footer p{color:var(--color-light);font-size:calc(var(--size-md) / 3);animation:slide-left 1.5s cubic-bezier(.35,.1,.4,1)}footer a{margin:0 calc(var(--size-xs) / 3)}footer button{gap:var(--size-xs)}.restart-game{background-color:var(--color-contrast);color:var(--color-text);padding:calc(var(--size-xs-sm) / 3) var(--size-xs-sm);border-radius:6px;font-family:Rock Salt,cursive,sans-serif;font-size:calc(var(--size-md) / 2);font-weight:600;margin:var(--size-xs-sm);transition:.4s ease;cursor:pointer;animation:slide-up 1.5s cubic-bezier(.35,.1,.4,1)}.restart-game:hover,.restart-game:focus{box-shadow:0 0 8px var(--color-contrast)}.restart-game:hover svg,.restart-game:focus svg{animation:rotate .25s ease-in}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes pulse{0%{transform:scale(1)}15%{transform:scale(1.6)}30%{transform:scale(1)}45%{transform:scale(1.2)}60%{transform:scale(1);opacity:1}85%{opacity:.5}90%{opacity:1}95%{opacity:.5}to{opacity:1}}@keyframes zoom-in{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes fade-in{to{opacity:1}}@keyframes fade-out-3{to{opacity:.3}}@keyframes flash{0%{opacity:0}80%{opacity:1}85%{opacity:.3}90%{opacity:1}95%{opacity:.3}to{opacity:1}}@keyframes slide-up{0%{transform:translateY(100%);opacity:0}30%{transform:translateY(-25%);opacity:1}to{transform:translateY(0);opacity:1}}@keyframes slide-left{0%{transform:translate(-100%);opacity:0}40%{transform:translate(20%);opacity:1}to{transform:translate(0);opacity:1}}@keyframes slide-down{0%{transform:translateY(-100%)}30%{transform:translateY(0)}40%{transform:translateY(-6%)}50%{transform:translateY(0)}65%{transform:translateY(-3%)}75%{transform:translateY(0)}85%{transform:translateY(-1%)}to{transform:translateY(0)}}@keyframes rectangle-light-blue{0%{border-radius:6px;transform:translate(-4px,-4px);opacity:0}to{border-radius:6px;transform:translate(0);opacity:1}}@keyframes txt-logo{0%{stroke-dashoffset:0;fill:transparent}35%{stroke-dashoffset:171}40%{fill:var(--color-text)}to{stroke-dashoffset:171;fill:var(--color-text)}}@keyframes draw-letter-o{0%{stroke-dashoffset:100}35%{stroke-dashoffset:0}to{stroke-dashoffset:0}}@keyframes draw-letter-x-line-1{0%{stroke-dashoffset:55}50%{stroke-dashoffset:0}to{stroke-dashoffset:0}}@keyframes draw-letter-x-line-2{0%{stroke-dashoffset:30}60%{stroke-dashoffset:0}to{stroke-dashoffset:0}}@media screen and (max-width: 340px){main h1,main p{font-size:var(--size-sm);margin-bottom:var(--size-sm)}.player-turn{width:calc(var(--size-lg));height:calc(var(--size-lg))}.restart-game{font-size:calc(var(--size-lg) / 3)}}@media screen and (max-width: 380px){.game-container{padding:0 var(--size-sm)}.game-board{max-width:240px}.board-cell{width:74px;height:74px}}