*{margin:0;padding:0;box-sizing:border-box}html,body{overflow:hidden;width:100%;height:100%}body{position:relative;background-color:#000;color:#fff;font-family:Arial,sans-serif}canvas{position:fixed;top:0;left:0;outline:none}#app{position:relative;width:100%;height:100%;z-index:1}.ui-overlay{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:100}.ui-overlay h2{margin:0 0 5px}.ammo-display{position:absolute;bottom:20px;right:20px;background:#0009;padding:10px 15px;border-radius:5px;color:#fff;font-size:24px;font-weight:700}.ammo-separator{margin:0 5px;opacity:.7}.reload-indicator,.empty-mag-indicator,.no-ammo-indicator{position:absolute;bottom:80px;right:20px;background:#000c;padding:10px 15px;border-radius:5px;color:#fff;font-size:16px;transition:opacity .3s}.hidden{opacity:0;visibility:hidden}@keyframes blink{0%{opacity:1}50%{opacity:.5}to{opacity:1}}@keyframes pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.8}to{transform:scale(1);opacity:1}}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}// Add inventory container styles - positioned at the bottom of the screen .inventory-container{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background-color:#000000b3;border-radius:10px;padding:15px;text-align:center;width:300px;z-index:100}.inventory-container h3{margin-top:0;margin-bottom:10px;color:#fff;font-size:20px;font-weight:700}.weapon-slots{display:flex;flex-direction:row;gap:15px;justify-content:space-around;margin-bottom:12px}.weapon-slot{width:100%;height:90px;background:#0006;border:2px solid #444;border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:24px;color:#fff;position:relative}.weapon-slot.active{border-color:#fc0;box-shadow:0 0 10px #ffcc0080}.weapon-slot .key-hint{position:absolute;top:-15px;left:50%;transform:translate(-50%);background:#000000b3;padding:2px 6px;border-radius:3px;font-size:12px}.weapon-icon{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;padding:5px;transition:all .15s ease-in-out}.weapon-icon.selected{background-color:#5078ff4d;border-radius:3px;border:1px solid rgba(100,150,255,.5);box-shadow:0 0 10px #6496ff66 inset}.weapon-slot:before{content:attr(id);position:absolute;top:5px;right:5px;font-size:10px;color:#ccc;background-color:#0006;padding:2px 5px;border-radius:3px;z-index:2}.weapon-slot:nth-child(1):before{content:"1"}.weapon-slot:nth-child(2):before{content:"2"}.weapon-slot:nth-child(3):before{content:"3"}.weapon-image{width:90%;height:45px;margin-bottom:5px;display:flex;align-items:center;justify-content:center;background-color:#1e1e1e80;border-radius:4px;padding:2px}.weapon-image svg{width:100%;height:100%;filter:drop-shadow(0px 1px 2px rgba(0,0,0,.5))}.weapon-icon.selected .weapon-image{background-color:#3c64b433}.weapon-icon.selected .weapon-image svg{filter:drop-shadow(0px 0px 3px rgba(100,180,255,.7))}.weapon-name{font-size:14px;color:#fff;margin-bottom:2px;text-shadow:1px 1px 2px rgba(0,0,0,.8)}.weapon-ammo{font-size:14px;color:#fc0;font-weight:700;text-shadow:1px 1px 2px rgba(0,0,0,.8)}.inventory-tip{font-size:14px;color:#aaa;margin-top:5px}.health-container{position:absolute;top:20px;left:20px;display:flex;align-items:center;background:#0009;padding:10px;border-radius:5px}.health-bar{width:200px;height:20px;background:#0006;border:2px solid #444;border-radius:10px;overflow:hidden}.health-bar-fill{height:100%;width:100%;background-color:#4f4;transition:width .3s,background-color .3s}.health-value{margin-left:10px;font-size:18px;font-weight:700;color:#fff}.low-health .ui-overlay:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;box-shadow:inset 0 0 100px #ff000080;animation:pulse 1s infinite alternate}@keyframes pulse{0%{opacity:.3}to{opacity:.7}}.fps-counter{position:absolute;top:20px;right:20px;background:#0009;padding:5px 10px;border-radius:5px;color:#fff}.crosshair{position:fixed;pointer-events:none;color:#fff;font-size:24px;text-shadow:0 0 3px rgba(0,0,0,.8);z-index:9999;transform:translate(-50%,-50%);transform-origin:center;will-change:transform;top:0;left:0}