@import "https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;500;700&display=swap";:root{--text:#f0dcd4;--text-h:#f7f1e5;--bg:#4a1822;--border:#8b3f46;--code-bg:#67252f;--accent:#f2c7b5;--accent-bg:#f2c7b51a;--accent-border:#f2c7b580;--social-bg:#8b3f4680;--shadow:#0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;--sans:"Roboto Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--heading:"Roboto Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--mono:"Roboto Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (width<=1024px){:root{font-size:16px}}#root{text-align:center;border-inline:1px solid var(--border);box-sizing:border-box;flex-direction:column;width:1126px;max-width:100%;min-height:100svh;margin:0 auto;display:flex}body{margin:0}h1,h2{font-family:var(--heading);color:var(--text-h);font-weight:500}h1{letter-spacing:-1.68px;margin:32px 0;font-size:56px}@media (width<=1024px){h1{margin:20px 0;font-size:36px}}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--text-h);border-radius:4px;display:inline-flex}code{background:var(--code-bg);padding:4px 8px;font-size:15px;line-height:135%}:root{color:#f7f1e5;font-synthesis:none;background:#4a1822;font-family:Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}*{box-sizing:border-box}body{background:radial-gradient(circle at 80% 0,#8b3f46 0,#4a1822 42rem);min-width:320px;margin:0}button,input{font:inherit}button{cursor:pointer}.landing,.join-screen{max-width:760px;min-height:100vh;margin:0 auto;padding:13vh 7vw}.eyebrow{color:#f2c7b5;letter-spacing:.12em;text-transform:uppercase;font:700 .75rem/1.2 Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}h1{margin:1.2rem 0;font-size:clamp(3.2rem,9vw,7.5rem);font-weight:400;line-height:.9}.landing h1,.join-screen h1{text-transform:uppercase;font-size:clamp(2.35rem,7vw,5.25rem);line-height:1}em{color:#f2c7b5;font-style:normal}p{color:#f0dcd4;font:1.05rem/1.5 Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.mode-actions{flex-wrap:wrap;justify-content:center;gap:.8rem;margin-top:3rem;display:flex}.primary-button,.secondary-button,.claim-button,.back-button{text-transform:uppercase;letter-spacing:.08em;border:0;padding:.9rem 1.2rem;font:700 .78rem Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.primary-button{color:#4a1822;background:#f2c7b5}.secondary-button,.claim-button{color:#f7f1e5;background:0 0;border:1px solid #c27a7e}.primary-button:focus-visible,.secondary-button:focus-visible,.claim-button:focus-visible,.back-button:focus-visible,input:focus-visible,.card-cell:focus-visible{outline-offset:3px;outline:3px solid #f2c7b5}.join-form{justify-items:center;gap:1.2rem;max-width:360px;margin:3rem auto 0;display:grid}.join-form label{width:100%}.join-form .primary-button{justify-self:center}label{color:#f0dcd4;text-transform:uppercase;letter-spacing:.08em;gap:.45rem;font:.78rem Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;display:grid}input,select{color:#f7f1e5;background:#67252f;border:1px solid #c27a7e;width:100%;padding:.8rem}select{--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;height:2.6rem;padding-block:.4rem;line-height:1.2}.back-button{color:#f0dcd4;background:0 0;margin-top:1rem;padding-left:0}.error{color:#8f3f36;background:#f7f1e5;padding:.65rem .8rem;display:inline-block}.room-layout{grid-template-columns:minmax(0,1fr) 300px;gap:2rem;max-width:1120px;margin:0 auto;padding:6vh 4vw;display:grid}.game-panel,.side-panel{background:#4a1822d1;border:1px solid #8b3f46;padding:1.5rem}.game-panel h1{text-transform:uppercase;font-size:clamp(2.5rem,6vw,5rem)}.status-row{color:#f0dcd4;font:.85rem Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.status-dot{background:#f2c7b5;border-radius:50%;width:.55rem;height:.55rem;margin-right:.5rem;display:inline-block}.status-dot.complete{background:#f7f1e5}.winner-banner{color:#4a1822;background:#f2c7b5;padding:1rem;font-weight:700}.board-wrap{position:relative}.winner-overlay{z-index:2;color:#f7f1e5;text-align:center;text-transform:uppercase;pointer-events:none;background:#4a1822e0;border-block:2px solid #f2c7b5;width:100%;margin:0;position:absolute;top:42%;left:0}.mode-info{border-top:1px solid #f2c7b559;border-bottom:1px solid #f2c7b559;margin:1.5rem 0;padding:1rem 0}.mode-info h2{margin:.2rem 0}.mode-info p{color:#e7c7c0;margin:0 0 .6rem}.mode-guide{aspect-ratio:1;grid-template-columns:repeat(5,1fr);gap:2px;width:min(130px,100%);margin-inline:auto;display:grid}.guide-cell{color:#4a1822;background:#f8ece3;place-items:center;min-width:0;min-height:0;font-size:.38rem;font-weight:700;line-height:1;display:grid;overflow:hidden}.guide-cell-active{color:#f7f1e5;background:#8f3f36;box-shadow:inset 0 0 0 1px #f2c7b5}.guide-cell-free{font-size:.3rem}.ball-call-row{align-items:center;gap:1rem;margin:2rem 0 1rem;display:flex}.ball-call{color:#f0dcd4;text-transform:uppercase;align-items:center;gap:1rem;margin:0;font:.8rem Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;display:flex}.ball-call strong{aspect-ratio:1;color:#080808;background:radial-gradient(circle at 30% 22%,#fff 0,#f4f4f4 72%,#c9c9c9 100%);border:2px solid #111;border-radius:50%;justify-content:center;align-items:center;gap:.15rem;width:5.5rem;font:700 1.35rem Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;display:flex;position:relative;overflow:hidden}.ball-letter{color:#ff1f1f}.ball-number{color:#080808}.recent-calls{flex:0 0 11.2rem;justify-content:flex-start;align-items:center;gap:.35rem;width:11.2rem;margin:0;padding:0;list-style:none;display:flex}.recent-ball{aspect-ratio:1;color:#080808;letter-spacing:0;background:radial-gradient(circle at 30% 22%,#fff 0,#f4f4f4 72%,#c9c9c9 100%);border:1px solid #111;border-radius:50%;justify-content:center;align-items:center;gap:.08rem;width:3.1rem;font:700 .72rem Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;display:flex;position:relative;overflow:hidden}.recent-ball-newest{width:4rem;font-size:.9rem}.recent-ball-middle{width:3.5rem;font-size:.8rem}.recent-ball-oldest{width:3rem;font-size:.72rem}.recent-ball-letter{color:#ff1f1f}.bingo-card{grid-template-columns:repeat(5,1fr);gap:.35rem;max-width:620px;margin:1.5rem 0;display:grid}.card-heading{color:#f2c7b5;text-align:center;padding:.6rem;font:700 1.1rem Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.card-cell{aspect-ratio:1;color:#f7f1e5;background:#67252f;border:1px solid #c27a7e;font-size:clamp(1rem,3vw,1.6rem)}.card-cell.marked{color:#4a1822;background:#f2c7b5;border-color:#f7f1e5}.card-cell:disabled{cursor:default}.claim-warning-overlay{z-index:3;text-align:center;cursor:pointer;background:#4a1822f0;place-content:center;gap:1rem;padding:1.5rem;display:grid;position:absolute;inset:0}.claim-warning-overlay .error{margin:0 auto}.claim-warning-overlay .mode-guide{width:min(150px,60%)}.target-pattern-title{color:#f2c7b5;text-align:center;text-transform:uppercase;letter-spacing:.08em;margin:.75rem 0 .25rem;font:700 1rem Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.claim-button{margin-top:.5rem}.side-panel{align-content:start;gap:2rem;display:grid}.host-controls{gap:1rem;display:grid}.new-game-controls{flex-wrap:wrap;align-items:end;gap:.8rem;display:flex}.new-game-controls label{width:min(275px,100%)}.new-game-controls select{width:100%}.new-game-controls .primary-button{align-self:end;width:100%}.players{color:#f0dcd4;gap:.4rem;font:.85rem ui-sans-serif,system-ui,sans-serif;display:grid}.players ul{text-align:left;margin:0;padding:0;list-style-position:inside}.winner-dragon{vertical-align:middle;object-fit:contain;width:1.35rem;height:1.35rem;margin-left:.4rem}.players strong{color:#f2c7b5;font-size:2rem}.name-form{gap:.45rem;margin-top:.8rem;display:grid}.name-form label{color:#f0dcd4;text-transform:uppercase;letter-spacing:.08em;font:.72rem Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.name-form div{gap:.45rem;display:grid}.name-form input{width:100%;min-width:0;padding:.6rem}.name-form .secondary-button{white-space:nowrap;width:100%;padding:.6rem .7rem}.qr-code{background:#fff;justify-self:center;width:180px;padding:.5rem}.share-link{color:#f0dcd4;text-transform:uppercase;letter-spacing:.08em;gap:.35rem;font:.72rem Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;display:grid}.share-link input{color:#4a1822;letter-spacing:0;background:#f0dcd4;width:100%;min-width:0;padding:.6rem;font:.75rem ui-sans-serif,system-ui,sans-serif}.room-code{color:#f2c7b5;text-align:center}.room-code-distinct{font-variant-numeric:tabular-nums;letter-spacing:.18em;font:700 1.1rem/1 Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.called-panel{border-top:1px solid #8b3f46;padding-top:1rem}.called-balls-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:.35rem;max-width:430px;margin-top:.8rem;display:grid}.called-column{align-content:start;gap:.25rem;min-width:0;display:grid}.called-column strong,.called-column span{color:#4a1822;background:#f0dcd4;place-items:center;min-height:1.8rem;font:.72rem Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;display:grid}.called-column strong{color:#f2c7b5;background:0 0;font-weight:700}.draw-action{margin-top:1.25rem}@media (width<=1100px){.room-layout{grid-template-columns:1fr;padding:2rem 1rem}.side-panel{grid-row:1}.game-panel{grid-row:2}}
