.bingo-shell{max-width:1400px}.bingo-header-label{color:var(--green);align-items:center;gap:8px;font-size:18px;font-weight:800;display:flex}.bingo-back{min-height:44px;color:var(--muted);align-items:center;gap:7px;font-size:14px;display:inline-flex}.bingo-back:hover{color:var(--blue)}.bingo-home{flex:1}.bingo-intro{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:10%;padding:50px 0 40px;display:grid}.bingo-welcome{max-width:440px}.bingo-welcome h1{letter-spacing:-1px;margin:18px 0 19px;font-size:56px;font-weight:900;line-height:1.28}.bingo-welcome h1>span{color:var(--green)}.bingo-welcome .eyebrow{color:var(--ink)}.bingo-welcome .eyebrow svg{color:var(--green)}.bingo-welcome .intro{margin-bottom:27px}.bingo-welcome .entry-form{max-width:100%}.bingo-example{margin:0;padding:15px 6px}.bingo-example figcaption{align-items:center;gap:8px;margin:0 12px 20px;font-size:13px;display:flex}.bingo-example figcaption>span{color:var(--muted);margin-inline-start:auto;font-size:12px}.bingo-example-paper{background:var(--sheet);border:1px solid var(--ink);box-shadow:-5px 6px 0 var(--line);border-radius:5px 12px 7px 5px;padding:22px 28px 26px;transform:rotate(-3deg)}.bingo-example-caption{margin-bottom:17px;font-size:21px;font-weight:800}.bingo-example .demo-grid{border-color:var(--ink);background:0 0}.bingo-example .bingo-cell{border-color:var(--pen-line);background:0 0;min-height:0;font-size:26px}.bingo-example .bingo-cell.complete{background:color-mix(in oklch,var(--mint) 70%,transparent)}.bingo-example .bingo-progress{border:0;padding:21px 0 0}.bingo-example .bingo-letters>span{background:0 0}.bingo-example .bingo-letters>span.earned{background:var(--green)}.bingo-example>p{justify-content:center;align-items:center;gap:9px;margin-top:25px;font-size:17px;font-weight:700;display:flex}.bingo-example>p .brand-stroke{width:55px;color:var(--coral)}.bingo-steps{border-block:1px solid var(--line);grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:24px 0 0;padding:25px 0;list-style:none;display:grid}.bingo-steps li{align-items:flex-start;gap:12px;display:flex}.bingo-steps b{color:var(--blue);font-size:25px;line-height:1.2}.bingo-steps strong{font-size:16px}.bingo-steps p{color:var(--muted);margin-top:7px;font-size:13px;line-height:1.7}.bingo-rules{max-width:68ch;margin-top:26px;font-size:14px;line-height:1.85}.bingo-rules summary{cursor:pointer;color:var(--blue);min-height:44px;padding:10px 0;font-weight:700}.bingo-rules summary:focus-visible{outline:3px solid var(--blue);outline-offset:3px}.bingo-rules ol{color:var(--muted);margin:10px 0;padding-inline-start:23px}.bingo-rules li{margin-block:7px;padding-inline-start:5px}.bingo-rules>p{color:var(--muted);padding:5px 0 15px}.bingo-loading{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:18px;padding:65px 0;display:flex}.bingo-loading>svg{color:var(--green)}.bingo-loading h1{font-size:30px}.bingo-loading p{color:var(--muted);line-height:1.8}.bingo-room{flex:1;padding-top:23px;padding-bottom:24px}.bingo-room-top{justify-content:space-between;align-items:center;gap:16px;margin-bottom:25px;display:flex}.bingo-room-id,.bingo-room-actions{align-items:center;gap:10px;display:flex}.bingo-room-id>strong{font-size:14px}.bingo-room-actions .button{min-height:40px;padding:9px 12px;font-size:13px}.bingo-room-id .room-code{letter-spacing:2px;margin:0}.bingo-connection-note{border:1px solid var(--coral);background:var(--surface);border-radius:8px;margin-bottom:16px;padding:13px 16px;font-size:14px;line-height:1.8}.bingo-lobby-heading{justify-content:space-between;align-items:center;gap:24px;margin:15px 0 28px;display:flex}.bingo-lobby-heading h1{margin-top:9px;font-size:33px;line-height:1.4}.bingo-lobby-heading p{color:var(--muted);margin-top:6px;font-size:15px;line-height:1.8}.bingo-lobby-heading>.button{flex-shrink:0}.bingo-play-layout{grid-template-columns:minmax(max(300px,calc(var(--bingo-size,5)*44px + 40px)),min(440px,calc(100dvh - 330px))) minmax(280px,1fr);align-items:start;gap:7%;max-width:900px;margin-inline:auto;display:grid}.bingo-board-section{min-width:0}.bingo-board-heading,.bingo-section-heading{justify-content:space-between;align-items:center;gap:10px;min-height:38px;margin-bottom:15px;display:flex}.bingo-board-heading h2,.bingo-section-heading h2{font-size:19px;font-weight:800}.bingo-board-format{color:var(--muted);margin-top:5px;font-size:12px;font-weight:500;line-height:1.4;display:block}.bingo-section-heading small{color:var(--muted);margin-inline-start:5px;font-size:13px;font-weight:500}.bingo-board-heading>span{color:var(--muted);font-size:13px}.bingo-shuffle{min-height:44px;color:var(--blue);background:0 0;border:0;align-items:center;gap:7px;padding:7px 0;font-size:14px;display:inline-flex}.bingo-shuffle:hover:not(:disabled){text-underline-offset:4px;text-decoration:underline}.bingo-board-paper{background:var(--surface);border:1.5px solid var(--pen-line);box-shadow:-3px 4px 0 var(--line);border-radius:10px;padding:18px}.bingo-grid{grid-template-columns:repeat(var(--bingo-size,5),minmax(0,1fr));border:1px solid var(--pen-line);background:var(--surface);border-radius:3px;display:grid;overflow:hidden}.bingo-cell{aspect-ratio:1;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);width:100%;min-width:0;min-height:44px;color:var(--ink);font-variant-numeric:tabular-nums;background:0 0;border-radius:0;place-items:center;padding:0;font-family:Tajawal,sans-serif;font-size:29px;font-weight:700;line-height:1;display:grid;position:relative}.bingo-grid[data-size="5"]>.bingo-cell:nth-child(5n),.bingo-grid[data-size="6"]>.bingo-cell:nth-child(6n),.bingo-grid[data-size="7"]>.bingo-cell:nth-child(7n){border-right:0}.bingo-grid[data-size="5"]>.bingo-cell:nth-child(n+21),.bingo-grid[data-size="6"]>.bingo-cell:nth-child(n+31),.bingo-grid[data-size="7"]>.bingo-cell:nth-child(n+43){border-bottom:0}.bingo-grid[data-size="7"]>.bingo-cell{font-size:24px}.bingo-cell:disabled{opacity:1;cursor:default}.bingo-cell>span{padding-top:6px}.bingo-cell>svg{width:calc(100% - 12px);height:calc(100% - 12px);color:var(--blue);opacity:.42;pointer-events:none;position:absolute;inset:6px}.bingo-cell.marked{background:var(--blue-tint);color:color-mix(in oklch,var(--ink) 75%,var(--surface))}.bingo-cell.complete{background:var(--mint)}.bingo-cell.complete>svg{color:var(--green)}.bingo-cell.latest{box-shadow:inset 0 0 0 3px var(--coral)}.bingo-cell:focus-visible{outline:3px solid var(--blue);outline-offset:-4px;z-index:1}.can-pick .bingo-cell:not(:disabled){color:var(--blue);cursor:pointer}@media (hover:hover){.can-pick .bingo-cell:not(:disabled):hover{background:var(--yellow)}}.bingo-progress{justify-content:space-between;align-items:center;gap:14px;padding-top:17px;display:flex}.bingo-letters{gap:7px;display:flex}.bingo-letters>span{background:var(--paper);border:1px solid var(--line);width:35px;height:38px;color:var(--muted);border-radius:5px;place-items:center;font-family:Arial,sans-serif;font-size:22px;font-weight:700;transition:background .18s,color .18s;display:grid;position:relative}.bingo-letters>span.earned{background:var(--green);border-color:var(--green);color:var(--surface)}.bingo-letters>span>svg{background:var(--surface);color:var(--green);border-radius:50%;position:absolute;bottom:-5px;right:-4px}.bingo-progress>span{color:var(--muted);white-space:nowrap;font-size:14px}.bingo-progress>span>strong{color:var(--green);font-size:21px}.bingo-board-hint{color:var(--muted);margin-top:15px;font-size:13px;line-height:1.8}.bingo-player-list{border-top:1px solid var(--line);margin:0;padding:0;list-style:none}.bingo-player-list>li{border-bottom:1px solid var(--line);padding:13px 5px}.bingo-player-row{align-items:center;gap:10px;display:flex}.bingo-player-name{flex-direction:column;flex:1;gap:5px;min-width:0;display:flex}.bingo-player-name>strong{overflow-wrap:anywhere;font-size:16px}.bingo-player-name small{color:var(--muted);font-size:12px;font-weight:400}.bingo-player-name>span{color:var(--muted);font-size:12px}.bingo-player-list .current-player{background:var(--blue-tint)}.bingo-player-list .current-player .bingo-player-name>span{color:var(--blue);font-weight:700}.bingo-ready-check{color:var(--green)}.bingo-mini-progress{direction:ltr;gap:3px;display:flex}.bingo-mini-progress i{border:1px solid var(--line);border-radius:3px;width:7px;height:18px}.bingo-mini-progress .earned{border-color:var(--green);background:var(--green)}.bingo-remove{width:32px;min-width:32px;color:var(--muted);padding:6px}.bingo-empty-seat{color:var(--muted);padding:22px 4px;font-size:14px;line-height:1.8}.bingo-ready-actions{flex-direction:column;gap:13px;margin-top:23px;display:flex}.bingo-ready-actions>p{color:var(--muted);text-align:center;font-size:13px;line-height:1.8}.bingo-turn{border-block:1px solid var(--line);background:var(--surface);justify-content:space-between;align-items:center;gap:20px;max-width:990px;margin:0 auto 23px;padding:16px 20px;display:flex}.bingo-turn.your-turn{background:var(--yellow);border-color:color-mix(in oklch,var(--yellow),var(--ink) 25%)}.bingo-turn h1{overflow-wrap:anywhere;margin-top:4px;font-size:27px;line-height:1.4}.bingo-turn>div>span{font-size:13px}.bingo-timer{font-variant-numeric:tabular-nums;flex-shrink:0;align-items:center;gap:7px;display:flex}.bingo-timer strong{text-align:center;min-width:36px;font-size:30px}.bingo-timer>span{color:var(--muted);font-size:12px}.bingo-call-strip{border-block:1px solid var(--line);align-items:center;gap:12px;margin-top:15px;padding:15px 0;display:flex}.bingo-call-strip>span{color:var(--muted);font-size:12px}.bingo-last-number{color:var(--blue);text-align:center;min-width:35px;padding-top:5px;font-size:32px;line-height:1}.bingo-call-strip>div:not(.bingo-recent){flex-direction:column;gap:5px;min-width:0;display:flex}.bingo-call-strip>div>strong{overflow-wrap:anywhere;font-size:14px}.bingo-call-strip>div>span{color:var(--muted);font-size:12px}.bingo-recent{direction:rtl;flex-wrap:wrap;gap:6px;max-width:110px;margin-inline-start:auto;display:flex}.bingo-recent>span{text-align:center;min-width:20px;font-size:13px}.bingo-time-note{color:var(--muted);margin-top:9px;font-size:12px;line-height:1.8}.bingo-room>.bingo-rules{max-width:990px;margin-inline:auto}.bingo-inline-confirm{border:1px solid var(--line);background:var(--surface);border-radius:7px;flex-wrap:wrap;gap:8px;margin-top:12px;padding:12px;display:flex}.bingo-inline-confirm p{flex-basis:100%;font-size:14px;line-height:1.8}.bingo-inline-confirm .button{min-height:40px;padding:9px 14px;font-size:13px}.bingo-leave-confirm{margin:-7px 0 20px}.bingo-results{text-align:center;max-width:680px;margin:22px auto 40px}.bingo-trophy{color:var(--green);margin-bottom:15px}.bingo-results>.eyebrow{justify-content:center}.bingo-results h1{overflow-wrap:anywhere;outline:0;margin:12px 0;font-size:36px;line-height:1.4}.bingo-results>p{color:var(--muted);font-size:16px;line-height:1.8}.bingo-winners{flex-wrap:wrap;justify-content:center;gap:22px;margin-top:27px;display:flex}.bingo-winners>div{overflow-wrap:anywhere;flex-direction:column;align-items:center;gap:10px;max-width:150px;display:flex}.bingo-result-table{border:1px solid var(--line);border-radius:8px;margin:28px 0 24px;overflow:hidden}.bingo-result-table table{border-collapse:collapse;text-align:start;background:var(--surface);width:100%}.bingo-result-table th,.bingo-result-table td{text-align:start;padding:14px 18px}.bingo-result-table thead{color:var(--muted);background:var(--paper);font-size:13px}.bingo-result-table tbody tr{border-top:1px solid var(--line)}.bingo-result-table tbody th{overflow-wrap:anywhere;align-items:center;gap:10px;font-size:16px;display:flex}.bingo-result-table tbody th>span{min-width:0}.bingo-result-table tbody td{color:var(--blue);font-size:20px;font-weight:700}.bingo-result-table .winner{background:color-mix(in oklch,var(--yellow) 35%,var(--surface))}.bingo-result-table small{font-size:12px;font-weight:400}.bingo-result-table svg{flex-shrink:0}.bingo-results .bingo-result-note{margin-top:16px;font-size:13px}.bingo-results .bingo-rules{text-align:start;margin-inline:auto}@media (max-width:1000px){.bingo-intro{gap:7%}.bingo-welcome h1{font-size:46px}.bingo-example-paper{padding:20px}.bingo-example .bingo-progress{flex-wrap:wrap;gap:13px}.bingo-play-layout{grid-template-columns:minmax(calc(var(--bingo-size,5)*44px + 40px),min(410px,calc(100dvh - 330px))) minmax(230px,.7fr);gap:5%}}@media (max-width:760px){.bingo-shell{padding-inline:20px}.bingo-shell .site-header{gap:10px;height:78px}.bingo-header-label{font-size:15px}.bingo-header-label>svg{display:none}.bingo-back{gap:4px;font-size:12px}.bingo-intro{grid-template-columns:1fr;gap:32px;padding:30px 0}.bingo-welcome{width:100%;max-width:440px;margin-inline:auto}.bingo-welcome h1{text-align:center;margin-top:16px;font-size:46px}.bingo-welcome .eyebrow{justify-content:center;font-size:13px}.bingo-welcome .intro{text-align:center;margin-inline:auto}.bingo-example{width:100%;max-width:380px;margin:auto;padding-inline:14px}.bingo-example figcaption{margin-inline:0}.bingo-example figcaption>span{font-size:10px}.bingo-example-paper{padding:20px}.bingo-example .bingo-cell{font-size:25px}.bingo-example .bingo-letters>span{width:32px;height:34px;font-size:20px}.bingo-example .bingo-letters{gap:5px}.bingo-example .bingo-progress{gap:8px}.bingo-steps{grid-template-columns:1fr;gap:24px;margin-top:8px}.bingo-steps li{gap:16px}.bingo-rules{margin-top:18px}.bingo-room{padding-top:16px}.bingo-room-top{flex-wrap:wrap;row-gap:12px;margin-bottom:20px}.bingo-room-id{gap:6px}.bingo-room-id>strong{font-size:12px}.bingo-room-id .room-code{letter-spacing:1px}.bingo-room-actions{gap:7px;margin-inline-start:auto}.bingo-room-actions .button{font-size:12px}.bingo-lobby-heading{margin-bottom:22px;display:block}.bingo-lobby-heading h1{font-size:27px}.bingo-lobby-heading p{font-size:14px}.bingo-lobby-heading>.button{width:100%;margin-top:15px}.bingo-play-layout{grid-template-columns:1fr;gap:28px;max-width:500px}.bingo-board-paper{padding:13px}.bingo-board-paper[data-size="7"]{padding:8px}.bingo-board-heading{margin-bottom:10px}.bingo-board-heading h2,.bingo-section-heading h2{font-size:18px}.bingo-cell{font-size:28px}.bingo-letters>span{width:33px;height:36px;font-size:21px}.bingo-letters{gap:6px}.bingo-progress{gap:8px;padding-top:14px}.bingo-progress>span{font-size:12px}.bingo-board-hint{margin-top:13px;font-size:12px}.bingo-turn{gap:10px;margin-bottom:19px;padding:12px}.bingo-turn h1{font-size:23px}.bingo-turn>div>span{font-size:11px}.bingo-timer{gap:4px}.bingo-timer strong{min-width:31px;font-size:26px}.bingo-timer>span{display:none}.bingo-player-list .avatar{width:38px;height:38px;font-size:24px}.bingo-mini-progress i{width:9px}.bingo-ready-actions{margin-top:20px}.bingo-room>.bingo-rules{margin-top:26px}.bingo-results h1{font-size:29px}.bingo-results>p{font-size:14px}.bingo-result-table td,.bingo-result-table th{padding:12px 9px}.bingo-result-table tbody th{gap:7px;font-size:14px}.bingo-results>.button{width:100%}.bingo-shell .site-footer>span:last-child{display:flex}}@media (max-width:380px){.bingo-board-paper[data-size="6"]{padding:7px}.bingo-board-paper[data-size="7"]{border-width:1px;margin-inline:-13px;padding:0}.bingo-board-paper[data-size="7"]>.bingo-progress{padding:14px 10px 10px}}@media (max-width:359px){.bingo-shell{padding-inline:14px}.bingo-header-label{display:none}.bingo-cell{font-size:25px}.bingo-letters{gap:4px}.bingo-letters>span{width:29px;height:33px;font-size:20px}.bingo-progress>span{font-size:11px}.bingo-recent{gap:3px;max-width:45px}.bingo-welcome h1{font-size:41px}}
