[data-theme=light]{--bg:#fff;--bg-hover:#f7f7f7;--line:#a3a3a3;--text:#262626;--muted:#a3a3a3;--red:#ef4444;--blue:#3b82f6}[data-theme=dark]{--bg:#0a0a0a;--bg-hover:#131313;--line:#404040;--text:#f5f5f5;--muted:#737373;--red:#f87171;--blue:#60a5fa}:root{--current:var(--red)}body{box-sizing:border-box;background-color:var(--bg);color:var(--text);min-height:100vh;margin:0;padding-block:2.5rem;font-family:Inter;transition:all .25s;position:relative}h1,h2,h3,strong,span,p{margin:0;line-height:1}button,a{cursor:pointer}button{color:inherit;border:none;padding:0;font-family:inherit}#root{flex-direction:column;align-items:center;gap:2.5rem;max-width:100%;display:flex}::-webkit-scrollbar{width:0;height:0}::selection{background-color:color-mix(in srgb, var(--current) 25%, transparent)}@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/InterVariable-BY0vKDoq.woff2)format("woff2")}@font-face{font-family:JetBrainsMono;font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/JetBrainsMonoVariable-D5KFAJfm.woff2)format("woff2")}.scores-wrapper{justify-content:space-between;width:30rem;display:flex}@media screen and (width<=768px){.scores-wrapper{width:25rem}}@media screen and (width<=576px){.scores-wrapper{width:20rem}}@media screen and (width<=384px){.scores-wrapper{width:17.5rem}}@media screen and (width<=320px){.scores-wrapper{width:15rem}}h1{letter-spacing:1px;color:var(--text);font-family:JetBrainsMono;font-size:1.5rem;transition:color .25s}@media screen and (width<=320px){h1{font-size:1.25rem}}.board{grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);width:25rem;height:25rem;display:grid}@media screen and (width<=576px){.board{width:20rem;height:20rem}}@media screen and (width<=384px){.board{width:17.5rem;height:17.5rem}}@media screen and (width<=320px){.board{width:15rem;height:15rem}}.cell{box-sizing:border-box;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background-color:#0000;justify-content:center;align-items:center;transition:border-right .25s,border-bottom .25s,background-color .25s;display:flex}.cell.red{color:var(--red)}.cell.blue{color:var(--blue)}.cell:hover{background-color:var(--bg-hover)}.cell .icon{stroke-width:.75px;width:7rem;height:7rem}.cell:nth-child(3n){border-right:none}.cell:nth-last-child(-n+3){border-bottom:none}@media screen and (width<=576px){.cell .icon{width:6rem;height:6rem}}@media screen and (width<=384px){.cell .icon{width:5rem;height:5rem}}@media screen and (width<=320px){.cell .icon{width:4rem;height:4rem}}.win{flex-direction:column;align-items:center;gap:1rem;display:flex}.win.default{color:var(--muted)}.win.red{color:var(--red)}.win.blue{color:var(--blue)}.win{transition:color .25s}.win .content{align-items:center;display:flex}.win .content span{font-size:1.25rem;font-weight:300}.win .content .icon{stroke-width:1.5px;width:1.5rem;height:1.5rem;margin-left:.5rem}.win button{color:var(--text);border:1px solid var(--line);background-color:#0000;border-radius:2rem;padding:.5rem 1rem;font-size:1rem;font-weight:300;transition:color .25s,border .25s}.win button:hover{border:1px solid var(--text)}.icon{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:2rem;height:2rem;transition:color .25s}.score{color:var(--muted);flex-direction:column;align-items:center;gap:1rem;transition:color .25s;display:flex}.score.red.active{color:var(--red)}.score.blue.active{color:var(--blue)}.score strong{letter-spacing:.5px;font-family:JetBrainsMono;font-size:1rem;font-weight:300}.score .icon{stroke-width:1.25px;width:1.5rem;height:1.5rem}.score span{font-size:1rem;font-weight:400}@media screen and (width<=320px){.score{gap:.5rem}.score strong{font-size:.75rem}.score .icon{width:1rem;height:1rem}.score span{font-size:.75rem}}.shift{align-items:center;gap:.25rem;display:flex}.shift.red{color:var(--red)}.shift.blue{color:var(--blue)}.shift{transition:color .25s}.shift span{color:var(--muted);font-size:1rem;font-weight:300}.shift .icon{stroke-width:1.25px;width:1.5rem;height:1.5rem}@media screen and (width<=320px){.shift span{font-size:.75rem}.shift .icon{width:1rem;height:1rem}}.switcher{width:2rem;height:2rem;color:var(--text);background-color:#0000;border-radius:50%;justify-content:center;align-items:center;transition:color .25s;display:flex;position:absolute;top:2.25rem;right:2.25rem}.switcher .icon{stroke-width:1.5px;width:1.5rem;height:1.5rem}@media screen and (width<=576px){.switcher{inset:auto auto 2rem 2rem}}
