:root{--sky: #8fd0ff}*{box-sizing:border-box;margin:0;padding:0}[hidden]{display:none!important}html,body,#app{width:100%;height:100%;overflow:hidden;background:var(--sky);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:none}#scene{display:block;width:100%;height:100%}#minimap{position:absolute;top:12px;left:12px;width:100px;height:100px;border-radius:50%;border:2px solid rgba(0,0,0,.45);box-shadow:0 0 6px #00000059;background:#8aad6a;z-index:10}#start-screen{position:fixed;inset:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(12px,3vh,48px);padding:max(12px,env(safe-area-inset-top)) 24px max(12px,env(safe-area-inset-bottom));background:linear-gradient(180deg,#8fd0ff,#bfe9ff 45%,#9ed67a);transition:background .6s ease,opacity .5s ease}#start-screen.world-ready{background:linear-gradient(180deg,#8fd0ff,#bfe9ff 45%,#9ed67a)}#start-screen.hidden{opacity:0;pointer-events:none}#title{text-align:center;line-height:.92;display:flex;flex-direction:column;align-items:center;gap:clamp(2px,1vh,14px)}.title-small{font-size:clamp(14px,min(6vw,4.5vh),56px);font-weight:800;letter-spacing:.06em;color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.18),0 6px 18px rgba(0,0,0,.28)}.title-big{font-size:clamp(54px,min(28vw,24vh),300px);font-weight:900;letter-spacing:.02em;-webkit-text-stroke:.07em #fff;paint-order:stroke fill;filter:drop-shadow(0 10px 14px rgba(0,0,0,.35));transform-origin:center 62%;animation:title-breathe 3.4s ease-in-out infinite}.title-big .l{display:inline-block;animation:title-wave 5.6s ease-in-out infinite}.title-big .j{color:#ff4d4d;animation-delay:0s}.title-big .e{color:#ffc21f;animation-delay:.1s}.title-big .a{color:#3fc16a;animation-delay:.2s}.title-big .n{color:#3aa0ff;animation-delay:.3s}@keyframes title-breathe{0%,to{transform:scale(1)}50%{transform:scale(1.055)}}@keyframes title-wave{0%,60%,to{transform:translateY(0)}72%{transform:translateY(-.13em)}84%{transform:translateY(.02em)}92%{transform:translateY(0)}}@media (prefers-reduced-motion: reduce){.title-big,.title-big .l{animation:none}}@media (max-height: 480px){.title-small{display:none}}#start-loading{display:flex;flex-direction:column;align-items:center;gap:clamp(10px,2vh,16px);width:min(86vw,320px)}#load-bar{width:100%;height:clamp(14px,2.4vh,20px);border-radius:999px;background:#ffffff40;box-shadow:inset 0 2px 5px #00000047;overflow:hidden}#load-fill{width:0%;height:100%;border-radius:999px;background:linear-gradient(90deg,#2fae5a,#6fe39a);box-shadow:0 0 10px #6fe39ab3;transition:width .35s ease-out}#load-label{margin:0;color:#fff;font-size:clamp(15px,3vh,20px);font-weight:800;text-shadow:0 2px 6px rgba(0,0,0,.4)}@media (prefers-reduced-motion: reduce){#load-fill{transition:none}}#start-mode{display:flex;flex-direction:column;align-items:stretch;gap:clamp(12px,2.4vh,20px);width:min(86vw,320px)}#mode-solo,#mode-multi{padding:clamp(14px,2.6vh,22px) clamp(20px,6vw,36px);font-size:clamp(20px,min(5.5vw,3.6vh),30px);font-weight:900;border:none;border-radius:999px;color:#fff;cursor:pointer;box-shadow:0 6px 18px #00000052}#mode-solo{background:#2fae5a}#mode-multi{background:#3aa0ff}#mode-solo:active,#mode-multi:active{transform:translateY(2px)}#start-connecting{display:flex;flex-direction:column;align-items:center;gap:clamp(10px,2vh,18px);color:#fff;font-size:clamp(18px,3.4vh,24px);font-weight:800;text-shadow:0 2px 6px rgba(0,0,0,.4)}#start-connecting .spinner{width:44px;height:44px;border-radius:50%;border:5px solid rgba(255,255,255,.4);border-top-color:#fff;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){#start-connecting .spinner{animation:none}}#start-error{display:flex;flex-direction:column;align-items:center;gap:clamp(12px,2.4vh,20px)}#start-error .error-msg{color:#fff;font-size:clamp(18px,3.6vh,26px);font-weight:800;text-shadow:0 2px 6px rgba(0,0,0,.4);text-align:center}#start-error .error-actions{display:flex;gap:clamp(10px,2vw,16px);flex-wrap:wrap;justify-content:center}#error-retry,#error-back{padding:clamp(10px,2vh,14px) clamp(20px,5vw,30px);font-size:clamp(16px,4vw,20px);font-weight:800;border:none;border-radius:999px;cursor:pointer;box-shadow:0 4px 14px #00000047}#error-retry{background:#2fae5a;color:#fff}#error-back{background:#ffffffeb;color:#234}#error-retry:active,#error-back:active{transform:translateY(2px)}#start-screen button:focus-visible{outline:4px solid #fff;outline-offset:3px}#start-controls{display:flex;flex-direction:column;align-items:center;gap:clamp(8px,1.6vh,16px)}#start-form{display:flex;flex-direction:column;align-items:center;gap:clamp(8px,1.6vh,14px)}#name-input{width:180px;padding:clamp(8px,1.4vh,12px) 16px;font-size:16px;text-align:center;border:none;border-radius:999px;background:#ffffffeb;color:#234;box-shadow:0 2px 8px #0003}#quality-button{align-self:center;margin-top:clamp(2px,1vh,8px);padding:clamp(8px,1.4vh,12px) 18px;font-size:16px;font-weight:700;border:none;border-radius:999px;background:#ffffffeb;color:#234;cursor:pointer;box-shadow:0 2px 8px #0003;white-space:nowrap}#quality-button:active{transform:translateY(1px)}#play-button{padding:clamp(10px,2vh,16px) clamp(36px,8vw,56px);font-size:clamp(18px,min(5vw,3.4vh),30px);font-weight:900;border:none;border-radius:999px;background:#2fae5a;color:#fff;cursor:pointer;box-shadow:0 6px 18px #00000052}#play-button:active{transform:translateY(2px)}#play-button:disabled{background:#ffffff8c;color:#14281e99;cursor:default;box-shadow:0 2px 8px #0000002e}#avatar-stage{display:flex;align-items:center;gap:6px}#avatar-canvas{height:clamp(130px,24vh,220px);aspect-ratio:18 / 22;width:auto;touch-action:none}#avatar-prev,#avatar-next{width:54px;height:54px;font-size:36px;line-height:1;font-weight:700;border:none;border-radius:999px;background:#ffffffd9;color:#234;cursor:pointer;box-shadow:0 2px 8px #0003;display:flex;align-items:center;justify-content:center}#avatar-prev:active,#avatar-next:active{transform:translateY(1px)}#avatar-name{min-height:clamp(22px,4vh,30px);font-size:clamp(16px,3.4vh,22px);font-weight:800;color:#fff;text-shadow:0 2px 6px rgba(0,0,0,.4)}#avatar-name.taken{color:#ffd2d2}#avatar-name .taken-tag{font-size:14px;font-weight:700;opacity:.9;margin-left:8px}#touch-ui{position:fixed;inset:0;z-index:5;pointer-events:none}#joystick{position:absolute;left:max(24px,env(safe-area-inset-left));bottom:max(24px,env(safe-area-inset-bottom));width:140px;height:140px;border-radius:50%;background:#ffffff40;border:2px solid rgba(255,255,255,.5);pointer-events:auto;touch-action:none}#joystick-knob{position:absolute;left:50%;top:50%;width:60px;height:60px;margin:-30px 0 0 -30px;border-radius:50%;background:#ffffffb3;box-shadow:0 2px 6px #0003}#car-dpad{position:absolute;left:max(20px,env(safe-area-inset-left));bottom:max(20px,env(safe-area-inset-bottom));width:168px;height:168px;pointer-events:auto;touch-action:none}.dpad-arrow{position:absolute;display:flex;align-items:center;justify-content:center;width:58px;height:58px;font-size:28px;line-height:1;color:#fff;border-radius:16px;background:#00000057;border:2px solid rgba(255,255,255,.45);box-shadow:0 2px 8px #00000047;pointer-events:none;user-select:none}.dpad-arrow.up{top:0;left:50%;transform:translate(-50%)}.dpad-arrow.down{bottom:0;left:50%;transform:translate(-50%)}.dpad-arrow.left{left:0;top:50%;transform:translateY(-50%)}.dpad-arrow.right{right:0;top:50%;transform:translateY(-50%)}.dpad-arrow.active{background:#2fae5a;border-color:#ffffffd9}#time-button,#weather-button{position:fixed;right:max(18px,env(safe-area-inset-right));z-index:12;width:60px;height:60px;border-radius:50%;border:2px solid rgba(255,255,255,.6);background:#ffffff52;font-size:30px;line-height:1;cursor:pointer;box-shadow:0 3px 10px #00000038;touch-action:manipulation}#time-button{top:max(18px,env(safe-area-inset-top))}#weather-button{top:calc(max(18px,env(safe-area-inset-top)) + 72px)}#time-button:active,#weather-button:active{background:#fff9;transform:translateY(2px)}#fly-button,#land-button,#train-button,#train-exit,#balloon-button,#balloon-exit,#boat-button,#boat-exit,#car-button,#car-exit,#house-button,#house-exit,#pit-dive,#pit-exit,#slide-go{position:fixed;left:50%;transform:translate(-50%);bottom:max(28px,env(safe-area-inset-bottom));z-index:12;padding:16px 30px;font-size:clamp(18px,4.5vw,24px);font-weight:800;border:none;border-radius:999px;cursor:pointer;color:#fff;box-shadow:0 4px 14px #00000047;touch-action:none}#fly-button{background:#2fae5a}#land-button{background:#e8743a}#train-button{background:#2f7db8}#train-exit{background:#e8743a}#balloon-button{background:#b86fd0}#balloon-exit{background:#e8743a}#boat-button{background:#1b8fa0}#boat-exit{background:#e8743a}#car-button{background:#3f8edc}#car-exit{background:#e8743a}#house-button{background:#d44a32}#house-exit{background:#e8743a}#pit-dive{background:#2f9fb8}#pit-exit{background:#e8743a}#slide-go{background:#e85aa0}#fly-button:active,#land-button:active,#train-button:active,#train-exit:active,#balloon-button:active,#balloon-exit:active,#boat-button:active,#boat-exit:active,#car-button:active,#car-exit:active,#house-button:active,#house-exit:active,#pit-dive:active,#pit-exit:active,#slide-go:active{transform:translate(-50%) translateY(2px)}#turbo-button,#run-button{position:fixed;right:max(24px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));z-index:12;width:92px;height:92px;border-radius:50%;border:2px solid rgba(255,255,255,.6);font-size:40px;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none}#turbo-button{background:#e8743a}#turbo-button:active{background:#ff8c4a;transform:scale(.94)}#run-button{background:#2fae5a}#run-button:active{background:#43c46e;transform:scale(.94)}#camera-button{position:fixed;right:max(18px,env(safe-area-inset-right));top:calc(max(18px,env(safe-area-inset-top)) + 144px);width:60px;height:60px;font-size:28px;line-height:1;border:2px solid rgba(255,255,255,.6);border-radius:50%;background:#ffffff52;color:#fff;cursor:pointer;z-index:12;box-shadow:0 3px 10px #00000038;touch-action:manipulation;-webkit-tap-highlight-color:transparent}#camera-button:active{background:#fff9;transform:translateY(2px)}#climb-pad{position:fixed;right:max(24px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));z-index:12;display:flex;flex-direction:column;gap:14px}#climb-up,#climb-down{width:84px;height:84px;border-radius:50%;border:2px solid rgba(255,255,255,.6);background:#ffffff52;color:#234;font-size:36px;font-weight:800;cursor:pointer;touch-action:none}#climb-up:active,#climb-down:active{background:#fff9}#balloon-reset-button{position:fixed;left:50%;transform:translate(-50%);bottom:calc(max(28px,env(safe-area-inset-bottom)) + 70px);z-index:12;padding:14px 26px;font-size:clamp(16px,4vw,22px);font-weight:800;border:none;border-radius:999px;cursor:pointer;color:#fff;background:#b86fd0;box-shadow:0 4px 14px #00000047;touch-action:manipulation}#balloon-reset-button:active{transform:translate(-50%) translateY(2px)}#balloon-score{position:fixed;left:50%;top:max(18px,env(safe-area-inset-top));transform:translate(-50%);z-index:12;padding:8px 18px;border-radius:999px;background:#0000006b;color:#fff;font-size:clamp(16px,4vw,22px);font-weight:800;pointer-events:none;white-space:nowrap}#balloon-score.done{background:#2fae5a}#fire-button{position:fixed;left:max(24px,env(safe-area-inset-left));bottom:calc(max(24px,env(safe-area-inset-bottom)) + 156px);z-index:12;width:92px;height:92px;border-radius:50%;border:2px solid rgba(255,255,255,.6);background:#e8743a;font-size:40px;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none}#fire-button:active{background:#ff8c4a;transform:scale(.94)}
