:root{--ball-size:100px;--ball-color-b:#2980b9;--ball-color-i:#c0392b;--ball-color-n:#27ae60;--ball-color-g:#d35400;--ball-color-o:#8e44ad}#bingo-caller-container{display:flex;flex-direction:column;align-items:center;gap:20px;padding:20px;max-width:1000px;margin:auto;perspective:1500px}#fullscreen-wrapper{width:100%;display:flex;flex-direction:column;align-items:center;gap:20px}#fullscreen-wrapper:fullscreen{background:#1c1c1c;padding:2vh;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;overflow:hidden}#fullscreen-wrapper:fullscreen #bingo-machine{flex-grow:1;max-height:80vh;width:auto;aspect-ratio:800 / 485}#fullscreen-wrapper:fullscreen .controls-area{margin-top:20px;flex-shrink:0}#fullscreen-wrapper:fullscreen #ball-display-area{border-color:#fff}#bingo-machine{display:grid;grid-template-areas:"cage display" "chute chute";grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:10px 20px;width:100%;max-width:800px;padding:20px;background:#f7f1e3;border:2px solid #d1ccc0;border-radius:20px;box-shadow:5px 5px 20px rgba(0,0,0,0.2),inset 0 0 15px rgba(0,0,0,0.1);position:relative;min-height:460px}#chute-area{grid-area:chute;height:60px;background:#c7c1b6;border-radius:10px;border-top:2px solid #b3afa6;border-bottom:2px solid white;margin-top:-30px;position:relative;z-index:10}#ball-display-area{grid-area:display;height:350px;border:3px dashed #c0392b;border-radius:10px;display:flex;align-items:center;justify-content:center;position:relative;background-color:#fffaf0;overflow:hidden}#ball-display-area p{color:#999;font-size:1.5em}#ball-animation-container{grid-column:1 / -1;grid-row:1 / -1;position:relative;z-index:25;pointer-events:none}#handle{position:absolute;top:50%;left:0;width:120px;height:40px;transform-origin:90px 20px;transform:translate(-50%,-50%);transition:transform .3s ease-in-out}#handle-arm{width:80px;height:10px;background:#a0a0a0;border-radius:5px;position:absolute;top:15px;left:10px;box-shadow:1px 1px 3px rgba(0,0,0,0.4)}#handle-grip{width:20px;height:40px;background:#c0392b;border-radius:5px;position:absolute;top:0;left:0;box-shadow:inset 1px 1px 3px rgba(0,0,0,0.4)}#handle.turn{animation:turnHandle 2s cubic-bezier(0.64,0.04,0.35,1)}@keyframes turnHandle{0%{transform:translate(-50%,-50%) rotate(0deg)}100%{transform:translate(-50%,-50%) rotate(720deg)}}#cage-area{grid-area:cage;height:350px;background:radial-gradient(circle,rgba(0,0,0,0.05) 0,rgba(0,0,0,0.2) 100%);border:4px solid #b3afa6;border-radius:50%;position:relative;transform-style:preserve-3d;display:flex;align-items:center;justify-content:center}#cage-area.tumbling{animation:tumbleCage 2s cubic-bezier(0.64,0.04,0.35,1)}@keyframes tumbleCage{0%{transform:rotate(0deg) scale(1)}25%{transform:rotate(15deg) scale(1.03)}50%{transform:rotate(-10deg) scale(1.03)}75%{transform:rotate(10deg) scale(1.03)}100%{transform:rotate(0deg) scale(1)}}.mini-ball{position:absolute;width:30px;height:30px;border-radius:50%;color:white;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:bold;transition:transform .5s ease-out,opacity .5s ease-out;text-shadow:1px 1px 2px rgba(0,0,0,0.7);backface-visibility:hidden}#cage-area.tumbling .mini-ball{animation:shuffleBall .25s infinite;z-index:2}@keyframes shuffleBall{0%,100%{transform:translate3d(0,0,1px) rotate(0)}25%{transform:translate3d(5px,-3px,1px) rotate(15deg)}50%{transform:translate3d(-4px,4px,1px) rotate(-10deg)}75%{transform:translate3d(3px,-5px,1px) rotate(8deg)}}.bingo-ball{width:var(--ball-size);height:var(--ball-size);border-radius:50%;color:white;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:bold;position:absolute;box-shadow:inset -5px -5px 15px rgba(0,0,0,0.4);text-shadow:1px 1px 3px rgba(0,0,0,0.5);visibility:hidden;z-index:20;will-change:transform;pointer-events:auto}.bingo-ball .letter{font-size:2em}.bingo-ball .number{font-size:2.5em;line-height:1.1}.ball-B{background-color:var(--ball-color-b)}.ball-I{background-color:var(--ball-color-i)}.ball-N{background-color:var(--ball-color-n)}.ball-G{background-color:var(--ball-color-g)}.ball-O{background-color:var(--ball-color-o)}.bingo-ball.slide-away{animation:slideAway .5s forwards}@keyframes slideAway{from{opacity:1}to{transform:scale(0) translateY(-300%);opacity:0;visibility:hidden}}.star{position:absolute;width:3px;height:3px;background:white;border-radius:50%;box-shadow:0 0 6px 2px #FFF;animation:sparkle .8s ease-in-out;pointer-events:none}@keyframes sparkle{0%{transform:scale(0) translateY(-50px);opacity:1}50%{transform:scale(1.5) translateY(50px)}100%{transform:scale(0) translateY(150px);opacity:0}}.confetti{position:fixed;width:10px;height:10px;background-color:red;opacity:0;pointer-events:none;animation:confetti-burst 1.2s ease-out forwards;--translate-end:translate(0,0);z-index:9999}@keyframes confetti-burst{0%{transform:translate(-50%,-50%) scale(0.5);opacity:1}100%{transform:var(--translate-end) scale(1);opacity:0}}.controls-area{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;align-items:center}#spin-button,#fullscreen-btn,#mute-btn{padding:15px 30px;font-size:1.5em;font-weight:bold;cursor:pointer;border-radius:10px;border:none;color:white;transition:background-color .2s;display:flex;align-items:center;justify-content:center;gap:10px}#spin-button{background-color:#1E8449;z-index:5}#spin-button:disabled{background-color:#95a5a6;cursor:not-allowed}#spin-button:hover:not(:disabled){background-color:#27ae60}#fullscreen-btn{background-color:#3498db}#fullscreen-btn:hover{background-color:#2980b9}#mute-btn{background-color:#f39c12;padding:15px}#mute-btn:hover{background-color:#e67e22}#fullscreen-icon-exit,#icon-muted{display:none}#called-numbers-board{width:100%;display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:20px;margin-top:20px;min-height:870px}.board-column{display:flex;flex-direction:column;align-items:center;border-radius:5px;padding:10px}.board-column h2{margin:0 0 10px 0;padding-bottom:5px;color:white;width:100%;text-align:center;border-bottom:2px solid rgba(255,255,255,0.5)}#col-B{background-color:var(--ball-color-b)}#col-I{background-color:var(--ball-color-i)}#col-N{background-color:var(--ball-color-n)}#col-G{background-color:var(--ball-color-g)}#col-O{background-color:var(--ball-color-o)}.number-slot{background-color:#ecf0f1;color:#555;width:45px;height:45px;display:flex;align-items:center;justify-content:center;margin:4px 0;font-size:1.2em;font-weight:bold;border-radius:5px;transition:all .3s}.number-slot.called{background-color:#1E8449;color:#000;transform:scale(1.15);box-shadow:0 2px 5px rgba(0,0,0,0.2)}