*{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden;background:#3a3a3a;color:#fafafa;font-family:Segoe UI,system-ui,sans-serif;touch-action:none;user-select:none;-webkit-user-select:none}#root{display:flex;align-items:center;justify-content:center}.game-container{position:relative;width:100vw;height:100vh;overflow:hidden;background:linear-gradient(180deg,#4a4a4a,#2a2a2a)}.castle{position:absolute;bottom:0;left:50%;transform:translate(-50%);width:200px;height:180px;z-index:2}.castle-base{position:absolute;bottom:0;left:20px;width:160px;height:100px;background:linear-gradient(135deg,#5a5a5a,#3a3a3a);border:3px solid #2a2a2a;border-bottom:none;border-radius:4px 4px 0 0}.castle-door{position:absolute;bottom:0;left:50%;transform:translate(-50%);width:40px;height:55px;background:#1a1a1a;border-radius:20px 20px 0 0;border:2px solid #2a2a2a;border-bottom:none}.castle-tower{position:absolute;bottom:80px;width:45px;height:120px;background:linear-gradient(135deg,#6a6a6a,#4a4a4a);border:3px solid #2a2a2a;border-bottom:none}.castle-tower.left{left:5px}.castle-tower.right{right:5px}.castle-tower-top{position:absolute;top:-20px;left:50%;transform:translate(-50%);width:0;height:0;border-left:28px solid transparent;border-right:28px solid transparent;border-bottom:25px solid #6a6a6a}.castle-flag{position:absolute;top:-40px;left:50%;transform:translate(-50%);width:4px;height:25px;background:#888}.castle-flag:after{content:"";position:absolute;top:0;left:4px;width:20px;height:14px;background:#e63946;clip-path:polygon(0 0,100% 20%,80% 50%,100% 80%,0 100%);animation:flag-wave .6s ease-in-out infinite alternate}@keyframes flag-wave{0%{transform:scaleX(1)}to{transform:scaleX(.85)}}.castle-window{position:absolute;width:16px;height:20px;background:#fc0;border-radius:8px 8px 0 0;box-shadow:0 0 12px 4px #ffc80066;animation:window-glow 2s ease-in-out infinite alternate}@keyframes window-glow{0%{box-shadow:0 0 8px 2px #ffc8004d}to{box-shadow:0 0 16px 6px #ffc80099}}.castle-window.w1{bottom:110px;left:50%;transform:translate(-50%)}.castle-window.w2{bottom:50px;left:55px}.castle-window.w3{bottom:50px;right:55px}.fireball{position:absolute;width:44px;height:44px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff700,#f60,#c00);box-shadow:0 0 20px 8px #ff6400b3,0 0 40px 16px #ff32004d;cursor:pointer;z-index:10;transition:transform .05s;animation:fireball-pulse .3s ease-in-out infinite alternate}.fireball:before{content:"";position:absolute;top:-8px;left:-8px;right:-8px;bottom:-8px;border-radius:50%;background:radial-gradient(circle,rgba(255,200,0,.3),transparent 70%);animation:fireball-aura .5s ease-in-out infinite alternate}@keyframes fireball-pulse{0%{transform:scale(1)}to{transform:scale(1.1)}}@keyframes fireball-aura{0%{opacity:.5;transform:scale(1)}to{opacity:1;transform:scale(1.2)}}.fireball.hit{animation:fireball-hit .3s forwards;pointer-events:none}@keyframes fireball-hit{0%{transform:scale(1);opacity:1}50%{transform:scale(1.8);opacity:.6;background:radial-gradient(circle,#fff,#ff0)}to{transform:scale(2.5);opacity:0}}.particle{position:absolute;width:8px;height:8px;border-radius:50%;pointer-events:none;z-index:11}.score-popup{position:absolute;color:#fc0;font-size:1.5rem;font-weight:900;text-shadow:0 0 10px rgba(255,200,0,.8),2px 2px 0 #cc6600;pointer-events:none;z-index:20;animation:score-float .8s forwards}@keyframes score-float{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-60px) scale(1.5)}}.hud{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:16px 20px;z-index:100;pointer-events:none}.hud-left,.hud-right{display:flex;flex-direction:column;gap:6px}.hud-label{font-size:.65rem;text-transform:uppercase;letter-spacing:.15em;color:#ffffff80}.hud-value{font-size:1.8rem;font-weight:800;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.5)}.hud-value.score{color:#fc0}.health-bar-container{position:absolute;bottom:200px;left:50%;transform:translate(-50%);width:180px;height:14px;background:#00000080;border-radius:7px;border:2px solid #555;overflow:hidden;z-index:5}.health-bar{height:100%;background:linear-gradient(90deg,#e63946,#ff6b6b);border-radius:5px;transition:width .3s}.health-bar.low{animation:health-flash .5s infinite}@keyframes health-flash{0%,to{opacity:1}50%{opacity:.5}}.castle.damaged .castle-base,.castle.damaged .castle-tower{animation:castle-shake .3s}@keyframes castle-shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.beat-bar{position:absolute;bottom:190px;left:50%;transform:translate(-50%);display:flex;gap:3px;z-index:5}.beat-pip{width:6px;height:20px;background:#ff64004d;border-radius:3px;transition:all .1s}.beat-pip.active{background:#f60;box-shadow:0 0 8px #ff640099;height:28px}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000d9;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:200;gap:16px}.overlay h1{font-size:3rem;font-weight:900;color:#f60;text-shadow:0 0 30px rgba(255,100,0,.6),0 4px 0 #cc3300;letter-spacing:-.02em}.overlay h2{font-size:2rem;font-weight:800;color:#e63946}.overlay p{color:#ffffffb3;font-size:1rem;max-width:300px;text-align:center}.overlay .final-score{font-size:3.5rem;font-weight:900;color:#fc0;text-shadow:0 0 20px rgba(255,200,0,.5)}.play-btn{margin-top:12px;padding:14px 48px;font-size:1.2rem;font-weight:700;color:#fff;background:linear-gradient(135deg,#f60,#c30);border:none;border-radius:12px;cursor:pointer;text-transform:uppercase;letter-spacing:.1em;box-shadow:0 4px 20px #ff3c0066;transition:transform .1s,box-shadow .1s;pointer-events:auto}.play-btn:active{transform:scale(.95);box-shadow:0 2px 10px #ff3c0066}.combo{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:2.5rem;font-weight:900;color:#f60;text-shadow:0 0 20px rgba(255,100,0,.7);pointer-events:none;z-index:50;opacity:0;transition:opacity .2s}.combo.visible{opacity:1;animation:combo-pop .3s}@keyframes combo-pop{0%{transform:translate(-50%,-50%) scale(.5)}60%{transform:translate(-50%,-50%) scale(1.2)}to{transform:translate(-50%,-50%) scale(1)}}.ground{position:absolute;bottom:0;left:0;right:0;height:8px;background:#222}.star{position:absolute;width:2px;height:2px;background:#fff6;border-radius:50%;animation:twinkle 3s ease-in-out infinite}@keyframes twinkle{0%,to{opacity:.2}50%{opacity:1}}