*{margin:0;padding:0;box-sizing:border-box}body{overflow:hidden;font-family:system-ui,sans-serif}#game{width:100vw;height:100vh}#hud{position:fixed;bottom:20px;left:50%;transform:translate(-50%);display:flex;gap:12px;pointer-events:none;z-index:100}.spell-slot{width:56px;height:56px;background:#fff;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;border:2px solid #ddd}.spell-slot.selected{border-color:#2196f3}.spell-key{position:absolute;top:2px;left:4px;font-size:10px;color:#999}.spell-orb{width:20px;height:20px;border-radius:50%;margin-bottom:2px}.spell-name{font-size:8px;text-align:center}.cd-overlay{position:absolute;bottom:0;left:0;right:0;background:#00000080;border-radius:0 0 6px 6px}.bars-container{position:fixed;bottom:20px;left:20px;display:flex;flex-direction:column;gap:6px;z-index:100}.bar-wrapper{display:flex;align-items:center;gap:6px;background:#000000b3;padding:6px 10px;border-radius:6px}.bar-label{font-size:11px;font-weight:700;color:#fff;width:20px}.bar-track{width:100px;height:10px;background:#333;border-radius:5px;overflow:hidden}.bar-fill{height:100%;border-radius:5px;transition:width .2s}.bar-fill.health{background:#f44336}.bar-fill.mana{background:#2196f3}.bar-fill.xp{background:#9c27b0}.bar-text{font-size:10px;color:#fff;min-width:40px;text-align:right}#level-display{position:fixed;top:16px;left:50%;transform:translate(-50%);background:#000000b3;padding:6px 16px;border-radius:16px;color:#fff;z-index:100;font-size:14px;font-weight:700}#kill-counter{position:fixed;top:16px;right:20px;background:#000000b3;padding:6px 12px;border-radius:6px;color:#fff;font-size:12px;font-weight:700;z-index:100}#wave-info{position:fixed;top:16px;left:20px;background:#000000b3;padding:8px 12px;border-radius:6px;color:#fff;z-index:100}.wave-title{font-size:12px;font-weight:700}.wave-subtitle{font-size:10px;opacity:.8}#crosshair{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:16px;height:16px;pointer-events:none;z-index:100}#crosshair:before,#crosshair:after{content:"";position:absolute;background:#fffc}#crosshair:before{width:2px;height:16px;left:7px}#crosshair:after{width:16px;height:2px;top:7px}#game-over-screen,#pause-screen{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:2000}.game-over-content,.pause-content{background:#fff;padding:30px 50px;border-radius:12px;text-align:center}.game-over-title{font-size:36px;color:#f44336;margin-bottom:20px}.pause-title{font-size:32px;color:#2196f3;margin-bottom:20px}.game-over-stats{margin-bottom:20px}.stat{font-size:14px;margin:4px 0}.game-btn{display:block;width:180px;margin:8px auto;padding:12px 24px;font-size:14px;font-weight:700;color:#fff;background:#2196f3;border:none;border-radius:8px;cursor:pointer}.game-btn.secondary{background:#757575}#message-area{position:fixed;top:40%;left:50%;transform:translate(-50%);pointer-events:none;z-index:200}.message{font-size:28px;font-weight:700;color:#ffc107;text-shadow:0 2px 4px rgba(0,0,0,.5);animation:float 2s forwards}@keyframes float{0%{opacity:0;transform:translateY(20px)}20%{opacity:1;transform:translateY(0)}80%{opacity:1}to{opacity:0;transform:translateY(-20px)}}#touch-controls{position:fixed;inset:0;pointer-events:none;z-index:1000}#touch-controls>*{pointer-events:auto}#joystick-zone{position:fixed;bottom:80px;left:30px;width:150px;height:150px}#joystick-base{position:absolute;width:100px;height:100px;border-radius:50%;background:#fffc;border:3px solid rgba(0,0,0,.2);left:25px;top:25px;opacity:.6}#joystick-stick{position:absolute;width:40px;height:40px;border-radius:50%;background:#2196f3;left:50%;top:50%;margin:-20px 0 0 -20px}#look-zone{position:fixed;top:0;right:0;width:60%;height:100%}#touch-buttons{position:fixed;bottom:80px;right:30px;display:grid;grid-template-columns:repeat(2,56px);gap:10px}#touch-buttons button{width:56px;height:56px;border-radius:12px;border:none;background:#ffffffe6;font-size:24px;cursor:pointer}#touch-buttons button:active{background:#2196f3}#touch-spells{position:fixed;top:70px;right:20px;display:flex;flex-direction:column;gap:6px}.spell-btn{width:40px;height:40px;border-radius:8px;border:none;color:#fff;font-weight:700;cursor:pointer}.screen-damage{position:fixed;inset:0;background:#f443364d;pointer-events:none;z-index:90;opacity:0;transition:opacity .15s}.screen-damage.active{opacity:1}@media(max-width:768px){#hud{bottom:12px;gap:6px}.spell-slot{width:48px;height:48px}.bars-container{bottom:12px;left:12px;transform:scale(.8);transform-origin:bottom left}}