@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap";:root{--primary: #ff5e3a;--secondary: #00d2ff;--bg-color: #0b0f19;--panel-bg: rgba(20, 25, 40, .65);--text-main: #f8fafc;--radius: 16px;--glow-fire: 0 0 20px rgba(255, 94, 58, .5);--glow-water: 0 0 20px rgba(0, 210, 255, .5)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,-apple-system,sans-serif;background-color:var(--bg-color);background-image:radial-gradient(circle at 15% 50%,rgba(255,94,58,.08),transparent 25%),radial-gradient(circle at 85% 30%,rgba(0,210,255,.08),transparent 25%);color:var(--text-main);display:flex;justify-content:center;align-items:center;min-height:100vh;overflow:hidden;touch-action:none}.game-container{display:flex;flex-direction:column;align-items:center;gap:24px;width:100%;max-width:1100px;padding:24px;transition:all .3s ease}.header{display:flex;justify-content:space-between;align-items:center;width:100%;padding:20px 32px;background:var(--panel-bg);border-radius:var(--radius);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.08);box-shadow:0 8px 32px #0000004d}.header h1{font-size:1.8rem;font-weight:800;letter-spacing:-.5px;background:linear-gradient(135deg,#fff,#cbd5e1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 2px 10px rgba(255,255,255,.1);margin:0}.controls{display:flex;gap:16px}.switch-btn{padding:12px 24px;border:1px solid rgba(255,255,255,.1);border-radius:30px;font-weight:600;font-size:.95rem;font-family:Inter,sans-serif;cursor:pointer;transition:all .3s cubic-bezier(.25,1,.5,1);background:#ffffff08;color:#94a3b8;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.switch-btn:hover{background:#ffffff14;color:#fff;transform:translateY(-2px)}.active-firegirl{background:linear-gradient(135deg,#ff7e5f,var(--primary));color:#fff;border-color:#fff3;box-shadow:var(--glow-fire)}.active-firegirl:hover{background:linear-gradient(135deg,#ff9279,#ff7253);box-shadow:0 0 25px #ff5e3ab3}.active-waterboy{background:linear-gradient(135deg,#2193b0,var(--secondary));color:#fff;border-color:#fff3;box-shadow:var(--glow-water)}.active-waterboy:hover{background:linear-gradient(135deg,#37a8c5,#22e3ff);box-shadow:0 0 25px #00d2ffb3}.canvas-wrapper{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:0 20px 50px #0009,0 0 0 1px #ffffff0d;background:#000;width:100%;aspect-ratio:1024 / 568;max-width:1024px;max-height:calc(100vh - 200px);display:flex;justify-content:center;align-items:center}.canvas-wrapper:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--radius);border:1px solid rgba(255,255,255,.08);pointer-events:none}.game-canvas{width:100%;height:100%;object-fit:contain;display:block;transition:filter .5s ease-in-out,opacity .5s ease-in-out}.canvas-dimmed{filter:blur(4px);opacity:.5}.overlay-msg{position:absolute;top:0;right:0;bottom:0;left:0;background:#0b0f19d9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;justify-content:center;align-items:center;font-size:2.5rem;font-weight:800;color:#fff;text-transform:uppercase;letter-spacing:2px;text-shadow:0 4px 20px rgba(255,255,255,.3);z-index:10;animation:fadeIn .4s cubic-bezier(.16,1,.3,1)}.loading-overlay{flex-direction:column;gap:24px}.spinner{width:50px;height:50px;border:4px solid rgba(255,255,255,.1);border-left-color:var(--primary);border-right-color:var(--secondary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.mobile-controls{display:none;width:100%;justify-content:space-between;align-items:flex-end;padding:12px 24px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));margin-top:auto}.dpad{display:flex;gap:20px}.ctrl-btn{width:80px;height:80px;border-radius:50%;background:#ffffff0f;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.12);color:#ffffffb3;font-size:28px;display:flex;justify-content:center;align-items:center;-webkit-user-select:none;user-select:none;touch-action:none;-webkit-tap-highlight-color:transparent;transition:all .08s ease-out;box-shadow:0 4px 15px #0000004d}.ctrl-btn:active{transform:scale(.88)}.ctrl-left:active{background:#ff5e3a40;border-color:var(--primary);box-shadow:var(--glow-fire);color:#fff}.ctrl-right:active{background:#00d2ff40;border-color:var(--secondary);box-shadow:var(--glow-water);color:#fff}.jump-btn{width:90px;height:90px;font-size:32px;background:#ffffff14;border:2px solid rgba(255,255,255,.18)}.jump-btn:active{background:linear-gradient(135deg,#ff5e3a4d,#00d2ff4d);border-color:#ffffff80;box-shadow:0 0 25px #ffffff4d;color:#fff}.action{display:flex;align-items:flex-end}.fullscreen-btn{padding:12px 16px!important;font-size:1.2rem!important;min-width:unset}.ios-prompt-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#000000b3;display:flex;justify-content:center;align-items:center;padding:24px;animation:fadeIn .3s ease}.ios-prompt{background:var(--panel-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius);padding:32px;max-width:360px;text-align:left;box-shadow:0 20px 60px #00000080}.ios-prompt h2{font-size:1.4rem;margin-bottom:12px;background:linear-gradient(135deg,var(--primary),var(--secondary));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ios-prompt p{font-size:.9rem;color:#ffffffb3;margin-bottom:16px;line-height:1.5}.ios-prompt ol{padding-left:20px;margin-bottom:24px}.ios-prompt li{font-size:.9rem;color:#fffc;line-height:1.8}.ios-prompt button{width:100%;text-align:center}.settings-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:150;background:#000000b3;display:flex;justify-content:center;align-items:center;padding:24px;animation:fadeIn .3s ease}.settings-panel{background:var(--panel-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius);padding:32px;max-width:380px;width:100%;box-shadow:0 20px 60px #00000080}.settings-panel h2{font-size:1.4rem;margin-bottom:24px;text-align:center}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.06)}.setting-row label{font-size:.95rem;font-weight:600;color:#fffc;white-space:nowrap}.volume-slider{flex:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:6px;border-radius:3px;background:#ffffff1a;outline:none}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--secondary));cursor:pointer;box-shadow:0 0 10px #ff5e3a66}.volume-value{font-size:.85rem;color:#ffffff80;min-width:40px;text-align:right;font-family:monospace}.setting-toggle{padding:6px 18px;border-radius:20px;border:1px solid rgba(255,255,255,.15);background:#ffffff0d;color:#ffffff80;font-weight:600;font-size:.8rem;font-family:Inter,sans-serif;cursor:pointer;transition:all .2s}.setting-toggle.toggle-on{background:linear-gradient(135deg,#ff5e3a4d,#00d2ff4d);border-color:#ffffff4d;color:#fff}.rotate-prompt{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#0b0f19f2;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:24px;text-align:center;padding:32px;color:#fff}.rotate-icon{font-size:64px;animation:rotateHint 2s ease-in-out infinite}@keyframes rotateHint{0%,to{transform:rotate(0)}25%{transform:rotate(-90deg)}75%{transform:rotate(-90deg)}}.rotate-prompt span{font-size:1.2rem;font-weight:600;color:#fffc;max-width:280px}@media (max-width: 768px){.header{flex-direction:column;gap:12px;padding:12px 16px;padding-top:calc(12px + env(safe-area-inset-top,0px));border-radius:0 0 var(--radius) var(--radius)}.header h1{font-size:1.3rem}.controls{gap:8px}.switch-btn{padding:8px 14px;font-size:.8rem}.game-container{padding:0;gap:8px;justify-content:flex-start}.canvas-wrapper{border-radius:0;border-left:none;border-right:none;max-height:50vh}.mobile-controls{display:flex}}@media (max-height: 500px) and (orientation: landscape){.header{flex-direction:row;padding:6px 16px;padding-left:calc(16px + env(safe-area-inset-left,0px));padding-right:calc(16px + env(safe-area-inset-right,0px))}.header h1{font-size:1rem}.switch-btn{padding:6px 12px;font-size:.75rem}.game-container{gap:4px}.canvas-wrapper{max-height:calc(100vh - 120px)}.mobile-controls{padding:4px 24px;padding-bottom:calc(4px + env(safe-area-inset-bottom,0px));padding-left:calc(24px + env(safe-area-inset-left,0px));padding-right:calc(24px + env(safe-area-inset-right,0px))}.ctrl-btn{width:60px;height:60px;font-size:22px}.jump-btn{width:68px;height:68px;font-size:26px}}.build-info{position:fixed;bottom:8px;right:16px;font-size:.7rem;color:#fff3;pointer-events:none;font-family:monospace}