:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:8rem;line-height:1.1}button{border-radius:8px;border:1px solid transparent;font-size:2em;font-weight:500;font-family:inherit;color:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s;text-align:center}button:hover{border-color:#fff}@media only screen and (max-width: 600px){h1{font-size:4rem}button{font-size:1rem}}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center;min-height:100%}.start-section button{padding:1rem}@media only screen and (max-width: 600px){.start-section button{padding:.5rem;font-size:1.5rem}}.draw-container{--gap: 10px;--width: 80px;--height: 80px;--translate: calc(var(--width) + var(--gap));--duration: 1.8s}.draw-container{display:flex;gap:var(--gap);align-content:center;justify-content:center;width:100%;padding-bottom:2rem;font-size:2rem;box-sizing:border-box}div.draw-first{background-color:#646cffaa}.draw,.invisible{height:var(--height);width:var(--width)}.draw{border-radius:50%;background-color:#1a1a1a;color:#fff;font-weight:700;display:flex;justify-content:center;align-items:center}.draw:hover{filter:drop-shadow(0 0 .5em #646cffaa)}.invisible{visibility:hidden}@media only screen and (max-width: 600px){.draw-container{font-size:1rem;--gap: 5px;--width: 45px;--height: 45px}}.bingo-card{width:100%;aspect-ratio:1 / 1;display:grid;grid-template-columns:repeat(5,1fr);font-size:2rem}.bingo-row{display:grid;grid-template-rows:repeat(6,1fr)}.bingo-cell{border:1px solid #ddd;border-radius:0;width:100%;transition:background-image .5s;font-size:inherit}button.bingo-cell:hover{filter:drop-shadow(0 0 .5em white)}.bingo-header{background:#f5f5f5;color:#000;align-content:center;font-size:inherit;font-weight:500;box-sizing:border-box;display:flex;justify-content:center;align-items:center}.marked{background-image:repeating-linear-gradient(140deg,transparent 0%,transparent 48%,red 50%,transparent 52%,transparent 100%)}@media only screen and (max-width: 600px){.bingo-card{font-size:1rem}}section.game-section{width:500px}@media only screen and (max-width: 600px){section.game-section{width:300px}}