:root{color-scheme:dark;font-family:Inter,system-ui,sans-serif;background:#08111f;color:#e7eefb;--accent: #56ccf2;--pending: #1c2742}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:#08111f}button,input,textarea,select{font:inherit}button{cursor:pointer}#root{min-height:100vh}.app-shell{width:min(100%,32rem);margin:0 auto;min-height:100vh}.board-shell{position:relative;min-height:100vh;display:grid;place-items:center;padding:.75rem;overflow:hidden;--bingo-duration: 3.2s;--bingo-duration-fast: 1.76s;--bingo-duration-slow: 3.36s;--bingo-accent: #ffd166;--bingo-accent-2: #ff6bb3;--bingo-accent-3: #56ccf2;--bingo-rotate: 0deg;--bingo-scale: 1.05}.loading-shell{background:#08111f}.board{width:100%;position:relative;z-index:1}.board-shell.is-bingoing .board{animation:board-bingo-celebration var(--bingo-duration) cubic-bezier(.16,1,.3,1) both}.bingo-header,.bingo-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.45rem}.bingo-header{margin-bottom:.45rem}.bingo-header-cell{text-align:center;font-size:1.15rem;font-weight:800;letter-spacing:.14em;color:var(--accent)}.bingo-cell{position:relative;display:grid;place-items:center;aspect-ratio:1;min-height:0;padding:.25rem;border:1px solid rgba(158,177,209,.14);border-radius:18px;background:var(--pending);color:#f8fbff;overflow:visible;isolation:isolate;transform-origin:center;--fx-duration: 1.2s;--fx-duration-fast: .85s;--fx-duration-slow: 1.35s;--fx-scale-peak: 1.22;--fx-rotate: 0deg;--fx-tilt: 0deg;--fx-ring-scale: 1.8;--fx-sweep-angle: 16deg;--fx-accent: #56ccf2;--fx-accent-2: #2bd576;transition:background-color .2s ease,border-color .2s ease,opacity .2s ease}.bingo-cell.is-marked{border-color:#2bd576b3;background:#2bd5763d}.bingo-cell.is-animating{will-change:transform,filter}.bingo-cell.is-animating.family-pop{animation:family-pop var(--fx-duration) cubic-bezier(.2,1.25,.2,1) both}.bingo-cell.is-animating.family-jelly{animation:family-jelly var(--fx-duration) cubic-bezier(.22,1,.36,1) both}.bingo-cell.is-animating.family-shake{animation:family-shake var(--fx-duration-fast) ease-in-out both}.bingo-cell.is-animating.family-spin{animation:family-spin var(--fx-duration) cubic-bezier(.16,1,.3,1) both}.bingo-cell.is-animating.family-burst{animation:family-burst var(--fx-duration) cubic-bezier(.2,1.1,.2,1) both}.bingo-cell.is-animating.family-sweep{animation:family-sweep var(--fx-duration) cubic-bezier(.16,1,.3,1) both}.bingo-cell.is-free-image{overflow:hidden;padding:0;border-color:#9eb1d124;background:#fff;cursor:default}.free-image{display:block;width:100%;height:100%;object-fit:cover}.cell-label{position:relative;z-index:3;font-size:clamp(1.1rem,7vw,2.1rem);font-weight:800}.family-pop .cell-label{animation:label-pop var(--fx-duration) ease-out both}.family-jelly .cell-label{animation:label-jelly var(--fx-duration) ease-out both}.family-shake .cell-label{animation:label-shake var(--fx-duration-fast) ease-in-out both}.family-spin .cell-label{animation:label-spin var(--fx-duration) ease-out both}.family-burst .cell-label{animation:label-burst var(--fx-duration) ease-out both}.family-sweep .cell-label{animation:label-sweep var(--fx-duration) ease-out both}.cell-effects{position:absolute;top:-.5rem;right:-.5rem;bottom:-.5rem;left:-.5rem;z-index:2;pointer-events:none}.fx-core,.fx-glow,.fx-ring,.fx-sweep,.fx-sparks,.fx-particles{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0}.fx-core{border-radius:22px;background:radial-gradient(circle,var(--fx-accent) 0%,transparent 68%);mix-blend-mode:screen}.fx-glow{border-radius:22px;background:radial-gradient(circle at 30% 30%,var(--fx-accent) 0%,transparent 44%),radial-gradient(circle at 70% 70%,var(--fx-accent-2) 0%,transparent 46%);filter:blur(10px)}.fx-ring{top:-.12rem;right:-.12rem;bottom:-.12rem;left:-.12rem;border:2px solid var(--fx-accent);border-radius:22px}.fx-sweep{top:-22%;right:-22%;bottom:-22%;left:-22%;background:linear-gradient(90deg,transparent 0%,transparent 30%,rgba(255,255,255,.14) 44%,var(--fx-accent) 50%,transparent 62%,transparent 100%);transform:translate(-130%) rotate(var(--fx-sweep-angle));filter:blur(1px)}.fx-sparks{top:15%;right:15%;bottom:15%;left:15%;background:linear-gradient(90deg,transparent,var(--fx-accent),transparent) center/100% 18% no-repeat,linear-gradient(0deg,transparent,var(--fx-accent-2),transparent) center/18% 100% no-repeat}.fx-particle{position:absolute;left:50%;top:50%;width:var(--particle-size);height:var(--particle-size);background:var(--particle-color);opacity:0;transform:translate(-50%,-50%)}.fx-particle.shape-confetti{border-radius:3px}.fx-particle.shape-pixel{border-radius:1px;box-shadow:0 0 0 1px #ffffff1f}.fx-particle.shape-star{clip-path:polygon(50% 0%,62% 34%,100% 38%,72% 59%,82% 100%,50% 74%,18% 100%,28% 59%,0% 38%,38% 34%)}.flair-glow .fx-core,.flair-glow .fx-glow{animation:fx-glow var(--fx-duration-slow) ease-out both}.flair-ring .fx-ring-one{animation:fx-ring var(--fx-duration) ease-out both}.flair-double-ring .fx-ring-one{animation:fx-ring var(--fx-duration-fast) ease-out both}.flair-double-ring .fx-ring-two{border-color:var(--fx-accent-2);animation:fx-ring-delayed var(--fx-duration-slow) ease-out both}.flair-spark .fx-sparks{animation:fx-sparks var(--fx-duration-fast) ease-out both}.flair-laser .fx-sweep,.flair-sweep .fx-sweep,.flair-comet .fx-sweep{opacity:1;animation:fx-sweep-bar var(--fx-duration) ease-out both}.flair-confetti .fx-particle,.flair-pixel .fx-particle,.flair-star .fx-particle,.flair-firework .fx-particle,.flair-comet .fx-particle{animation:fx-particle var(--fx-duration-slow) cubic-bezier(.16,1,.3,1) both;animation-delay:var(--particle-delay)}.flair-confetti .fx-core,.flair-pixel .fx-core,.flair-star .fx-core,.flair-firework .fx-core,.flair-comet .fx-core{animation:fx-core-flash var(--fx-duration-fast) ease-out both}.flair-star .fx-sparks,.flair-firework .fx-sparks{animation:fx-sparks var(--fx-duration) ease-out both}.variant-burst-firework .fx-ring-one{animation:fx-ring-firework var(--fx-duration-slow) ease-out both}.variant-burst-firework .fx-ring-two{border-color:var(--fx-accent-2);animation:fx-ring-delayed var(--fx-duration-slow) ease-out both}.variant-sweep-comet .fx-core{animation:fx-core-flash var(--fx-duration-fast) ease-out both}.loading-spinner{width:3rem;height:3rem;border:.28rem solid rgba(86,204,242,.2);border-top-color:var(--accent);border-radius:999px;animation:spin .85s linear infinite}.bingo-completion{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;display:grid;place-items:center;z-index:6}.bingo-flash{position:absolute;top:-10%;right:-10%;bottom:-10%;left:-10%;background:radial-gradient(circle,rgba(255,255,255,.26) 0%,transparent 38%),radial-gradient(circle,var(--bingo-accent) 0%,transparent 44%),radial-gradient(circle,var(--bingo-accent-2) 0%,transparent 50%);mix-blend-mode:screen;opacity:0;animation:bingo-flash var(--bingo-duration-fast) ease-out both}.bingo-rings{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center}.bingo-ring{position:absolute;width:min(74vw,28rem);aspect-ratio:1;border-radius:999px;border:.5rem solid var(--bingo-accent);opacity:0}.bingo-ring-one{animation:bingo-ring var(--bingo-duration) ease-out both}.bingo-ring-two{border-color:var(--bingo-accent-2);animation:bingo-ring-delayed var(--bingo-duration-slow) ease-out both}.bingo-ring-three{border-color:var(--bingo-accent-3);animation:bingo-ring-late var(--bingo-duration-slow) ease-out both}.bingo-banner{position:relative;padding:.6rem 1.35rem;border-radius:999px;background:linear-gradient(135deg,var(--bingo-accent),var(--bingo-accent-2),var(--bingo-accent-3));box-shadow:0 0 0 .24rem #ffffff2e,0 0 3rem #ffffff4d;transform:rotate(var(--bingo-rotate)) scale(.2);opacity:0;animation:bingo-banner-pop var(--bingo-duration) cubic-bezier(.2,1.25,.2,1) both}.bingo-banner-word{display:block;font-size:clamp(2.6rem,16vw,5.8rem);font-weight:900;letter-spacing:.18em;text-indent:.18em;color:#08111f;text-shadow:0 0 .35rem rgba(255,255,255,.45),0 0 1.4rem rgba(255,255,255,.35);animation:bingo-word-wobble var(--bingo-duration-fast) ease-out both}.bingo-particles{position:absolute;top:0;right:0;bottom:0;left:0}.bingo-particle{position:absolute;left:50%;top:50%;width:var(--bingo-particle-size);height:var(--bingo-particle-size);background:var(--bingo-particle-color);opacity:0;transform:translate(-50%,-50%);animation:bingo-particle var(--bingo-duration-slow) cubic-bezier(.16,1,.3,1) both;animation-delay:var(--bingo-particle-delay)}.bingo-particle.shape-confetti{border-radius:3px}.bingo-particle.shape-pixel{border-radius:1px;box-shadow:0 0 0 1px #ffffff24}.bingo-particle.shape-star{clip-path:polygon(50% 0%,62% 34%,100% 38%,72% 59%,82% 100%,50% 74%,18% 100%,28% 59%,0% 38%,38% 34%)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes board-bingo-celebration{0%{transform:scale(1) rotate(0);filter:brightness(1)}14%{transform:scale(var(--bingo-scale)) rotate(var(--bingo-rotate));filter:brightness(1.3)}24%{transform:scale(.98) rotate(calc(var(--bingo-rotate) * -1))}34%{transform:scale(1.03) rotate(calc(var(--bingo-rotate) * .55))}48%{transform:translate3d(-1.5%,0,0) scale(1.01)}56%{transform:translate3d(1.5%,0,0) scale(1.02)}64%{transform:translate3d(-1%,0,0) scale(1)}to{transform:scale(1) rotate(0);filter:brightness(1)}}@keyframes bingo-flash{0%{opacity:0;transform:scale(.2)}16%{opacity:.95;transform:scale(1)}to{opacity:0;transform:scale(1.6)}}@keyframes bingo-ring{0%{opacity:0;transform:scale(.3)}14%{opacity:.95}to{opacity:0;transform:scale(1.7)}}@keyframes bingo-ring-delayed{0%,14%{opacity:0;transform:scale(.3)}26%{opacity:.82}to{opacity:0;transform:scale(1.95)}}@keyframes bingo-ring-late{0%,24%{opacity:0;transform:scale(.3)}36%{opacity:.7}to{opacity:0;transform:scale(2.15)}}@keyframes bingo-banner-pop{0%{opacity:0;transform:rotate(var(--bingo-rotate)) scale(.15)}18%{opacity:1;transform:rotate(calc(var(--bingo-rotate) * -1)) scale(1.15)}34%{transform:rotate(var(--bingo-rotate)) scale(.96)}52%{transform:rotate(calc(var(--bingo-rotate) * -.5)) scale(1.04)}to{opacity:0;transform:rotate(0) scale(1.02)}}@keyframes bingo-word-wobble{0%,to{transform:scale(1) rotate(0)}16%{transform:scale(1.18) rotate(-4deg)}32%{transform:scale(.95) rotate(3deg)}48%{transform:scale(1.08) rotate(-2deg)}64%{transform:scale(1.02) rotate(1deg)}}@keyframes bingo-particle{0%{opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(0)}16%{opacity:1}to{opacity:0;transform:translate(calc(-50% + var(--bingo-particle-x)),calc(-50% + var(--bingo-particle-y))) scale(1.1) rotate(var(--bingo-particle-rotate))}}@keyframes family-pop{0%{transform:scale(1)}18%{transform:scale(var(--fx-scale-peak))}36%{transform:scale(.92) rotate(calc(var(--fx-rotate) * -.5))}58%{transform:scale(1.08) rotate(var(--fx-rotate))}to{transform:scale(1)}}@keyframes family-jelly{0%{transform:scale(1)}18%{transform:scale(1.34,.82)}34%{transform:scale(.82,1.3)}52%{transform:scale(1.18,.9)}72%{transform:scale(.96,1.08)}to{transform:scale(1)}}@keyframes family-shake{0%,to{transform:translateZ(0) rotate(0)}12%{transform:translate3d(-8%,2%,0) rotate(calc(var(--fx-tilt) * -.4))}24%{transform:translate3d(7%,-3%,0) rotate(var(--fx-tilt))}38%{transform:translate3d(-5%,5%,0) rotate(calc(var(--fx-tilt) * -.8))}56%{transform:translate3d(5%,-4%,0) rotate(calc(var(--fx-tilt) * .6))}72%{transform:translate3d(-3%,1%,0) rotate(calc(var(--fx-tilt) * -.3))}}@keyframes family-spin{0%{transform:rotate(0) scale(1)}28%{transform:rotate(var(--fx-rotate)) scale(var(--fx-scale-peak))}52%{transform:rotate(calc(var(--fx-rotate) * -.7)) scale(.94)}76%{transform:rotate(calc(var(--fx-rotate) * .35)) scale(1.08)}to{transform:rotate(0) scale(1)}}@keyframes family-burst{0%{transform:scale(1);filter:brightness(1)}18%{transform:scale(var(--fx-scale-peak));filter:brightness(1.35)}44%{transform:scale(.95)}to{transform:scale(1);filter:brightness(1)}}@keyframes family-sweep{0%{transform:rotate(0) translateY(0)}22%{transform:rotate(calc(var(--fx-tilt) * .35)) translateY(-6%)}58%{transform:rotate(calc(var(--fx-tilt) * -.3)) translateY(2%)}to{transform:rotate(0) translateY(0)}}@keyframes label-pop{0%,to{transform:scale(1)}24%{transform:scale(1.24)}42%{transform:scale(.88)}68%{transform:scale(1.08)}}@keyframes label-jelly{0%,to{transform:scale(1)}25%{transform:scale(1.22,.82)}45%{transform:scale(.82,1.2)}70%{transform:scale(1.08,.94)}}@keyframes label-shake{0%,to{transform:translateZ(0)}14%{transform:translate3d(-8%,0,0)}28%{transform:translate3d(8%,0,0)}42%{transform:translate3d(-6%,0,0)}56%{transform:translate3d(5%,0,0)}}@keyframes label-spin{0%,to{transform:rotate(0) scale(1)}30%{transform:rotate(calc(var(--fx-rotate) * -.8)) scale(1.14)}62%{transform:rotate(calc(var(--fx-rotate) * .35)) scale(.94)}}@keyframes label-burst{0%,to{transform:scale(1)}20%{transform:scale(1.34)}46%{transform:scale(.82)}74%{transform:scale(1.08)}}@keyframes label-sweep{0%,to{transform:translate(0) scale(1)}26%{transform:translate(6%) scale(1.14)}54%{transform:translate(-4%) scale(.95)}}@keyframes fx-glow{0%{opacity:0;transform:scale(.8)}20%{opacity:.95;transform:scale(1)}to{opacity:0;transform:scale(1.55)}}@keyframes fx-ring{0%{opacity:0;transform:scale(.72)}18%{opacity:.95}to{opacity:0;transform:scale(var(--fx-ring-scale))}}@keyframes fx-ring-delayed{0%,14%{opacity:0;transform:scale(.72)}32%{opacity:.8}to{opacity:0;transform:scale(calc(var(--fx-ring-scale) + .35))}}@keyframes fx-ring-firework{0%{opacity:0;transform:scale(.65)}16%{opacity:1}to{opacity:0;transform:scale(calc(var(--fx-ring-scale) + .55))}}@keyframes fx-sweep-bar{0%{opacity:0;transform:translate(-140%) rotate(var(--fx-sweep-angle))}18%{opacity:1}to{opacity:0;transform:translate(140%) rotate(var(--fx-sweep-angle))}}@keyframes fx-sparks{0%{opacity:0;transform:scale(.2) rotate(0)}22%{opacity:1;transform:scale(1.15) rotate(18deg)}to{opacity:0;transform:scale(1.9) rotate(42deg)}}@keyframes fx-core-flash{0%{opacity:0;transform:scale(.2)}18%{opacity:.9;transform:scale(1.1)}to{opacity:0;transform:scale(1.8)}}@keyframes fx-particle{0%{opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(0)}16%{opacity:1}to{opacity:0;transform:translate(calc(-50% + var(--particle-x)),calc(-50% + var(--particle-y))) scale(1) rotate(var(--particle-rotate))}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (min-width: 640px){.app-shell{width:min(100%,36rem)}}@media (prefers-reduced-motion: reduce){.bingo-cell,.cell-label,.loading-spinner,.board,.bingo-completion,.bingo-particle,.bingo-ring,.bingo-banner{animation:none!important;transition:none!important}}
