.haptic-indicator{color:#fff;z-index:1000;background:rgba(255,255,255,.2);-webkit-border-radius:50%;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:12px;transition:all .3s;display:flex;position:absolute;top:10px;right:10px}.haptic-indicator.active{background:rgba(0,255,140,.8);-ms-transform:scale(1.2);transform:scale(1.2);box-shadow:0 0 10px rgba(0,255,140,.5)}.touch-control-area{touch-action:none;user-select:none;-webkit-touch-callout:none;position:relative}.touch-feedback{pointer-events:none;z-index:1000;background:rgba(255,255,255,.3);-webkit-border-radius:50%;border-radius:50%;animation:.6s ease-out touchRipple;position:absolute;-ms-transform:scale(0);transform:scale(0)}@keyframes touchRipple{0%{opacity:1;-ms-transform:scale(0);transform:scale(0)}to{opacity:0;-ms-transform:scale(2);transform:scale(2)}}.enhanced-button{will-change:transform;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;-ms-transform:translateZ(0);transform:translateZ(0)}.enhanced-button:active{transition:-ms-transform .1s cubic-bezier(.4,0,.2,1),transform .1s cubic-bezier(.4,0,.2,1);-ms-transform:scale(.95)translateZ(0);transform:scale(.95)translateZ(0)}.enhanced-button:before{content:"";background:rgba(255,255,255,.3);-webkit-border-radius:50%;border-radius:50%;width:0;height:0;transition:width .3s,height .3s;position:absolute;top:50%;left:50%;-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.enhanced-button:active:before{width:300px;height:300px}.mobile-game-container{background:#000;flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.mobile-game-area{width:100%;height:100%;padding:env(safe-area-inset-top)env(safe-area-inset-right)env(safe-area-inset-bottom)env(safe-area-inset-left);flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative}.enhanced-joystick{backdrop-filter:blur(10px);background:rgba(255,255,255,.1);border:2px solid rgba(255,255,255,.3);-webkit-border-radius:50%;border-radius:50%;justify-content:center;align-items:center;width:120px;height:120px;transition:all .3s;display:flex;position:relative;box-shadow:0 8px 32px rgba(0,0,0,.3)}.enhanced-joystick.active{border-color:rgba(0,255,140,.8);-ms-transform:scale(1.05);transform:scale(1.05);box-shadow:0 8px 32px rgba(0,255,140,.3)}.enhanced-joystick-handle{cursor:grab;background:linear-gradient(135deg,#00ff8c,#00cc70);-webkit-border-radius:50%;border-radius:50%;width:40px;height:40px;transition:all .2s;box-shadow:0 4px 16px rgba(0,255,140,.4)}.enhanced-joystick-handle:active{cursor:grabbing;-ms-transform:scale(1.1);transform:scale(1.1)}.enhanced-swipe-area{z-index:10;touch-action:none;width:100%;height:100%;position:absolute;top:0;left:0}.swipe-indicator{color:#fff;opacity:0;pointer-events:none;z-index:1001;background:rgba(255,255,255,.2);border:2px solid rgba(255,255,255,.5);-webkit-border-radius:50%;border-radius:50%;justify-content:center;align-items:center;width:60px;height:60px;font-size:24px;transition:all .3s;display:flex;position:absolute;-ms-transform:scale(0);transform:scale(0)}.swipe-indicator.show{opacity:1;-ms-transform:scale(1);transform:scale(1)}.swipe-indicator.direction-up:before{content:"↑"}.swipe-indicator.direction-down:before{content:"↓"}.swipe-indicator.direction-left:before{content:"←"}.swipe-indicator.direction-right:before{content:"→"}.game-canvas{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;image-rendering:pixelated;will-change:transform;-ms-transform:translateZ(0);transform:translateZ(0)}.hardware-accelerated{will-change:transform;backface-visibility:hidden;perspective:1000px;-ms-transform:translateZ(0);transform:translateZ(0)}@media (max-width:480px){.enhanced-joystick{width:100px;height:100px}.enhanced-joystick-handle{width:35px;height:35px}.swipe-indicator{width:50px;height:50px;font-size:20px}}@media (max-width:375px){.enhanced-joystick{width:90px;height:90px}.enhanced-joystick-handle{width:30px;height:30px}.swipe-indicator{width:45px;height:45px;font-size:18px}}@media (orientation:landscape) and (max-height:500px){.mobile-game-area{flex-direction:row;padding:10px}.enhanced-joystick{width:80px;height:80px;margin:0 10px}.enhanced-joystick-handle{width:25px;height:25px}}@media (prefers-reduced-motion:reduce){.enhanced-button,.enhanced-joystick,.swipe-indicator,.touch-feedback{transition:none;animation:none}}@media (prefers-color-scheme:dark){.enhanced-joystick{background:rgba(0,0,0,.3);border-color:rgba(255,255,255,.4)}}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){.game-canvas{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}}@media (prefers-reduced-motion:reduce){.enhanced-button:before{display:none}.touch-feedback{display:none}}@media (hover:none) and (pointer:coarse){.enhanced-button{min-width:44px;min-height:44px}.enhanced-joystick{min-width:100px;min-height:100px}}.snake-game-enhanced{background:linear-gradient(135deg,#1a1a1a,#2a1a1a)}.tetris-game-enhanced{background:linear-gradient(135deg,#1a1a1a,#2a2a1a)}.pong-game-enhanced{background:linear-gradient(135deg,#1a1a2a,#2a1a2a)}.game-loading{border:3px solid rgba(255,255,255,.1);border-top-color:#00ff8c;-webkit-border-radius:50%;border-radius:50%;width:60px;height:60px;animation:1s linear infinite spin;position:absolute;top:50%;left:50%;-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}@keyframes spin{0%{-ms-transform:translate(-50%,-50%)rotate(0);transform:translate(-50%,-50%)rotate(0)}to{-ms-transform:translate(-50%,-50%)rotate(360deg);transform:translate(-50%,-50%)rotate(360deg)}}