:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ink:#eef0ff;--muted:#a7acd1;--paper:#fbf7ee;--paper-ink:#232848;--line:#d9dce8;--heavy:#3a3f66}*{box-sizing:border-box}html,body,#root{min-height:100%}body{color:var(--ink);-webkit-font-smoothing:antialiased;background-color:#080b1a;margin:0;font-family:Segoe UI,Trebuchet MS,system-ui,-apple-system,sans-serif}button{font:inherit}.app{background:radial-gradient(1100px 620px at 8% -12%,#7c3aed6b,#0000 62%),radial-gradient(880px 520px at 102% -6%,#0ea5e94d,#0000 58%),radial-gradient(1000px 720px at 50% 118%,#ec48993d,#0000 62%),linear-gradient(160deg,#0a0f24 0%,#121a3c 46%,#0a0f24 100%);min-height:100vh;padding:clamp(18px,3.5vw,40px) clamp(14px,3vw,40px) 28px;position:relative;overflow:hidden}.backdrop{pointer-events:none;position:absolute;inset:0;overflow:hidden}.backdrop-ball{letter-spacing:-.02em;color:#dbe2ff6b;background:radial-gradient(circle at 32% 26%,#ffffff4d,#8ba3ff24 55%,#8ba3ff08 100%);border:1px solid #ffffff1f;border-radius:50%;place-items:center;font-weight:800;animation:15s ease-in-out infinite alternate drift;display:grid;position:absolute;box-shadow:inset -8px -10px 22px #06091866}@keyframes drift{0%{transform:translate(0,0)rotate(-3deg)}to{transform:translateY(-26px)rotate(7deg)}}.app-header{z-index:1;max-width:1080px;margin:0 auto 26px;position:relative}.brand{align-items:center;gap:18px;display:flex}.brand-ball{aspect-ratio:1;color:#1b2040;background:radial-gradient(circle at 32% 26%,#fff,#ffe3ef 55%,#f9a8c9 100%);border:3px solid #232848;border-radius:50%;flex:none;place-items:center;width:clamp(56px,8vw,74px);font-size:clamp(1.25rem,2.4vw,1.7rem);font-weight:800;display:grid;box-shadow:0 16px 30px -14px #ec4899cc}h1{letter-spacing:-.02em;background:linear-gradient(100deg,#fff,#b9c3ff 55%,#9be9ff);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(1.5rem,3.6vw,2.4rem);line-height:1.05}.app-header p{max-width:62ch;color:var(--muted);margin:8px 0 0;font-size:clamp(.86rem,1.6vw,1rem);line-height:1.55}.rules{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 26px;margin:18px 0 0;padding:0;list-style:none;display:grid}.rules li{color:var(--muted);padding-left:20px;font-size:clamp(.82rem,1.4vw,.94rem);line-height:1.5;position:relative}.rules li:before{content:"";background:linear-gradient(135deg,#22d3ee,#818cf8);border-radius:2px;width:8px;height:8px;position:absolute;top:.48em;left:2px;transform:rotate(45deg);box-shadow:0 0 10px #6366f1b3}@media (width<=640px){.rules{grid-template-columns:1fr}}.app-header code{background:#ffffff1a;border:1px solid #ffffff1f;border-radius:6px;padding:1px 6px;font-size:.86em}.stage{z-index:1;flex-direction:column;gap:22px;max-width:1080px;margin:0 auto;display:flex;position:relative}.board-card{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:linear-gradient(#ffffff17,#ffffff09);border:1px solid #ffffff21;border-radius:28px;padding:clamp(12px,1.6vw,20px);box-shadow:0 40px 90px -40px #000000e6,inset 0 1px #ffffff1f}.board-meta{flex-wrap:wrap;align-items:center;gap:10px;margin:0 4px 14px;display:flex}.meta-chip{letter-spacing:.04em;text-transform:uppercase;color:#cdd4ff;background:#818cf829;border:1px solid #818cf859;border-radius:999px;padding:6px 12px;font-size:.78rem;font-weight:700}.meta-clear{color:#ffd9e6;cursor:pointer;background:#ec489929;border:1px solid #ec489966;border-radius:999px;margin-left:auto;padding:6px 12px;font-size:.78rem;font-weight:700;transition:background .2s,transform .2s}.meta-clear:hover{background:#ec489947;transform:translateY(-1px)}.meta-chip-soft{color:var(--muted);background:#ffffff0d;border-color:#ffffff24}.boards{grid-template-columns:repeat(auto-fit,minmax(min(100%,430px),1fr));gap:16px 18px;display:grid}.board-slot{position:relative}.board-label{letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:0 4px 5px;font-size:.7rem;font-weight:700;display:block}.board-shell{transition:opacity .3s,transform .35s,filter .3s;container-type:inline-size}.board-shell.is-rolling{opacity:.3;filter:blur(3px)saturate(.6);transform:rotate(-1.2deg)scale(.98)}.bingo-board{border:2px solid var(--heavy);background:var(--paper);border-radius:16px;grid-template-columns:repeat(9,1fr);display:grid;overflow:hidden;box-shadow:0 22px 60px -28px #010412f2}.cell{aspect-ratio:1/.72;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);color:inherit;cursor:pointer;animation:.5s cubic-bezier(.22,1.4,.36,1) backwards cell-pop;animation-delay:calc(var(--cell-index) * 8ms);background:0 0;place-items:center;padding:0;transition:background .18s;display:grid}.boards .board-slot .cell{animation-delay:calc(var(--cell-index) * 8ms + var(--slot-delay,0s))}.cell:nth-child(9n){border-right:0}.cell:nth-child(n+19){border-bottom:0}.cell.col-edge{border-right:2px solid var(--heavy)}.cell:disabled{cursor:default}.cell.is-blank{background-image:repeating-linear-gradient(45deg,#2328480d 0 2px,#0000 2px 7px)}.cell:not(:disabled):hover{background-color:#fff}.cell-number{width:1.6em;height:1.6em;color:var(--paper-ink);border-radius:50%;justify-content:center;align-items:center;font-size:clamp(.82rem,3.1cqw,1.6rem);font-weight:800;transition:background .18s,color .18s,transform .18s,box-shadow .18s;display:inline-flex}.cell:not(:disabled):hover .cell-number{transform:scale(1.07)}.cell.is-marked .cell-number{color:#fff;background:radial-gradient(circle at 30% 24%,#ff8fb1,#e11d48 72%);animation:.28s cubic-bezier(.3,1.6,.4,1) daub;box-shadow:0 8px 18px -6px #e11d48bf}@keyframes cell-pop{0%{opacity:0;transform:translateY(10px)scale(.82)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes daub{0%{transform:scale(.55)}to{transform:scale(1)}}.controls{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(#ffffff14,#ffffff08);border:1px solid #ffffff1f;border-radius:24px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px 28px;padding:18px 22px;display:flex;box-shadow:0 30px 70px -40px #000000e6}.dice-wrap{align-items:center;gap:16px;display:flex}.dice-button{aspect-ratio:1;cursor:pointer;filter:drop-shadow(0 20px 34px #ec489961);background:0 0;border:0;border-radius:26px;width:clamp(66px,8vw,86px);padding:0;transition:transform .2s,filter .2s}.dice-button:hover:not(:disabled){filter:drop-shadow(0 26px 40px #ec489980);transform:translateY(-3px)rotate(-3deg)}.dice-button:active:not(:disabled){transform:scale(.94)}.dice-button:disabled{cursor:progress}.dice-button svg{width:100%;height:100%;display:block}.dice-button.is-rolling svg{animation:.62s cubic-bezier(.3,.9,.3,1) dice-roll}@keyframes dice-roll{0%{transform:rotate(0)scale(1)}35%{transform:rotate(200deg)scale(1.12)}70%{transform:rotate(340deg)scale(.96)}to{transform:rotate(360deg)scale(1)}}.dice-label{flex-direction:column;gap:3px;display:flex}.dice-label strong{font-size:1.05rem}.dice-label span{color:var(--muted);font-size:.82rem}.controls-right{flex-wrap:wrap;align-items:flex-end;gap:16px;display:flex}.field{flex-direction:column;gap:7px;display:flex}.field-label{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-size:.78rem;font-weight:700}.field input{color:#fff;text-align:center;background:#070a1aa8;border:1px solid #ffffff2e;border-radius:14px;outline:none;width:108px;padding:12px 14px;font-size:1.15rem;font-weight:800;transition:border-color .2s,box-shadow .2s}.field input:focus{border-color:#22d3eeb3;box-shadow:0 0 0 4px #22d3ee29}.field-hint{color:var(--muted);font-size:.78rem}.btn-download{color:#041019;cursor:pointer;background:linear-gradient(135deg,#67e8f9,#818cf8);border:0;border-radius:16px;align-items:center;gap:10px;padding:14px 22px;font-size:1rem;font-weight:800;transition:transform .2s,box-shadow .2s,filter .2s;display:inline-flex;box-shadow:0 20px 36px -16px #6366f1d9}.btn-download:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 26px 44px -18px #6366f1f2}.btn-download:active:not(:disabled){transform:translateY(0)scale(.98)}.btn-download:disabled{filter:grayscale(.5)brightness(.85);cursor:progress}.btn-download svg{width:18px;height:18px}.app-footer{z-index:1;color:#a7acd1bf;text-align:center;max-width:1080px;margin:26px auto 0;font-size:.82rem;line-height:1.6;position:relative}@media (width<=720px){.controls{flex-direction:column;align-items:stretch}.dice-wrap{justify-content:center}.controls-right{justify-content:space-between}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}
