html{height:100%;box-sizing:border-box}body{font-family:sans-serif;margin:0;background-color:#111;color:#eee;width:100%;height:100%;min-height:100%;overflow:hidden}.screen{width:100%;box-sizing:border-box}#loading-screen,#login-screen{padding:20px;text-align:center;flex-grow:1;display:flex;flex-direction:column;justify-content:center;align-items:center}#login-form input,#login-form button{display:block;margin:10px auto;padding:8px;min-width:200px}#game-screen{padding:0;display:flex;flex-direction:column;flex-grow:1;overflow:hidden;width:100%;height:100%}header.game-header{flex-basis:auto;flex-shrink:0;padding:10px 15px;display:flex;justify-content:space-between;align-items:center;background-color:#0006;z-index:5}#canvas-viewport{flex-grow:1;flex-basis:0;width:100%;position:relative;display:flex;justify-content:center;align-items:center;background-color:#0c0c0c;overflow:hidden;min-height:200px}#game-ui{flex-basis:auto;padding:0 15px 10px;flex-shrink:0;text-align:center;position:relative;z-index:15}.spinner{border:4px solid #333;border-top:4px solid #fff;border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin:20px auto}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error-message{color:red;min-height:1.2em}.button-group{margin-top:15px}.instructions{margin-top:10px;font-size:.9em;color:#aaa;min-height:1.2em}.ui-alert{min-height:1.2em;margin-top:5px;margin-bottom:5px;font-weight:700;font-family:Roboto,sans-serif;transition:opacity .3s ease-in-out;color:#fc0}.ui-alert:empty{margin-top:0;margin-bottom:0;min-height:0}.ui-alert.success{color:#28a745}.ui-alert.error{color:#dc3545}#mobile-controls-layer{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:20;display:none}#joystick-area{position:absolute;bottom:20px;left:20px;width:150px;height:150px;pointer-events:auto;display:none!important}#joystick-base,#joystick-thumb{display:none!important}#action-buttons-area{position:absolute;bottom:20px;right:20px;display:flex;flex-direction:column;align-items:flex-end;gap:10px;pointer-events:auto}.mobile-action-button{width:60px;height:60px;border-radius:50%;background-color:#505050b3;color:#fff;border:2px solid rgba(120,120,120,.9);font-size:1em;font-weight:700;display:flex;justify-content:center;align-items:center;user-select:none;-webkit-user-select:none;touch-action:manipulation}.mobile-action-button:active{background-color:#787878cc}html{height:100vh;box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}body{font-family:sans-serif;margin:0;background-color:#111;color:#eee;width:100%;height:100vh;min-height:100vh;overflow:hidden}#app{width:100%;height:100%;background-color:#222;display:flex;flex-direction:column}#game-screen{padding:0;display:flex;flex-direction:column;flex-grow:1;overflow:hidden;width:100%}header.game-header{padding:10px 15px;display:flex;justify-content:space-between;align-items:center;flex-shrink:0;background-color:#0006;z-index:5}#canvas-viewport{flex-grow:1;flex-basis:0;width:100%;position:relative;display:flex;justify-content:center;align-items:center;background-color:#0c0c0c;overflow:hidden}#game-canvas{display:block;background-color:#080808;border:1px solid #444;max-width:100%;max-height:100%}#game-ui{padding:5px 15px;flex-shrink:0;width:100%;text-align:center;position:relative;z-index:15}#help-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000d9;z-index:2000;display:flex;justify-content:center;align-items:center}.modal-content{background:#222;border:2px solid #555;padding:20px;color:#eee;font-family:monospace;max-width:300px;text-align:center}.modal-content ul{list-style:none;padding:0;text-align:left}.modal-content li{margin-bottom:10px;border-bottom:1px solid #333;padding-bottom:5px}.modal-content button{margin-top:15px;padding:10px 20px;background:#444;color:#fff;border:none;cursor:pointer}.modal-content button:hover{background:#666}body,html{margin:0;padding:0;width:100%;height:100%;overflow:hidden;background:#000}#app{width:100%;height:100%;position:relative}#game-screen{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10}#editor-ui{position:absolute;top:0;left:0;width:100%;height:100%;z-index:20;pointer-events:none}#map-ui{position:absolute;top:0;left:0;width:100%;height:100%;z-index:30;background:#111}#asset-ui{position:absolute;top:0;left:0;width:100%;height:100%;z-index:35;background:#1a1a1a}#help-modal{position:absolute;top:0;left:0;width:100%;height:100%;z-index:40}#loading-screen{position:absolute;top:0;left:0;width:100%;height:100%;z-index:50;background:#222;color:#fff;display:flex;justify-content:center;align-items:center}canvas{display:block;outline:none}.tab-btn{background:transparent;border:none;color:#888;padding:10px 15px;cursor:pointer;font-weight:700;border-bottom:2px solid transparent}.tab-btn:hover{color:#fff}.tab-btn.active{color:#fff;border-bottom:2px solid #4af}.game-header{position:absolute;top:10px;left:10px;right:10px;display:flex;justify-content:space-between;color:#fff;font-family:monospace;pointer-events:none}.header-right button{pointer-events:auto}#ui-message-area{position:absolute;bottom:20%;width:100%;text-align:center;color:#ff0;font-family:monospace;font-size:1.2em;text-shadow:1px 1px 0 #000;pointer-events:none}