*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden;touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;background:#4a4a4a;font-family:Segoe UI,system-ui,sans-serif}.game-root{width:100%;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#4a4a4a;position:relative}.game-title{font-size:2.8rem;font-weight:900;color:#1a1a1a;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 2px 4px rgba(0,0,0,.3);margin-bottom:.5rem}.game-subtitle{font-size:.85rem;color:#6a6a6a;letter-spacing:.15em;text-transform:uppercase;margin-bottom:2rem}.arena{position:relative;width:320px;height:320px;display:flex;align-items:center;justify-content:center}.arena-border{position:absolute;top:0;right:0;bottom:0;left:0;border:3px solid #3a3a3a;border-radius:50%}.player-shape,.enemy-shape{position:absolute;width:80px;height:80px;display:flex;align-items:center;justify-content:center;font-size:2.5rem;font-weight:900;border-radius:12px;transition:transform .1s ease}.player-shape{background:#2a2a2a;color:#e0e0e0;border:3px solid #5a5a5a;left:30px;top:50%;transform:translateY(-50%)}.enemy-shape{background:#6a1b1b;color:#e0b0b0;border:3px solid #8a3030;right:30px;top:50%;transform:translateY(-50%)}.player-shape.attacking{transform:translateY(-50%) translate(80px) scale(1.1)}.enemy-shape.attacking{transform:translateY(-50%) translate(-80px) scale(1.1)}.clash-burst{position:absolute;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,#fffc,#fff0 70%);animation:burst .4s ease-out forwards;pointer-events:none}@keyframes burst{0%{transform:scale(.3);opacity:1}to{transform:scale(2);opacity:0}}.stats{display:flex;gap:2.5rem;margin-top:2rem;margin-bottom:1.5rem}.stat{text-align:center}.stat-value{font-size:2rem;font-weight:800;color:#1a1a1a}.stat-label{font-size:.7rem;color:#6a6a6a;text-transform:uppercase;letter-spacing:.15em}.tap-btn{width:200px;height:200px;border-radius:50%;border:4px solid #3a3a3a;background:#555;color:#d0d0d0;font-size:1.1rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:.25rem;transition:transform .08s,background .08s,border-color .08s;-webkit-tap-highlight-color:transparent;outline:none;margin-top:1.5rem}.tap-btn:active,.tap-btn.pressed{transform:scale(.92);background:#666;border-color:#888}.tap-btn.clash-ready{border-color:#b8860b;background:#5a5040}.tap-btn.clash-ready:active{background:#6a6050;border-color:#d4a017}.tap-hint{font-size:.65rem;opacity:.5}.result-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#1e1e1eeb;z-index:10;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.result-text{font-size:3.5rem;font-weight:900;text-transform:uppercase;letter-spacing:.1em}.result-text.win{color:#6ecf6e}.result-text.lose{color:#cf6e6e}.result-sub{font-size:1rem;color:#888;margin-top:.5rem}.play-again-btn{margin-top:2rem;padding:.8rem 2.5rem;border:2px solid #555;border-radius:8px;background:#3a3a3a;color:#ccc;font-size:1rem;font-weight:600;cursor:pointer;text-transform:uppercase;letter-spacing:.1em;transition:background .15s,border-color .15s}.play-again-btn:hover,.play-again-btn:active{background:#4a4a4a;border-color:#888}.health-bars{display:flex;gap:1rem;align-items:center;margin-bottom:.5rem}.health-bar-wrap{width:130px;height:10px;background:#333;border-radius:5px;overflow:hidden}.health-bar-fill{height:100%;border-radius:5px;transition:width .3s ease}.health-bar-fill.player{background:#6a9a6a}.health-bar-fill.enemy{background:#9a6a6a}.health-label{font-size:.7rem;color:#888;width:40px;text-align:center;font-weight:700}.vs-label{font-size:.8rem;font-weight:900;color:#555}.combo-display{position:absolute;top:10px;right:10px;font-size:1.2rem;font-weight:900;color:#d4a017;opacity:0;transition:opacity .2s}.combo-display.visible{opacity:1}.particle{position:absolute;width:6px;height:6px;border-radius:50%;pointer-events:none}@keyframes particleFly{0%{opacity:1;transform:translate(0) scale(1)}to{opacity:0;transform:translate(var(--dx),var(--dy)) scale(0)}}.shake{animation:shake .3s ease}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.round-info{font-size:.8rem;color:#777;margin-bottom:.5rem;letter-spacing:.1em;text-transform:uppercase}