:root{--burgundy:#7b1530;--red:#b42342;--cream:#fff7df;--gold:#e8b449;--blue:#1f5d86;--ink:#252127;--green:#237a57}*{box-sizing:border-box}html{min-width:320px}body{margin:0;color:var(--ink);font-family:"Segoe UI",system-ui,sans-serif;background:#e8dcc2;background-image:linear-gradient(rgba(255,255,255,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.5) 1px,transparent 1px);background-size:34px 34px}.topbar{position:relative;z-index:20;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;padding:12px clamp(12px,3vw,35px);color:white;background:linear-gradient(90deg,#591022,var(--burgundy),#591022);border-bottom:4px solid var(--gold);box-shadow:0 5px 16px #49200d55}.back,.top-actions button{border:1px solid #f7d89666;border-radius:999px;padding:9px 13px;color:white;background:#350b1877;text-decoration:none;font-weight:800;cursor:pointer}.brand{text-align:center}.brand small,.brand strong{display:block}.brand small{font-size:.65rem;letter-spacing:.25em;color:#f7d896}.brand strong{letter-spacing:.08em}.top-actions{display:flex;justify-content:flex-end;gap:7px}.top-actions button{font:inherit;font-size:.77rem}main{min-height:calc(100vh - 65px)}.hall{position:relative;overflow:hidden;min-height:100%;padding-bottom:50px}.ceiling-lights{height:56px;display:flex;justify-content:space-around;background:linear-gradient(#5e5a55,#282723);border-bottom:8px solid #8a6e49;box-shadow:0 8px 20px #0005}.ceiling-lights i{width:90px;height:20px;margin-top:15px;border-radius:50%;background:#fff3ba;box-shadow:0 0 24px 10px #fff2b877}.stage{position:relative;min-height:500px;padding:42px clamp(20px,7vw,110px) 28px;color:white;background:radial-gradient(ellipse at 50% 35%,#fff7d455 0 17%,transparent 49%),linear-gradient(#295c75,#1f4358 58%,#173545);border-bottom:15px solid #5c3019;box-shadow:inset 0 -20px 45px #09182188}.stage:before{content:"";position:absolute;inset:auto 0 0;height:70px;background:repeating-linear-gradient(90deg,#704124 0 80px,#65381e 80px 82px,#8e5630 82px 160px);clip-path:polygon(0 35%,100% 0,100% 100%,0 100%)}.curtain{position:absolute;z-index:2;top:0;bottom:0;width:clamp(65px,11vw,185px);background:repeating-linear-gradient(90deg,#650d26 0 18px,#a52343 35px,#620c23 52px);box-shadow:inset -8px 0 20px #26020c88}.curtain:after{content:"";position:absolute;top:38%;left:0;right:0;height:17px;background:#e5ad41;box-shadow:0 3px 0 #774913}.curtain.left{left:0;border-radius:0 0 65% 0;clip-path:polygon(0 0,100% 0,62% 100%,0 100%)}.curtain.right{right:0;transform:scaleX(-1);border-radius:0 0 65% 0;clip-path:polygon(0 0,100% 0,62% 100%,0 100%)}.marquee{position:relative;z-index:3;width:max-content;max-width:75%;margin:0 auto 24px;padding:12px 34px;border:5px solid #d1a03e;border-radius:8px;background:#8c1733;box-shadow:0 0 0 5px #fff1bb,0 8px 20px #0008}.marquee span{font-family:Georgia,serif;font-size:clamp(1.1rem,3vw,2.1rem);font-weight:900;letter-spacing:.09em}.caller-desk{position:relative;z-index:4;display:flex;align-items:center;gap:22px;width:min(480px,74%);margin:0 auto -45px;padding:16px 22px 48px;border-radius:18px 18px 6px 6px;background:linear-gradient(#f9e6ae,#d2a24a);border:5px solid #8b591e;color:#441420;box-shadow:0 13px 28px #07151e88}.caller{position:relative;flex:0 0 92px;height:116px}.caller .head{position:absolute;z-index:2;top:8px;left:20px;width:58px;height:70px;border-radius:47% 47% 44% 44%;background:#edb884;border:3px solid #7c3e2a}.caller .hair{position:absolute;z-index:3;top:0;left:14px;width:70px;height:40px;border-radius:50% 50% 25% 25%;background:#503426;box-shadow:inset 0 -7px #321d17}.caller .head i{position:absolute;top:27px;width:6px;height:6px;border-radius:50%;background:#35251d}.caller .head i:first-child{left:14px}.caller .head i:nth-child(2){right:14px}.caller .head b{position:absolute;left:22px;bottom:13px;width:14px;height:7px;border-bottom:3px solid #aa4050;border-radius:50%}.caller .body{position:absolute;bottom:0;left:3px;width:88px;height:57px;border-radius:46% 46% 8px 8px;background:linear-gradient(100deg,#255478,#4f8bb0,#204d70);border:3px solid #12324b}.caller .mic{position:absolute;z-index:4;right:0;bottom:5px;width:7px;height:64px;background:#333;transform:rotate(12deg);transform-origin:bottom}.caller .mic:before{content:"";position:absolute;left:-6px;top:-8px;width:18px;height:18px;border-radius:50%;background:#222}.caller-copy p{margin:0;color:#8b1732;font-size:.65rem;font-weight:900;letter-spacing:.16em}.caller-copy h1{margin:3px 0;font-family:Georgia,serif;font-size:clamp(1.25rem,3vw,2rem)}.caller-copy span{display:block;font-size:.85rem;color:#6d4a33}.machine-zone{position:relative;z-index:6;display:flex;align-items:flex-end;justify-content:center;gap:clamp(25px,8vw,100px);margin-top:66px}.bingo-machine{position:relative;width:255px;height:210px}.cage{position:absolute;left:26px;top:0;width:176px;height:150px;border:8px solid #9aa1a2;border-radius:50%;background:radial-gradient(circle,#fff8 0 3%,transparent 4%),radial-gradient(circle at 30% 32%,#cc304b 0 5%,#8b1630 6% 8%,transparent 9%),radial-gradient(circle at 66% 35%,#f2cf4c 0 5%,#a87508 6% 8%,transparent 9%),radial-gradient(circle at 45% 68%,#2f7ca7 0 5%,#174a6a 6% 8%,transparent 9%),#f2f1e944;box-shadow:inset 0 0 25px #fff9,0 8px 14px #0007}.cage:before,.cage:after{content:"";position:absolute;inset:6px 70px;border:3px solid #6d7475;border-radius:50%}.cage:after{inset:60px 5px;transform:rotate(5deg)}.cage-ring{position:absolute;inset:16px;border:3px solid #73797a;border-radius:50%}.r1{transform:rotate(60deg) scaleX(.42)}.r2{transform:rotate(-60deg) scaleX(.42)}.r3{transform:scaleX(.35)}.cage-balls{position:absolute;inset:22px;border-radius:50%;background-image:radial-gradient(circle at 25% 65%,#fff 0 3px,#bd2846 4px 11px,transparent 12px),radial-gradient(circle at 65% 70%,#fff 0 3px,#e1b329 4px 11px,transparent 12px),radial-gradient(circle at 53% 22%,#fff 0 3px,#2876a3 4px 11px,transparent 12px),radial-gradient(circle at 78% 47%,#fff 0 3px,#3b956e 4px 11px,transparent 12px),radial-gradient(circle at 38% 44%,#fff 0 3px,#e6a040 4px 11px,transparent 12px)}.bingo-machine.running .cage{animation:spinCage .9s linear infinite}.bingo-machine.drawing .cage{animation:spinCage .16s linear infinite}.axle{position:absolute;left:2px;right:31px;top:70px;height:16px;border-radius:8px;background:linear-gradient(#dce2e2,#666,#dce2e2);box-shadow:0 4px 5px #0007}.machine-stand{position:absolute;left:75px;bottom:0;width:86px;height:82px;background:linear-gradient(90deg,#707879,#dfe3df 34%,#747b7c 70%,#bfc5c2);clip-path:polygon(27% 0,73% 0,100% 100%,0 100%);border-bottom:12px solid #4e5454}.machine-stand i{position:absolute;left:32px;top:28px;width:23px;height:23px;border-radius:50%;background:#7b1530;border:5px solid #eee;box-shadow:0 0 0 3px #555}.chute{position:absolute;right:0;top:90px;width:85px;height:31px;border:6px solid #8a9292;border-left:0;border-radius:0 16px 16px 0;background:#d6dbd7}.chute span{position:absolute;right:7px;bottom:-33px;width:26px;height:31px;border:5px solid #858c8c;border-top:0}.current-ball-wrap{text-align:center}.current-ball-wrap small{display:block;font-size:.65rem;font-weight:900;letter-spacing:.15em;color:#f9dda0}.current-ball-wrap b{display:block;margin-top:7px;color:#ffe8aa}.current-ball{display:grid;place-items:center;width:118px;height:118px;margin:6px auto;border:7px solid white;border-radius:50%;background:radial-gradient(circle at 35% 25%,white,#f3c349 45%,#b76d00 100%);box-shadow:0 9px 20px #0008,0 0 0 5px #8b5d1d}.current-ball span{font:900 2.3rem Georgia,serif;color:#6b1429}.current-ball.pop{animation:ballPop .55s cubic-bezier(.15,.8,.3,1.4)}.setup-card{position:relative;z-index:10;display:grid;grid-template-columns:1fr auto 1fr minmax(240px,auto);align-items:center;gap:18px;width:min(1180px,calc(100% - 28px));margin:-6px auto 24px;padding:18px 22px;border:2px solid #cfad6f;border-radius:15px;background:#fff8e5;box-shadow:0 12px 28px #56391733}.step{display:flex;align-items:center;gap:11px}.step>span{display:grid;place-items:center;flex:0 0 36px;height:36px;border-radius:50%;color:white;background:var(--burgundy);font-weight:900}.step strong,.step small{display:block}.step small{margin-top:3px;color:#796b59;font-size:.73rem}.paper-button,.start-button,.controls button,.card-options button{border:0;border-radius:8px;padding:13px 16px;font-weight:900;cursor:pointer}.paper-button{color:#633816;background:#f1cd7e;border:2px solid #b98533}.start-row{display:flex;align-items:end;gap:9px}.start-row label,.card-options label{display:grid;gap:4px;font-size:.68rem;font-weight:900;letter-spacing:.08em}.start-row select,.card-options select{min-height:43px;padding:0 10px;border:1px solid #bca477;border-radius:7px;background:white;font:inherit}.start-button{min-height:47px;color:white;background:linear-gradient(#2f956b,#1e684b);box-shadow:0 4px 0 #12412f}.game-console{display:grid;grid-template-columns:minmax(0,1fr) 265px;gap:20px;width:min(1180px,calc(100% - 28px));margin:auto}.number-board-wrap,.controls{border:2px solid #b8a581;border-radius:15px;background:#fffdf4;box-shadow:0 10px 28px #533b1e22}.number-board-wrap{padding:18px}.board-heading{display:flex;justify-content:space-between;align-items:end;gap:15px;margin-bottom:13px}.board-heading small,.control-label{color:var(--burgundy);font-size:.63rem;font-weight:900;letter-spacing:.16em}.board-heading h2{margin:2px 0 0;font-family:Georgia,serif}.last-balls{display:flex;min-height:42px;gap:5px}.last-balls span{display:grid;place-items:center;width:42px;height:42px;border:3px solid white;border-radius:50%;color:white;background:var(--blue);box-shadow:0 2px 0 #163f5b;font-weight:900}.number-board{display:grid;grid-template-columns:55px repeat(15,minmax(32px,1fr));overflow:hidden;border:2px solid #423a35;border-radius:8px}.board-letter,.board-number{display:grid;place-items:center;min-height:43px;border:1px solid #d1c7b6}.board-letter{color:white;font:900 1.35rem Georgia,serif}.board-letter.b{background:#1f5d86}.board-letter.i{background:#ae2944}.board-letter.n{background:#d09822}.board-letter.g{background:#287657}.board-letter.o{background:#744483}.board-number{position:relative;background:#fffef8;font-weight:800}.board-number.called{color:white;background:var(--burgundy);animation:markNumber .45s}.board-number.called:after{content:"";position:absolute;inset:4px;border:2px solid #fff9;border-radius:50%}.controls{padding:18px}.controls button{display:block;width:100%;margin-top:10px;color:white;background:#305e78}.controls button:disabled{opacity:.4;cursor:not-allowed}.controls .bingo-button{padding:20px 12px;font:900 1.6rem Georgia,serif;background:linear-gradient(#c42f4f,#7a142d);box-shadow:0 5px 0 #4b0b1c}.controls .quiet{color:#574d42;background:#e6dcc9}.rules{margin-top:18px;padding:14px;border-left:5px solid var(--gold);background:#f1e8d8}.rules b{font-size:.7rem;color:var(--burgundy)}.rules p{margin:5px 0 0;font-size:.8rem;line-height:1.45;color:#6e6356}.cards-dialog{width:min(1050px,calc(100% - 24px));max-height:92dvh;padding:0;border:0;border-radius:16px;background:#eee8da;box-shadow:0 28px 100px #0008}.cards-dialog::backdrop{background:#1a0d10dd;backdrop-filter:blur(5px)}.cards-toolbar{position:sticky;z-index:3;top:0;display:flex;justify-content:space-between;align-items:center;padding:17px 22px;color:white;background:var(--burgundy)}.cards-toolbar small{font-size:.6rem;letter-spacing:.16em;color:#f8d884}.cards-toolbar h2{margin:2px 0;font-family:Georgia,serif}.close-dialog{border:0;color:white;background:transparent;font-size:2rem;cursor:pointer}.card-options{display:flex;align-items:end;gap:10px;padding:16px 22px;background:#fff9e9;border-bottom:1px solid #cab995}.card-options button{color:white;background:#52687a}.card-options .print-button{background:var(--green)}.print-tip{margin:12px 22px;color:#685f54;font-size:.78rem}.print-area{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:10px 22px 25px}.bingo-card{break-inside:avoid;padding:13px;border:4px solid #2d2a2b;background:white;box-shadow:0 5px 14px #0002}.bingo-card-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:8px}.bingo-card-head strong{font:900 clamp(1.7rem,5vw,3rem) Georgia,serif;letter-spacing:.21em;color:var(--burgundy)}.bingo-card-head small{font-size:.56rem;color:#555}.card-grid{display:grid;grid-template-columns:repeat(5,1fr);border:2px solid #222}.card-grid>*{display:grid;place-items:center;aspect-ratio:1;border:1px solid #333}.card-grid b{color:white;font:900 1.35rem Georgia,serif}.card-grid b:nth-child(1){background:#1f5d86}.card-grid b:nth-child(2){background:#ae2944}.card-grid b:nth-child(3){background:#d09822}.card-grid b:nth-child(4){background:#287657}.card-grid b:nth-child(5){background:#744483}.card-grid span{font:800 clamp(.85rem,2.5vw,1.3rem) Georgia,serif}.card-grid .free{padding:2px;color:#7b1530;background:#f5db8f;font-size:.58rem;text-align:center}.celebration{pointer-events:none;position:fixed;z-index:90;inset:0;overflow:hidden}.celebration i{position:absolute;top:-30px;width:12px;height:25px;background:var(--confetti);animation:confettiFall 2.4s linear forwards}@keyframes spinCage{to{transform:rotate(360deg)}}@keyframes ballPop{0%{transform:scale(.25) translateY(-50px);opacity:0}100%{transform:scale(1);opacity:1}}@keyframes markNumber{0%{transform:scale(1.5);z-index:2}100%{transform:scale(1)}}@keyframes confettiFall{to{transform:translate(var(--drift),110vh) rotate(720deg)}}@media(max-width:980px){.setup-card{grid-template-columns:1fr 1fr}.paper-button{order:3}.start-row{order:4}.game-console{grid-template-columns:1fr}.controls{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.controls button{margin:0}.control-label,.rules{grid-column:1/-1}.number-board{grid-template-columns:42px repeat(15,minmax(31px,1fr));overflow-x:auto}.board-number{min-width:31px}.stage{min-height:470px}.print-area{grid-template-columns:1fr 1fr}}@media(max-width:680px){.topbar{grid-template-columns:1fr auto}.brand{display:none}.back{font-size:.72rem}.top-actions button{padding:8px;font-size:.68rem}.ceiling-lights{height:39px}.ceiling-lights i{width:45px;height:10px;margin-top:11px}.stage{min-height:440px;padding:26px 12px 20px}.curtain{width:55px}.marquee{max-width:85%;padding:9px 18px}.caller-desk{width:min(390px,82%);padding:11px 12px 43px;gap:10px}.caller{display:none}.machine-zone{gap:12px;margin-top:62px}.bingo-machine{transform:scale(.84);transform-origin:center bottom;margin-left:-24px;margin-right:-20px}.current-ball{width:91px;height:91px}.current-ball span{font-size:1.75rem}.setup-card{grid-template-columns:1fr;margin-top:0}.paper-button,.start-row{order:initial}.start-row{display:grid;grid-template-columns:auto 1fr}.game-console{width:calc(100% - 18px)}.board-heading{align-items:flex-start;flex-direction:column}.last-balls span{width:36px;height:36px}.number-board{grid-template-columns:35px repeat(15,34px);overflow-x:auto}.number-board-wrap{padding:12px}.board-letter,.board-number{min-height:36px}.controls{grid-template-columns:1fr}.control-label,.rules{grid-column:auto}.card-options{flex-wrap:wrap}.print-area{grid-template-columns:1fr;padding:8px}.bingo-card-head strong{font-size:2.1rem}.print-tip{margin-inline:16px}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}@media print{body{background:white}.topbar,main,.cards-toolbar,.card-options,.print-tip{display:none!important}.cards-dialog{position:static!important;display:block!important;width:auto;max-height:none;margin:0;padding:0;border:0;box-shadow:none}.cards-dialog::backdrop{display:none}.print-area{display:grid;grid-template-columns:1fr 1fr;gap:10mm;padding:0}.bingo-card{page-break-inside:avoid;break-inside:avoid;height:132mm;padding:7mm;box-shadow:none}.bingo-card-head strong{font-size:15mm}.card-grid span{font-size:7mm}.card-grid b{font-size:8mm}.card-grid .free{font-size:3mm}@page{size:landscape;margin:8mm}}
html,body{overflow-x:hidden}
@media(max-width:680px){.topbar{display:flex;justify-content:space-between;gap:6px;padding-inline:8px}.back{flex:0 1 auto;padding:8px 10px;font-size:.68rem;white-space:nowrap}.top-actions{flex:0 0 auto;gap:4px}.top-actions button{padding:8px 7px;font-size:.64rem}.machine-zone{gap:0;transform:translateX(-8px)}.bingo-machine{flex:0 0 215px;width:215px;transform:scale(.78);margin-left:-12px;margin-right:-20px}.current-ball-wrap{flex:0 0 92px}.current-ball-wrap small{font-size:.55rem;letter-spacing:.08em;white-space:nowrap}.current-ball{width:84px;height:84px}.current-ball span{font-size:1.55rem}}
@media(max-width:680px){.topbar,.hall,.stage{width:100vw;max-width:100vw}.topbar{position:relative;padding-right:110px}.top-actions{position:absolute;right:8px;top:12px}.top-actions #soundButton{font-size:0}.top-actions #soundButton::first-letter{font-size:.75rem}.start-row{grid-template-columns:76px minmax(0,1fr)}.start-button{min-width:0;padding-inline:7px;font-size:.7rem;white-space:nowrap}}

/* Black-and-gold birthday edition */
:root{--burgundy:#16120a;--red:#b68a28;--cream:#fff9e8;--gold:#e6bd55;--blue:#a87b22;--ink:#17130c;--green:#8c681e}
body{background-color:#090806;background-image:radial-gradient(circle at 18% 8%,rgba(230,189,85,.17),transparent 30%),radial-gradient(circle at 82% 18%,rgba(255,255,255,.08),transparent 22%),linear-gradient(rgba(8,7,5,.88),rgba(22,17,8,.94)),url("assets/bingo/bonne-fete-black-gold.jpg");background-size:auto,auto,auto,720px;background-attachment:fixed}
.topbar{background:linear-gradient(100deg,#030303,#16130d 48%,#020202);border-bottom-color:#e8c668;box-shadow:0 5px 22px #000}.back,.top-actions button{border-color:#e8c66888;background:linear-gradient(#29251c,#080706);color:#ffe7a5}.brand small{color:#f4ce6c}.brand strong{color:#fff6d7}
.ceiling-lights{background:linear-gradient(#17130c,#030303);border-bottom-color:#b58b2d}.ceiling-lights i{background:#fff2b0;box-shadow:0 0 27px 11px #e8bc5988}
.stage{min-height:600px;padding-top:40px;background-image:linear-gradient(90deg,rgba(0,0,0,.48),rgba(0,0,0,.16) 32%,rgba(0,0,0,.16) 68%,rgba(0,0,0,.48)),linear-gradient(180deg,rgba(0,0,0,.14),rgba(0,0,0,.12) 58%,rgba(0,0,0,.82)),url("assets/bingo/bonne-fete-black-gold.jpg");background-size:cover;background-position:center 48%;border-bottom-color:#d0a63f;box-shadow:inset 0 -25px 60px #000,inset 0 0 75px #0008}
.stage:after{content:"";position:absolute;z-index:1;inset:0;pointer-events:none;background-image:radial-gradient(circle at 16% 27%,#fff 0 1px,transparent 2px),radial-gradient(circle at 76% 18%,#ffe69a 0 2px,transparent 3px),radial-gradient(circle at 83% 59%,#fff 0 1px,transparent 2px);background-size:95px 95px,137px 137px,72px 72px;filter:drop-shadow(0 0 5px #fff)}
.stage:before{z-index:2;height:86px;background:linear-gradient(180deg,transparent,#050403 28%),repeating-linear-gradient(90deg,#0a0907 0 80px,#a77c21 80px 82px,#16120c 82px 160px);clip-path:polygon(0 28%,100% 0,100% 100%,0 100%)}
.curtain{background:repeating-linear-gradient(90deg,#030303 0 18px,#282217 35px,#020202 52px);box-shadow:inset -8px 0 20px #000,inset 3px 0 8px #e7bd4b33}.curtain:after{background:linear-gradient(90deg,#735117,#f6d77e,#795719);box-shadow:0 3px 0 #2b1d08,0 0 14px #e8bd5b88}
.marquee{border-color:#d0a13c;background:linear-gradient(#17130d,#020202);box-shadow:0 0 0 5px #f6db8c,0 8px 24px #000,0 0 34px #d7a83c66}.marquee span{color:#f9df8b;text-shadow:0 0 11px #cf9b28}
.caller-desk{background:linear-gradient(135deg,rgba(16,14,10,.96),rgba(54,43,20,.95));border-color:#d8ad48;color:#fff4cf;box-shadow:0 13px 34px #000,0 0 26px #e2b64a55}.caller-copy p{color:#e8bd5d}.caller-copy span{color:#dacba7}.caller .body{background:linear-gradient(100deg,#17130d,#c49a3f,#090806);border-color:#e4bd5c}.caller .mic,.caller .mic:before{background:#dedede}
.machine-zone{gap:clamp(42px,8vw,115px);margin-top:100px}.bingo-machine{z-index:3;flex:0 0 255px;transform:scale(1.2);transform-origin:center bottom;margin-inline:24px;filter:drop-shadow(0 18px 18px #000b) drop-shadow(0 0 13px #fff5)}
.cage{border:10px solid #f4f5f1;background:radial-gradient(circle at 34% 22%,#fff 0 3%,transparent 4%),radial-gradient(circle at 30% 32%,#fff 0 3%,#cf3048 4% 8%,transparent 9%),radial-gradient(circle at 66% 35%,#fff 0 3%,#e5bd40 4% 8%,transparent 9%),radial-gradient(circle at 45% 68%,#fff 0 3%,#3481aa 4% 8%,transparent 9%),linear-gradient(135deg,rgba(255,255,255,.58),rgba(88,88,88,.15),rgba(255,255,255,.43));box-shadow:inset 12px 10px 21px #fff9,inset -10px -12px 24px #0006,0 0 0 3px #575757,0 9px 18px #000c,0 0 18px #fff6}
.cage:before,.cage:after,.cage-ring{border-color:#e5e6df;filter:drop-shadow(1px 2px 1px #333)}
.axle{height:18px;background:linear-gradient(#fff,#737373 32%,#171717 52%,#e5e5df 77%,#777);box-shadow:0 5px 7px #000b,0 -2px 5px #fff9}.machine-stand{background:linear-gradient(90deg,#303030,#f8f8f4 25%,#737373 48%,#fff 66%,#333 92%);border-bottom-color:#1f1f1f;filter:drop-shadow(0 5px 4px #000)}.machine-stand i{background:#d5a83c;border-color:#fff;box-shadow:0 0 0 3px #343434,0 0 12px #f0c45d}.chute{border-color:#e9eae6;background:linear-gradient(#fff,#6d6d6b 49%,#dedfdc);box-shadow:0 4px 6px #0009}.chute span{border-color:#e1e2df}
.current-ball-wrap small,.current-ball-wrap b{color:#ffe89f;text-shadow:0 2px 4px #000}.current-ball{border-color:#fff7da;background:radial-gradient(circle at 32% 22%,white,#f4c957 43%,#9b6411 100%);box-shadow:0 10px 25px #000,0 0 0 5px #d4a638,0 0 24px #f1cc6b88}.current-ball span{color:#171109}
.setup-card{border-color:#d2a843;background:linear-gradient(135deg,#fff9e9,#e8d19a);box-shadow:0 12px 34px #0006}.step>span{background:linear-gradient(#282014,#050403);border:2px solid #d7aa43;color:#ffe496}.paper-button{border-color:#8d671d;color:#1b1408;background:linear-gradient(#f9df8d,#c89731)}.start-button{color:#fff2bf;background:linear-gradient(#80601d,#17120a);box-shadow:0 4px 0 #050403,0 0 0 1px #d3a847}
.number-board-wrap,.controls{border-color:#c99d3b;background:linear-gradient(145deg,#fffdf2,#e9d7aa);box-shadow:0 10px 32px #0006}.board-heading small,.control-label{color:#6f5014}.number-board{border-color:#1b160d}.board-letter.b,.board-letter.i,.board-letter.n,.board-letter.g,.board-letter.o{background:linear-gradient(#2c2416,#070604);color:#f2ce6d}.board-number.called{color:#1a1306;background:radial-gradient(circle,#fff5bd,#d7a83f)}.board-number.called:after{border-color:#3c2b0f88}.controls button{background:linear-gradient(#4f4127,#15110a);color:#ffeab0;border:1px solid #bd9135}.controls .bingo-button{color:#171008;background:linear-gradient(#ffeaa6,#c89931);box-shadow:0 5px 0 #6a4a10}.controls .quiet{color:#3e3017;background:#e2cf9d}.rules{border-left-color:#c79931;background:#f0dfb5}
.voice-choice{display:grid;gap:5px;margin-top:10px;color:#6c5019;font-size:.63rem;font-weight:900;letter-spacing:.12em}.voice-choice select{width:100%;min-height:42px;padding:0 9px;border:1px solid #aa8331;border-radius:7px;color:#2c2110;background:#fffaf0;font:600 .74rem "Segoe UI",sans-serif}.controls .voice-test{margin-top:7px;color:#4a3510;background:#f1d788}
.cards-toolbar{background:linear-gradient(100deg,#030303,#2d2517);border-bottom:3px solid #d5a73f}.cards-toolbar small{color:#f4ce6c}.card-options .print-button{background:linear-gradient(#8a691f,#21190b)}.bingo-card{border-color:#17130c;background:#fffdf4}.bingo-card-head strong{color:#b88a2d}.card-grid b:nth-child(n){background:linear-gradient(#282014,#070604);color:#f2ce6d}.card-grid .free{color:#261b08;background:#f0d378}
@media(max-width:980px){.stage{min-height:570px}.bingo-machine{transform:scale(1.08);margin-inline:10px}.machine-zone{margin-top:92px}}
@media(max-width:680px){body{background-size:auto,auto,auto,480px}.stage{min-height:520px;background-position:center 45%}.machine-zone{margin-top:88px}.bingo-machine{transform:scale(.9);margin-left:-8px;margin-right:-20px}.controls .voice-test{grid-column:auto}.voice-choice{grid-column:1/-1}.caller-desk{background:linear-gradient(135deg,rgba(14,12,8,.94),rgba(62,48,19,.95))}}

/* Full-screen presentation mode for large displays and TVs */
.fullscreen-button{min-width:42px;font-size:1.15rem!important;line-height:1}
body.fullscreen-active{min-height:100vh;background-size:auto,auto,auto,900px}
body.fullscreen-active .topbar{position:sticky;top:0}
body.fullscreen-active .setup-card,
body.fullscreen-active .game-console{width:min(1500px,calc(100% - 44px))}
@media(min-width:1000px){
  body.fullscreen-active .stage{min-height:clamp(650px,67vh,850px);padding-top:54px}
  body.fullscreen-active .marquee{margin-bottom:34px}
  body.fullscreen-active .machine-zone{margin-top:122px}
  body.fullscreen-active .bingo-machine{transform:scale(1.36);margin-inline:48px}
  body.fullscreen-active .current-ball{width:136px;height:136px}
  body.fullscreen-active .current-ball span{font-size:2.65rem}
  body.fullscreen-active .number-board-wrap{padding:23px}
  body.fullscreen-active .board-letter,
  body.fullscreen-active .board-number{min-height:50px}
}
@media(max-width:680px){
  .topbar{padding-right:150px}
  .fullscreen-button{min-width:34px;padding-inline:7px!important;font-size:.9rem!important}
}

/* More visible mechanical motion while the bingo cage is running */
.cage{overflow:hidden}
.cage-balls{z-index:2;transform-origin:center;will-change:transform}
.cage-spoke{position:absolute;z-index:4;inset:8px;border-radius:50%;pointer-events:none}
.cage-spoke:before{content:"";position:absolute;left:50%;top:-4%;width:6px;height:108%;border-radius:6px;background:linear-gradient(90deg,#555,#fff 42%,#777 72%,#222);box-shadow:0 0 6px #000,0 0 5px #fff8;transform:translateX(-50%) rotate(24deg);transform-origin:center}
.cage-spoke:after{content:"";position:absolute;left:50%;top:50%;width:25px;height:25px;border:5px solid #f7e1a0;border-radius:50%;background:radial-gradient(circle,#fff,#d7a83f 55%,#5d4212 58%);box-shadow:0 0 0 4px #3a3a38,0 0 13px #f6cf68;transform:translate(-50%,-50%)}
.bingo-machine.running .cage-balls{animation:cageBallTumble .9s linear infinite}
.bingo-machine.running .cage-balls i{animation:cageBallBounce .46s ease-in-out infinite alternate}
.bingo-machine.running .cage-balls i:nth-child(2n){animation-delay:-.16s;animation-duration:.58s}
.bingo-machine.running .cage-balls i:nth-child(3n){animation-delay:-.31s;animation-duration:.39s}
.bingo-machine.running .machine-stand i{animation:machineReadyPulse 1.05s ease-in-out infinite}
.bingo-machine.running .cage{animation:spinCage 1.15s linear infinite}
.bingo-machine.drawing .cage{animation:spinCage .38s linear infinite,drawShake .14s ease-in-out infinite alternate}
.chute span:after{content:"";position:absolute;z-index:4;left:1px;top:-9px;width:17px;height:17px;border:2px solid #fff8;border-radius:50%;background:radial-gradient(circle at 32% 28%,#fff,#e8be4e 35%,#9d6513 78%);box-shadow:0 3px 7px #0009;opacity:0}
.bingo-machine.drawing .chute span:after{animation:chuteBallDrop .7s cubic-bezier(.2,.75,.35,1) both}
.bingo-machine.drawing .machine-stand i{background:#ffe47c;box-shadow:0 0 0 3px #343434,0 0 22px 8px #ffd96c}
@keyframes cageBallTumble{to{transform:rotate(-360deg)}}
@keyframes cageBallBounce{from{translate:-3px -5px}to{translate:5px 7px}}
@keyframes machineReadyPulse{50%{filter:brightness(1.65);box-shadow:0 0 0 3px #343434,0 0 20px 7px #f0c45d}}
@keyframes drawShake{from{translate:-2px 0}to{translate:2px 1px}}
@keyframes chuteBallDrop{0%{opacity:0;transform:translate(-58px,-35px) scale(.55)}28%{opacity:1}72%{opacity:1;transform:translate(0,3px) scale(1)}100%{opacity:0;transform:translate(4px,30px) scale(.82)}}
@media(prefers-reduced-motion:reduce){
  .bingo-machine.running .cage{animation:spinCage 2.4s linear infinite!important}
  .bingo-machine.running .cage-balls{animation:cageBallTumble 2s linear infinite!important}
  .bingo-machine.running .machine-stand i{animation:machineReadyPulse 2s ease-in-out infinite!important}
}

/* TV layout: caller centered, cage centered left, last ball anchored bottom-right */
@media(min-width:1000px){
  body.fullscreen-active .stage{height:calc(100vh - 130px);min-height:590px;max-height:950px;padding-top:30px}
  body.fullscreen-active .marquee{margin-bottom:18px}
  body.fullscreen-active .caller-desk{left:auto;width:min(520px,46vw);margin-left:auto;margin-right:auto;transform:none;justify-content:center}
  body.fullscreen-active .caller-copy{text-align:center}
  body.fullscreen-active .machine-zone{position:absolute;z-index:3;left:0;right:0;bottom:0;width:auto;height:340px;margin:0;display:block;transform:none}
  body.fullscreen-active .bingo-machine{position:absolute;left:25%;bottom:18px;margin:0;transform:translateX(-50%) scale(1.55);transform-origin:center bottom}
  body.fullscreen-active .current-ball-wrap{position:absolute;right:clamp(20px,3vw,60px);bottom:-20px;min-width:320px}
  body.fullscreen-active .current-ball-wrap small{font-size:.9rem;letter-spacing:.2em}
  body.fullscreen-active .current-ball{width:280px;height:280px;border-width:12px;box-shadow:0 16px 38px #000,0 0 0 8px #d4a638,0 0 42px #f1cc6bbb}
  body.fullscreen-active .current-ball span{font-size:5.2rem}
  body.fullscreen-active .current-ball-wrap b{font-size:1.35rem}
}
@media(min-width:1400px) and (min-height:800px){
  body.fullscreen-active .bingo-machine{bottom:24px;transform:translateX(-50%) scale(2.1)}
  body.fullscreen-active .current-ball-wrap{right:clamp(28px,3vw,70px);bottom:-18px;min-width:400px}
  body.fullscreen-active .current-ball-wrap small{font-size:1.05rem}
  body.fullscreen-active .current-ball{width:360px;height:360px;border-width:14px;box-shadow:0 18px 44px #000,0 0 0 10px #d4a638,0 0 52px #f1cc6bcc}
  body.fullscreen-active .current-ball span{font-size:6.6rem}
  body.fullscreen-active .current-ball-wrap b{font-size:1.55rem}
}

/* Paper-safe bingo cards: two complete, aligned cards per Letter landscape page. */
@media print{
  @page{size:letter landscape;margin:8mm}
  html,body{
    width:auto!important;
    min-width:0!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    background:#fff!important;
    background-image:none!important;
  }
  body::before,body::after{display:none!important}
  .topbar,main,.cards-toolbar,.card-options,.print-tip,.celebration,.arcade-fullscreen-button{display:none!important}
  .cards-dialog{
    position:static!important;
    inset:auto!important;
    display:block!important;
    width:100%!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    border:0!important;
    border-radius:0!important;
    background:#fff!important;
    background-image:none!important;
    box-shadow:none!important;
  }
  .cards-dialog::backdrop{display:none!important;background:transparent!important}
  .print-area{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-auto-rows:auto!important;
    gap:8mm!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:#fff!important;
    background-image:none!important;
  }
  .bingo-card{
    box-sizing:border-box!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:5mm!important;
    overflow:hidden!important;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
    border:1mm solid #17130c!important;
    border-radius:3mm!important;
    background:#fffdf4!important;
    background-image:none!important;
    box-shadow:none!important;
    color:#17130c!important;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
  }
  .bingo-card:last-child:nth-child(odd){grid-column:1/-1;width:calc((100% - 8mm)/2)!important;justify-self:center}
  .bingo-card-head{height:20mm!important;margin:0 0 3mm!important;align-items:center!important}
  .bingo-card-head strong{font-size:14mm!important;line-height:1!important;letter-spacing:.18em!important;color:#8b6514!important;text-shadow:none!important}
  .bingo-card-head small{font-size:3mm!important;line-height:1.25!important;color:#17130c!important}
  .card-grid{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    grid-template-rows:repeat(6,25mm)!important;
    width:100%!important;
    border:.6mm solid #17130c!important;
    background:#fff!important;
  }
  .card-grid>*{
    box-sizing:border-box!important;
    width:auto!important;
    height:25mm!important;
    min-width:0!important;
    min-height:0!important;
    aspect-ratio:auto!important;
    border:.3mm solid #3b3529!important;
    background:#fff!important;
    color:#17130c!important;
  }
  .card-grid b{font-size:8.5mm!important;line-height:1!important;color:#17130c!important}
  .card-grid span{font-size:7.5mm!important;line-height:1!important;color:#17130c!important}
  .card-grid .free{font-size:3.2mm!important;line-height:1.05!important;background:#f2d782!important;color:#17130c!important}
}
