body{font-family:Comic Sans MS,cursive,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;overflow-x:hidden}.app{min-height:100vh;display:flex;flex-direction:column;position:relative}.header{background:linear-gradient(45deg,#ff6b6b,#4ecdc4,#45b7d1);background-size:300% 300%;animation:gradientShift 3s ease infinite;padding:20px;text-align:center;box-shadow:0 4px 20px #0000004d;position:relative;overflow:hidden;z-index:1}.header:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(255,255,255,.1) 1px,transparent 1px);background-size:20px 20px;animation:float 6s ease-in-out infinite;pointer-events:none;z-index:-1}.header nav{position:relative;z-index:1}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-20px) rotate(180deg)}}.title{font-size:3rem;color:#fff;text-shadow:3px 3px 0px #333,6px 6px 0px #666;margin-bottom:10px;position:relative;z-index:1}.score{display:flex;align-items:center;justify-content:center;gap:10px;font-size:1.5rem;color:#fff;text-shadow:2px 2px 0px #333;position:relative;z-index:1}.star-icon{animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.game-area{flex:1;display:flex;flex-direction:column;align-items:center;padding:20px;gap:20px}.playground{width:800px;height:600px;background:linear-gradient(45deg,#f0f8ff,#e6f3ff);border:5px solid #333;border-radius:20px;position:relative;overflow:hidden;cursor:crosshair;box-shadow:inset 0 0 50px #0000001a,0 10px 30px #0000004d;background-image:radial-gradient(circle at 20% 80%,rgba(120,119,198,.3) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(255,119,198,.3) 0%,transparent 50%),radial-gradient(circle at 40% 40%,rgba(120,219,255,.3) 0%,transparent 50%)}.playground:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(45deg,transparent,transparent 10px,rgba(255,255,255,.1) 10px,rgba(255,255,255,.1) 20px);pointer-events:none}.ball{position:absolute;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;border:3px solid rgba(255,255,255,.8);-webkit-user-select:none;user-select:none}.ball:hover{transform:scale(1.1);border-color:#fff;box-shadow:0 0 30px #fffc}.ball-emoji{font-size:1.5rem;filter:drop-shadow(2px 2px 4px rgba(0,0,0,.3))}.celebration{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:10px;font-size:2rem;font-weight:700;color:gold;text-shadow:2px 2px 0px #FF6B6B;pointer-events:none;z-index:1000}.sparkle{animation:sparkle .5s ease-in-out}@keyframes sparkle{0%,to{transform:scale(1) rotate(0)}50%{transform:scale(1.5) rotate(180deg)}}.controls{display:flex;flex-direction:column;align-items:center;gap:20px}.control-btn{display:flex;align-items:center;gap:10px;padding:15px 30px;font-size:1.2rem;font-weight:700;color:#fff;border:none;border-radius:50px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:1px;box-shadow:0 5px 15px #0000004d;position:relative;overflow:hidden}.control-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s}.control-btn:hover:before{left:100%}.control-btn.start{background:linear-gradient(45deg,#4ecdc4,#44a08d)}.control-btn.stop{background:linear-gradient(45deg,#ff6b6b,#ff8e8e)}.btn-icon{animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.instructions{text-align:center;color:#fff;background:#0000004d;padding:20px;border-radius:15px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.2)}.instructions p{margin:5px 0;font-size:1.1rem;text-shadow:1px 1px 2px rgba(0,0,0,.5)}.footer{background:#0003;padding:20px;text-align:center;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.footer p{font-size:1.1rem;text-shadow:1px 1px 2px rgba(0,0,0,.5)}.heart{color:#ff6b6b;animation:heartbeat 1.5s ease-in-out infinite}@keyframes heartbeat{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}@media (max-width: 900px){.playground{width:90vw;height:60vh;max-width:800px;max-height:600px}.title{font-size:2rem}.score{font-size:1.2rem}}@media (max-width: 600px){.title{font-size:1.5rem}.control-btn{padding:12px 24px;font-size:1rem}.instructions p{font-size:1rem}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);font-family:Comic Sans MS,cursive,sans-serif}#root{width:100%;min-height:100vh}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}}