:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:#62bce3;font-family:Microsoft YaHei,PingFang SC,sans-serif}*{box-sizing:border-box}html,body,#realtime-game{width:100%;height:100%;margin:0;overflow:hidden}body{overscroll-behavior:none;background:#62bce3}button{font:inherit}#realtime-game{isolation:isolate;touch-action:none;position:relative}.realtime-stage,#realtime-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.realtime-hud{z-index:2;pointer-events:none;position:absolute;inset:0}.realtime-topbar{top:max(12px, env(safe-area-inset-top));justify-content:space-between;align-items:center;gap:12px;display:flex;position:absolute;left:12px;right:12px}.realtime-title{color:#fff6d8;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:linear-gradient(135deg,#1b3c27e0,#244f30c7);border:1px solid #fff4cd6b;border-radius:15px;align-items:center;gap:9px;min-width:0;padding:8px 12px 8px 9px;display:flex;box-shadow:0 8px 22px #0e324538,inset 0 1px #ffffff1f}.realtime-title strong{letter-spacing:.05em;text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.realtime-live{color:#dfffc7;letter-spacing:.08em;white-space:nowrap;background:#48803abf;border-radius:999px;align-items:center;gap:5px;padding:4px 7px;font-size:10px;font-weight:700;display:inline-flex}.realtime-live i{background:#af7;border-radius:50%;width:6px;height:6px;animation:1.4s ease-in-out infinite realtime-pulse;box-shadow:0 0 8px #af7}.realtime-camera-button{color:#fff6d8;pointer-events:auto;background:#1d412bd1;border:1px solid #fff4cd6b;border-radius:14px;min-width:52px;min-height:42px;box-shadow:0 8px 20px #0e324533}.realtime-camera-button:active{transform:scale(.96)}.realtime-location{top:max(69px, calc(env(safe-area-inset-top) + 57px));color:#fff9df;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#173726b3;border:1px solid #fff4cd52;border-radius:999px;justify-items:center;gap:2px;padding:7px 13px;display:grid;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 5px 16px #0a2a3a33}.realtime-location span{letter-spacing:.08em;white-space:nowrap;font-size:12px;font-weight:700}.realtime-location small{color:#d9e7c2;letter-spacing:.05em;font-size:9px}.realtime-collision{color:#fff3d5;opacity:0;background:#824226c2;border-radius:999px;margin:0;padding:7px 11px;font-size:11px;transition:opacity .14s,transform .14s;position:absolute;top:137px;left:50%;transform:translate(-50%,-5px);box-shadow:0 5px 18px #44191340}.realtime-collision.is-visible{opacity:1;transform:translate(-50%)}.move-pad{left:max(18px, env(safe-area-inset-left));bottom:max(28px, calc(env(safe-area-inset-bottom) + 18px));pointer-events:auto;touch-action:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#15382b47;border:1px solid #fffade33;border-radius:50%;width:118px;height:118px;position:absolute;box-shadow:inset 0 0 26px #ffffff12,0 8px 24px #0e303e2e}.move-pad-ring{border:1px dashed #fff6d547;border-radius:50%;position:absolute;inset:18px}.move-stick{will-change:transform;background:linear-gradient(145deg,#6f8b47eb,#335b34eb);border:2px solid #fff7d794;border-radius:50%;width:50px;height:50px;margin:-25px;position:absolute;top:50%;left:50%;box-shadow:0 7px 15px #0821254d,inset 0 2px #ffffff2e}.run-button{right:max(24px, env(safe-area-inset-right));bottom:max(43px, calc(env(safe-area-inset-bottom) + 33px));color:#fff5d0;pointer-events:auto;touch-action:none;background:linear-gradient(145deg,#9d6932eb,#5f3d21f0);border:2px solid #ffeeb599;border-radius:50%;place-items:center;width:78px;height:78px;font-size:12px;font-weight:700;line-height:1.1;display:grid;position:absolute;box-shadow:0 9px 20px #27251e42,inset 0 2px #ffffff29}.run-button span{margin-bottom:-6px;font-size:22px;display:block;transform:rotate(-18deg)}.run-button.is-active{filter:brightness(1.18);transform:scale(.94)}.realtime-hint{left:50%;bottom:max(18px, env(safe-area-inset-bottom));color:#f7f1d5;letter-spacing:.03em;opacity:1;white-space:nowrap;background:#173726a3;border-radius:999px;margin:0;padding:7px 11px;font-size:10px;transition:opacity .18s;position:absolute;transform:translate(-50%)}.realtime-hint.is-finished{opacity:0}.realtime-loading{z-index:4;color:#fff6d9;background:radial-gradient(circle at 50% 44%,#7bc7e1a6,#0000 31%),linear-gradient(#58b6de,#84d0e6);place-content:center;justify-items:center;gap:7px;transition:opacity .26s;display:grid;position:absolute;inset:0}.realtime-loading.is-finished{pointer-events:none;opacity:0}.realtime-loading.has-error{color:#fff1dd;background:#3d6f78}.realtime-loading strong{letter-spacing:.12em;margin-top:4px;font-size:17px}.realtime-loading p{opacity:.86;margin:0;font-size:12px}.realtime-loading-orbit{border:3px solid #ffffff38;border-top-color:#fff4bc;border-radius:50%;width:50px;height:50px;animation:.9s linear infinite realtime-spin;box-shadow:0 0 22px #fff4bc38}@keyframes realtime-spin{to{transform:rotate(360deg)}}@keyframes realtime-pulse{50%{opacity:.45;transform:scale(.78)}}@media (min-width:700px){.move-pad{bottom:34px;left:34px}.run-button{bottom:48px;right:40px}}