html,body{height:100%;margin:0;overflow:hidden;background-color:#000;font-family:Arial,sans-serif}canvas{display:block}#info{position:absolute;top:10px;width:100%;text-align:center;z-index:100;display:block;color:#fff;background-color:#0000004d;padding:5px 0}#loading{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:1000;color:#fff;transition:opacity 1s ease-in-out}.loading-text{font-size:24px;margin-bottom:20px;color:#49f;text-transform:uppercase;letter-spacing:2px}.loading-bar{width:300px;height:10px;background-color:#fff3;border-radius:5px;overflow:hidden}.loading-progress{height:100%;width:0%;background:linear-gradient(to right,#49f,#a4f);transition:width .3s ease}.level-surface{background-color:#7db6d5}.level-underwater{background-color:#0a4a80}.level-cave{background-color:#000}.level-cosmic{background-color:#102}.low-oxygen{animation:pulse 1s infinite alternate}@keyframes pulse{0%{box-shadow:0 0 5px #ff000080}to{box-shadow:0 0 20px #f00c}}.loading-spinner{border:4px solid rgba(255,255,255,.3);border-radius:50%;border-top:4px solid #4499ff;width:50px;height:50px;animation:spin 1s linear infinite;margin-bottom:20px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}