body {
background: #f9f9f9;
}
#bingoMachineWrapper {
position: relative;
margin: 0 auto;
border-radius: 50%;
width: 420px;
height: 420px;
background: linear-gradient(135deg, #fcfcfc 60%, #e0e0e0 100%);
border: 6px solid #b5b5b5;
box-shadow: 0 8px 40px #aaa3;
display: flex;
align-items: center;
justify-content: center;
}
#bingoCanvas {
background: transparent;
border-radius: 50%;
}
#calledBallDisplay {
    min-height: 52px;
}

.called-balls-panel {
    width: 100%;
    background: #edf3fa;
    border: 1px solid #b1c7ed;
    border-radius: 9px;
    padding: 10px;
    font-size: 1rem;
}

.called-balls-list {
    min-height: 25px;
    margin-top: 2px;
    overflow-x: auto;
    white-space: nowrap;
}

.called-ball {
    display: inline-block;
    width: 34px;
    height: 34px;
    line-height: 32px;
    margin: 3px 2px 0 2px;
    border-radius: 50%;
    font-weight: 600;
    font-size: 1.05em;
    color: #fff;
    text-align: center;
    border: 2px solid #888;
    background: linear-gradient(145deg, #4682b4 65%, #79bcff 100%);
    box-shadow: 1px 2.5px 6px #7999bb27;
}

@media (max-width: 450px) {
    #bingoMachineWrapper, #bingoCanvas {
        width: 98vw !important;
        height: 98vw !important;
        max-width: 98vw !important;
        max-height: 98vw !important;
    }
}