*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:linear-gradient(180deg,#87CEEB 0%,#4CAF50 100%);height:100vh;overflow:hidden;color:#333;-webkit-user-select:none;user-select:none;touch-action:manipulation}#game-container{height:100vh;position:relative;display:flex;flex-direction:column}header{padding:12px 16px;position:relative;display:flex;align-items:center;background:rgba(255,255,255,.9);border-radius:0 0 15px 15px;margin:0 10px;box-shadow:0 2px 10px #0000001a;min-height:72px}#hud{display:flex;align-items:center;flex:1;gap:16px;font-size:18px;font-weight:700}#hud>div{display:flex;align-items:center;gap:5px;white-space:nowrap}#lives{margin-left:auto;gap:8px}#question-prompt{font-size:32px;font-weight:700;color:#2c3e50;background:rgba(255,255,255,.85);padding:10px 18px;border-radius:12px;box-shadow:0 2px 6px #00000026;text-align:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;pointer-events:none}#playfield{flex:1;position:relative;overflow:hidden}#playfield #balloons-container{pointer-events:auto}#balloons-container{position:relative;width:100%;height:100%}.balloon{width:80px;height:80px;background:linear-gradient(135deg,#ff6b6b,#ffa500);border-radius:50% 50% 48% 48%/55% 55% 45% 45%;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;color:#fff;-webkit-text-stroke:1.5px rgba(0,0,0,.85);paint-order:stroke fill;text-shadow:0 0 2px rgba(0,0,0,.7),0 1px 2px rgba(0,0,0,.6),-1px 0 2px rgba(0,0,0,.6),1px 0 2px rgba(0,0,0,.6);cursor:pointer;box-shadow:0 4px 8px #0000004d;transition:transform .2s;-webkit-user-select:none;user-select:none;will-change:transform;touch-action:manipulation;position:absolute;overflow:visible}.balloon:before{content:"";position:absolute;top:14px;left:16px;width:26px;height:26px;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.85),rgba(255,255,255,.05) 60%,transparent 70%);border-radius:50%;pointer-events:none;filter:blur(.5px);opacity:.9}.balloon:after{content:"";position:absolute;bottom:-10px;left:50%;transform:translate(-50%);width:14px;height:14px;background:inherit;filter:brightness(.85);clip-path:polygon(50% 100%,0 0,100% 0);pointer-events:none}.balloon.color1{background:linear-gradient(135deg,#ff6b6b,#ffa500)}.balloon.color2{background:linear-gradient(135deg,#6a5af9,#8b7dff)}.balloon.color3{background:linear-gradient(135deg,#00b09b,#96c93d)}.balloon.color4{background:linear-gradient(135deg,#ff7eb3,#ff758c)}.balloon.color5{background:linear-gradient(135deg,#ff9a9e,#fecfef)}.balloon.color6{background:linear-gradient(135deg,#43cea2,#185a9d)}.balloon:hover{transform:scale(1.1)}footer{padding:20px;background:rgba(255,255,255,.9);border-radius:15px 15px 0 0;margin:0 10px;display:flex;justify-content:center;align-items:center;gap:20px;flex-wrap:wrap;box-shadow:0 -2px 10px #0000001a}#options-group{display:flex;gap:12px;align-items:center;transition:transform .35s ease,opacity .35s ease}body.playing #options-group{transform:translateY(120%);opacity:0;pointer-events:none}body.playing #start-btn{display:none!important}body.playing #pause-btn{display:inline-block!important}body.playing #play-again-btn{display:none!important}body.playing #footer{padding:10px 16px;transform:none;transition:none}body.playing #question-prompt{font-size:28px}body.game-over #options-group{transform:translateY(0);opacity:1}body.game-over #play-again-btn{display:inline-block!important}button{padding:10px 20px;font-size:16px;font-weight:700;border:none;border-radius:25px;cursor:pointer;transition:all .2s;background:#2196F3;color:#fff}button:hover{background:#1976D2;transform:translateY(-2px);box-shadow:0 2px 10px #0000004d}button:active{transform:translateY(0)}#pause-overlay{pointer-events:none}select{padding:10px;font-size:16px;border:2px solid #ddd;border-radius:10px;background:white}#pb-badge{background:gold;color:#333;padding:5px 10px;border-radius:15px;font-size:14px;font-weight:700}@media (max-width: 768px){#question-prompt{font-size:28px;padding:15px}#hud{font-size:14px;gap:10px}.balloon{width:60px;height:60px;font-size:18px}footer{flex-wrap:wrap;gap:10px}}@media (min-width: 900px){body.playing #footer{position:static;transform:none;padding:12px 20px}}@media (max-height: 620px){body.playing #footer{position:static;transform:none;padding:10px 16px}}
