*{margin:0;padding:0;box-sizing:border-box}body{background:linear-gradient(180deg,#000,#030304);font-family:Courier New,monospace;color:#fff;overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.game-container{width:100vw;height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:.5vh 0}.canvas-wrapper{position:relative;width:100%;flex-grow:1;display:flex;align-items:center;justify-content:center;min-height:0;background:linear-gradient(180deg,#071026,#04040a);padding:2vh;border-radius:8px;box-sizing:border-box}#gameCanvas{display:block;width:auto;height:100%;aspect-ratio:28 / 31;max-width:100%;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;position:relative;z-index:3;background:transparent;box-shadow:0 8px 30px #02060ccc,inset 0 0 0 1px #ffffff05;border-radius:4px}.game-info{width:100%;display:flex;justify-content:center;gap:2vh;font-size:2vh;font-weight:700;text-shadow:1px 1px 3px rgba(0,0,0,.9);padding-bottom:.8vh;flex-shrink:0;z-index:30}.score{color:#ff0}.lives{color:#ff6b6b}.level{color:#4ecdc4}.controls{width:100%;display:flex;justify-content:center;gap:1.2vh;padding-top:.6vh;flex-shrink:0;z-index:30}.controls button{padding:.8vh 1.6vh;font-size:1.6vh;font-weight:700;border:1px solid rgba(255,255,255,.85);background:#3c3c3cb8;color:#fff;cursor:pointer;border-radius:4px;transition:transform .12s ease,box-shadow .12s ease;white-space:nowrap;min-width:110px}.controls button:hover{background:#555555f2;transform:translateY(-1px) scale(1.01)}.controls button:disabled{opacity:.45;cursor:not-allowed;transform:none}.connection-status{position:absolute;top:2vh;left:50%;transform:translate(-50%);padding:.5vh 1vh;border-radius:3px;font-weight:700;font-size:1.8vh;z-index:40}.connected{background:#2d5a2d;color:#90ee90}.disconnected{background:#5a2d2d;color:#ff6b6b}.connecting{background:#5a5a2d;color:#ffff90}.start-screen,.game-over{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;background:#000000fa;padding:2vh 3vh;border-radius:8px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;width:88%;max-width:360px;box-shadow:0 6px 24px #000000d9}.start-screen{border:2px solid #ffff00;display:block}.start-screen h1{color:#ff0;font-size:4.5vh;margin-bottom:1.2vh;text-shadow:2px 2px 0px #000,0 0 8px #ffff00}.start-screen p{margin-bottom:1.2vh;font-size:1.8vh;line-height:1.35}.game-over{border:2px solid #ff6b6b}.game-over h2{color:#ff6b6b;font-size:4vh;margin-bottom:1.2vh;text-shadow:2px 2px 0px #000,0 0 8px #ff6b6b}.game-over p{font-size:2.4vh;margin-bottom:1.2vh}.start-screen button,.game-over button{padding:1vh 2vh;font-size:2vh;font-weight:700;border:1px solid rgba(255,255,255,.95);background:#515151e6;color:#fff;cursor:pointer;border-radius:5px;transition:transform .14s ease,box-shadow .14s ease;margin-top:.8vh;min-width:130px}.start-screen button:hover,.game-over button:hover{background:#555555fa;transform:scale(1.03);box-shadow:0 0 12px #ffffff2e}.start-screen button:active,.game-over button:active{transform:scale(.99)}@media (max-width: 600px){.canvas-wrapper{padding:1.2vh}.start-screen,.game-over{width:95%;padding:1.5vh 2vh}.start-screen h1{font-size:4vh}.start-screen p{font-size:1.8vh}.game-over h2{font-size:3.6vh}.controls button{min-width:100px;padding:.9vh 1.2vh;font-size:2vh}}