html,body{width:100%;height:100%;margin:0;padding:0;overflow:hidden;position:fixed;touch-action:none;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-user-select:none;user-select:none}body{background-color:#000;display:flex;flex-direction:column;align-items:center;justify-content:center}#main{width:100%;height:100%;display:flex;justify-content:center;align-items:center}#mainCanvas{max-width:100%;max-height:100%;object-fit:contain}.touch-controls{position:absolute;bottom:0;left:0;width:100%;display:flex;justify-content:space-between;padding:10px;z-index:1000}.controls-section{display:flex;flex-direction:column}.controls-row{display:flex;margin-bottom:10px}.touch-controls button{width:60px;height:60px;margin:5px;border-radius:50%;background-color:#00000080;color:#fff;font-size:24px;border:2px solid rgba(255,255,255,.3);display:flex;justify-content:center;align-items:center;touch-action:manipulation;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.joystick-container{position:relative;width:150px;height:150px;background-color:#0000004d;border-radius:50%;border:2px solid rgba(255,255,255,.2)}.joystick{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;background-color:#fffc;border-radius:50%;border:2px solid rgba(255,255,255,.5)}.action-buttons{display:flex;flex-direction:column}.orientation-warning{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000e6;color:#fff;display:flex;justify-content:center;align-items:center;text-align:center;z-index:2000;font-family:"Press Start 2P",sans-serif}.install-prompt{position:fixed;top:10px;left:50%;transform:translate(-50%);background-color:#000c;color:#fff;padding:10px 15px;border-radius:20px;font-size:14px;z-index:1001;max-width:80%;text-align:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.3);animation:fadeIn .5s ease-in-out;font-family:"Press Start 2P",sans-serif}.install-prompt button{background-color:#4caf50;border:none;color:#fff;padding:5px 10px;border-radius:15px;margin-left:10px;cursor:pointer;font-family:"Press Start 2P",sans-serif;font-size:12px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (min-width: 768px){.touch-controls{display:none}}@supports (-webkit-touch-callout: none){body{position:fixed;overflow:hidden;width:100%;height:100vh;height:-webkit-fill-available}}:root{--background-color: #000;--border-color: #222;--highlight-color: #ffcc00}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden;touch-action:none}body{background:#000 no-repeat center center fixed;background-size:cover;display:flex;align-items:center;justify-content:center;flex-direction:column;font-family:Arial,sans-serif;color:#fff;text-align:center;margin:0;padding:0}#main{position:relative;width:100vw;height:100vh;margin:0 auto}canvas{position:absolute;top:0;left:0;width:100%;height:100%;touch-action:none;-webkit-tap-highlight-color:transparent}.touch-controls{display:none;position:fixed;bottom:0;left:0;width:100%;padding:10px;background:#000000b3;z-index:100;flex-direction:column}.touch-controls button{background:#fff3;border:2px solid var(--highlight-color);border-radius:50%;color:var(--highlight-color);margin:0 10px;width:50px;height:50px;font-size:20px;display:flex;align-items:center;justify-content:center;outline:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.touch-controls button:active{background:#fff6;animation:buttonPress .2s ease}.touch-controls .controls-row{display:flex;justify-content:center;margin-bottom:10px}.touch-controls .controls-row:last-child{margin-bottom:0}.touch-controls .joystick-container{position:relative;width:120px;height:120px;background:#00000080;border:1px solid rgba(255,255,255,.2);border-radius:50%;margin:0 auto}.touch-controls .joystick-container .joystick{position:absolute;width:50px;height:50px;background:var(--highlight-color);border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 10px #ffffff4d}.touch-controls .action-buttons{display:flex;justify-content:space-around;margin-top:15px}.game-info{position:absolute;top:10px;right:10px;background:#000000b3;padding:10px;border-radius:5px;font-size:12px;text-align:right;z-index:90}.game-info p{margin:5px 0}@media (max-width: 820px){#main{width:95%;height:100vh}}@media (max-width: 576px),(max-height: 700px){.touch-controls{display:flex;flex-direction:column}body{padding-bottom:70px}}@media (orientation: portrait){#main{width:100vw;height:100vh}canvas{width:100%;height:100%}}@media (max-height: 450px) and (orientation: landscape){.orientation-warning{display:flex;position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;z-index:1000;align-items:center;justify-content:center;color:var(--highlight-color);text-align:center;padding:20px}}@keyframes buttonPress{0%{transform:scale(1)}50%{transform:scale(.95)}to{transform:scale(1)}}
