*{box-sizing:border-box}.bangkok-game{width:100%;height:100vh;height:100dvh;position:relative;overflow:hidden;background:linear-gradient(135deg,#ff6b35,#f7931e,#ffd23f);font-family:Arial,sans-serif;-webkit-user-select:none;user-select:none;touch-action:manipulation}.menu-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:20px;text-align:center;background:linear-gradient(135deg,#ff6b35,#f7931e);background-image:url(https://im.runware.ai/image/ws/2/ii/671a87c5-fdf2-4a41-b1fe-8a47e659cdf2.png);background-size:cover;background-position:center;background-blend-mode:overlay}.game-title{background:#fffffff2;padding:2rem;border-radius:20px;box-shadow:0 10px 30px #0000004d;margin-bottom:2rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.game-title h1{font-size:clamp(2rem,8vw,3.5rem);color:#d32f2f;margin:0 0 1rem;text-shadow:2px 2px 4px rgba(0,0,0,.1)}.game-title p{font-size:clamp(1rem,4vw,1.25rem);color:#555;margin:0 0 1.5rem}.instructions{text-align:left;font-size:clamp(.875rem,3vw,1rem);color:#666;line-height:1.6}.instructions p{margin:.5rem 0}.start-btn{background:linear-gradient(45deg,#4caf50,#45a049);color:#fff;border:none;padding:1rem 2rem;font-size:clamp(1.125rem,4vw,1.25rem);font-weight:700;border-radius:50px;cursor:pointer;transition:transform .2s,box-shadow .2s;min-height:48px;min-width:160px;box-shadow:0 4px 15px #4caf5066}.start-btn:hover,.start-btn:active{transform:translateY(-2px);box-shadow:0 6px 20px #4caf5099}.game-screen{height:100%;display:flex;flex-direction:column;background:linear-gradient(180deg,#87ceeb,#98fb98);position:relative}.game-ui{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:#000c;color:#fff;font-weight:700;font-size:clamp(.875rem,3vw,1rem);flex-shrink:0;padding-top:calc(1rem + env(safe-area-inset-top,0))}.score,.lives,.speed{background:#fff3;padding:.5rem 1rem;border-radius:20px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.game-area{flex:1;position:relative;background:linear-gradient(180deg,#4a90e2,#357abd,#2c5f8a);overflow:hidden;cursor:none;background-image:url(https://im.runware.ai/image/ws/2/ii/671a87c5-fdf2-4a41-b1fe-8a47e659cdf2.png);background-size:cover;background-position:center;background-blend-mode:multiply}.road-lines{position:absolute;width:100%;height:100%;pointer-events:none}.line{position:absolute;width:4px;height:60px;background:gold;left:25%;animation:roadMove 1s linear infinite;opacity:.8}.line:nth-child(2){left:50%;animation-delay:-.33s}.line:nth-child(3){left:75%;animation-delay:-.66s}@keyframes roadMove{0%{transform:translateY(-100vh);opacity:0}10%{opacity:1}90%{opacity:1}to{transform:translateY(100vh);opacity:0}}.tuk-tuk{position:absolute;bottom:10%;font-size:clamp(2rem,8vw,3rem);transform:translate(-50%);transition:left .15s ease-out;z-index:10;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3));cursor:pointer}.tuk-tuk.moving{animation:bounce .2s ease-out}@keyframes bounce{50%{transform:translate(-50%) scale(1.1) rotate(2deg)}}.obstacle{position:absolute;font-size:clamp(1.5rem,6vw,2.5rem);transform:translate(-50%);z-index:5;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3));animation:wobble .5s ease-in-out infinite alternate}@keyframes wobble{0%{transform:translate(-50%) rotate(-1deg)}to{transform:translate(-50%) rotate(1deg)}}.temple{position:absolute;font-size:clamp(1.5rem,6vw,2.5rem);transform:translate(-50%);z-index:5;filter:drop-shadow(0 2px 4px rgba(255,215,0,.6));animation:glow 1s ease-in-out infinite alternate}@keyframes glow{0%{transform:translate(-50%) scale(1);filter:drop-shadow(0 2px 4px rgba(255,215,0,.6))}to{transform:translate(-50%) scale(1.1);filter:drop-shadow(0 4px 8px rgba(255,215,0,.9))}}.game-over-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:2rem;text-align:center;background:linear-gradient(135deg,#ff5722,#ff8a65);color:#fff}.game-over-screen h2{font-size:clamp(2rem,8vw,3rem);margin:0 0 1rem;text-shadow:2px 2px 4px rgba(0,0,0,.5)}.final-score{font-size:clamp(1.5rem,6vw,2rem);font-weight:700;margin:1rem 0;background:#fff3;padding:1rem 2rem;border-radius:20px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.game-over-message{font-size:clamp(1rem,4vw,1.25rem);margin:1rem 0 2rem;opacity:.9}.game-over-buttons{display:flex;flex-direction:column;gap:1rem;width:100%;max-width:300px}.play-again-btn,.menu-btn{padding:1rem 2rem;font-size:clamp(1rem,4vw,1.125rem);font-weight:700;border:none;border-radius:50px;cursor:pointer;transition:transform .2s,box-shadow .2s;min-height:48px;width:100%}.play-again-btn{background:linear-gradient(45deg,#4caf50,#45a049);color:#fff;box-shadow:0 4px 15px #4caf5066}.menu-btn{background:linear-gradient(45deg,#2196f3,#1976d2);color:#fff;box-shadow:0 4px 15px #2196f366}.play-again-btn:hover,.play-again-btn:active,.menu-btn:hover,.menu-btn:active{transform:translateY(-2px)}.play-again-btn:hover,.play-again-btn:active{box-shadow:0 6px 20px #4caf5099}.menu-btn:hover,.menu-btn:active{box-shadow:0 6px 20px #2196f399}@media (min-width: 768px){.game-ui{padding:1.5rem;font-size:1.125rem}.game-title{padding:3rem}.instructions{font-size:1.125rem}.game-over-buttons{flex-direction:row;max-width:400px}}@media (max-width: 767px){.game-area{touch-action:none}.tuk-tuk{font-size:3rem;bottom:15%}.obstacle,.temple{font-size:2.5rem}}.bangkok-game *{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.game-ui{padding-top:calc(1rem + env(safe-area-inset-top,0));padding-left:calc(1rem + env(safe-area-inset-left,0));padding-right:calc(1rem + env(safe-area-inset-right,0))}@media (orientation: landscape) and (max-height: 500px){.game-title{padding:1rem;margin-bottom:1rem}.game-title h1{font-size:2rem}.instructions{font-size:.875rem}.start-btn,.play-again-btn,.menu-btn{padding:.75rem 1.5rem;font-size:1rem}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{font-family:Segoe UI,Arial,sans-serif;line-height:1.5;font-weight:400;font-size:16px;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;padding:0;min-width:320px;min-height:100vh;min-height:100dvh;overflow:hidden;position:fixed;width:100%;height:100%;overscroll-behavior:none;-webkit-overflow-scrolling:touch;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}#root{width:100%;height:100%;position:relative;overflow:hidden}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2;margin:0}p{margin:0;line-height:1.6}button{border:none;background:none;cursor:pointer;font-family:inherit;font-size:inherit;outline:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}button:focus-visible{outline:2px solid #4285f4;outline-offset:2px}a{color:inherit;text-decoration:none;touch-action:manipulation}img{max-width:100%;height:auto;display:block}input,textarea,select{font-family:inherit;font-size:16px;border:none;outline:none;background:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}input:focus,textarea:focus,select:focus,button:focus{outline:none}body,#root{position:fixed;overflow:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior:none}*{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-perspective:1000;perspective:1000}::-webkit-scrollbar{display:none;width:0;height:0}*{-ms-overflow-style:none;scrollbar-width:none}@supports (padding: env(safe-area-inset-top)){.safe-area-top{padding-top:env(safe-area-inset-top)}.safe-area-bottom{padding-bottom:env(safe-area-inset-bottom)}.safe-area-left{padding-left:env(safe-area-inset-left)}.safe-area-right{padding-right:env(safe-area-inset-right)}}.bangkok-game,.bangkok-game *{-webkit-transform:translate3d(0,0,0);transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-perspective:1000;perspective:1000}.game-area,.tuk-tuk,.obstacle,.temple{will-change:transform;contain:layout style paint}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){*{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transform:none!important}.road-lines .line,.tuk-tuk.moving,.obstacle,.temple{animation:none!important}}@media (prefers-color-scheme: dark){:root{color-scheme:dark}}@media print{.bangkok-game{display:none}}
